Full-Stack Web Development
Stranger Things Wiki
A comprehensive Wikipedia-style platform for the Netflix series, featuring dynamic content management for characters, episodes, and locations with secure user authentication.
Project Overview & Context
- The Problem: Crowdsourced encyclopedias frequently suffer from bloated presentation interfaces and lack structural safeguards, leaving data updates vulnerable to malicious injection or unvetted overrides.
- The Solution: A strongly customized, relational database index tailored specifically for parsing lore details from the Stranger Things universe within an isolated content management space.
Key Features & User Flow
- Relational Universe Mapping: Structured schema linking character files directly to corresponding location summaries, quote segments, and season episodes.
- Secure Multi-Tier Authentication: Modular session tracking mechanism evaluating privilege differences between standard readers and database curators.
- Lore Asset Management: Specialized create, read, update, and delete (CRUD) views supporting dynamic updates to character backstories and dialogue tracking.
Technical Architecture & Tech Stack
- Core Logic: Engineered directly on a clean server-side PHP processing framework to ensure zero footprint rendering.
- Database: MySQL database utilizing fully normalized tables to represent cross-entities (e.g., character-episode junction tables).
- Client Actions: JavaScript handles dynamic client-side interactions, filtered queries, and strict form input validation.
- Design Framework: Built upon a responsive Bootstrap foundation for universal readability across devices.
Engineering Challenges & Solutions
Prevention of SQL Injection & Cross-Site Scripting (XSS)
- Situation: Traditional PHP applications are vulnerable to SQL injections and XSS attacks via open input fields (like wiki search boxes or character editor forms).
- Task: Enforce robust database query sanitation and secure user data outputs across the site.
- Action:
- Replaced all raw SQL strings with PHP Data Objects (PDO) Prepared Statements (using parameterized inputs), blocking SQL injection vectors.
- Implemented a global utility wrapper around PHP’s
htmlspecialchars()to sanitize and escape user-submitted content before rendering it inside HTML pages.
- Result: Secure data parsing, fully passing penetration checks on user input fields.
Session Spoofing and Stateful Data Vulnerabilities
- Situation: Malicious users could execute Cross-Site Request Forgery (CSRF) exploits on public update routes, enabling unauthorized updates to the core data layers without legitimate session approval.
- Task: Implement a lightweight, zero-dependency token check system to validate the legitimacy of all form submissions.
- Action:
- Built a secure token utility (
csrf.php) that maps a unique cryptographic string directly into the user’s active session state. - Modified all analytical data updates to validate the hidden form token against the session hash prior to committing database updates.
- Built a secure token utility (
- Result: Protected database content pipelines from remote request injection vulnerabilities without adding complex dependencies.
Gambaran Keseluruhan & Konteks Projek
- Masalah: Ensiklopedia sumber awam sering kali terjejas disebabkan antara muka persembahan yang sarat dan kekurangan perlindungan berstruktur, menyebabkan kemas kini data terdedah kepada suntikan berniat jahat.
- Penyelesaian: Indeks pangkalan data hubungan yang diubah suai khas, direka khusus untuk menganalisis butiran kisah dari dunia Stranger Things di dalam ruang pengurusan kandungan yang terasing.
Ciri-Ciri Teras & Aliran Pengguna
- Pemetaan Alam Hubungan: Skema berstruktur yang menghubungkan rekod watak secara terus ke ringkasan lokasi yang sepadan, segmen petikan, dan episod musim.
- Pengesahan Pelbagai Tingkat Selamat: Mekanisme penjejakan sesi berbilang modul yang menilai perbezaan hak akses antara pembaca biasa dan kurator pangkalan data.
- Pengurusan Aset Kisah: Pandangan bina, baca, kemas kini, dan padam (CRUD) khas yang menyokong kemas kini dinamik untuk latar belakang watak dan penjejakan dialog.
Seni Bina Teknikal & Stack Teknologi
- Logik Teras: Direka terus di atas rangka kerja pemprosesan PHP bahagian pelayan yang bersih untuk memastikan persembahan tanpa beban.
- Pangkalan Data: Pangkalan data MySQL menggunakan jadual terselaras penuh untuk mewakili perhubungan rentas entiti (contohnya, jadual persimpangan watak-episod).
- Tindakan Klien: JavaScript mengendalikan interaksi dinamik bahagian klien, pertanyaan yang ditapis, dan pengesahan borang masukan yang ketat.
- Rangka Kerja Reka Bentuk: Dibina di atas asas Bootstrap yang responsif untuk kebolehbacaan sejagat di pelbagai peranti.
Cabaran Kejuruteraan & Penyelesaian
Pencegahan Suntikan SQL & Skrip Rentas Tapak (XSS)
- Situasi: Aplikasi PHP tradisional terdedah kepada suntikan SQL dan serangan XSS melalui medan masukan terbuka (seperti kotak carian wiki atau borang penyunting watak).
- Tugasan: Melaksanakan pembersihan pertanyaan pangkalan data yang kukuh dan mengamankan output data pengguna di seluruh tapak.
- Tindakan:
- Menggantikan semua rentetan SQL mentah dengan PHP Data Objects (PDO) Prepared Statements (menggunakan masukan berparameter), menyekat vektor suntikan SQL.
- Melaksanakan pembungkus utiliti global di sekitar
htmlspecialchars()PHP untuk membersihkan dan menapis kandungan yang dihantar pengguna sebelum memaparkannya di dalam halaman HTML.
- Hasil: Pemprosesan data yang selamat, lulus ujian pencerobohan pada medan masukan pengguna sepenuhnya.
Penipuan Sesi & Kerentanan Data Keadaan
- Situasi: Pengguna berniat jahat boleh melaksanakan eksploitasi CSRF pada laluan kemas kini awam, membolehkan kemas kini tanpa kebenaran ke lapisan data teras tanpa kelulusan sesi yang sah.
- Tugasan: Melaksanakan sistem semakan token ringan tanpa kebergantungan luar untuk mengesahkan kesahihan semua penyerahan borang.
- Tindakan:
- Membina utiliti token selamat (
csrf.php) yang memetakan rentetan kriptografi unik secara terus ke dalam keadaan sesi aktif pengguna. - Mengubah suai semua kemas kini data analitis untuk mengesahkan token borang tersembunyi berbanding cincangan sesi sebelum memasukkan kemas kini pangkalan data.
- Membina utiliti token selamat (
- Hasil: Melindungi saluran kandungan pangkalan data daripada kerentanan suntikan permintaan jarak jauh tanpa menambah kebergantungan yang rumit.