01 — Overview
Overview
“Jollof” is a full-stack web app celebrating traditional Ghanaian food — from Jollof rice to Kelewele — built in vanilla PHP and MySQL for Arden University's Web Application Development module.
It pairs a clean public site (home, recipes, search, about) with a secure administrative area behind a login. The admin can create, read, update and delete recipes with full CRUD, and it's where I focused on doing the fundamentals properly: prepared statements everywhere, validated inputs and uploads, soft deletes, and an AJAX live-search that filters without a page reload.
02 — Problem
The problem
The brief was to build a database-backed web application with a public interface and a secured admin interface offering full CRUD — and to do it with genuine attention to security and code quality, not just a working demo.
The content itself needed a clear model: recipes with a category, a description, step-by-step instructions, prep and cook times, a difficulty and an image.
03 — Requirements
Requirements
- A public site to browse, view and search recipes.
- A secure, authenticated admin area with full CRUD.
- A relational MySQL schema behind it.
- Safe data handling — prepared statements, input validation, safe uploads.
- A responsive, accessible interface.
05 — Solution
The solution
The public site presents a featured dish, category browsing and search over a catalogue of Ghanaian recipes. The admin area, gated by a hashed-password login, provides the full create/read/update/delete lifecycle over recipes.
Every database interaction uses prepared statements to separate SQL from user input, inputs are validated and sanitised, and uploaded images are checked for type and size before being stored. Deletes are soft — recipes move to a Trash and can be restored — and the edit form shows a live preview as you type.
The standout admin feature is an asynchronous live-search in “Manage Recipes”: JavaScript + AJAX call the PHP backend to filter the table dynamically, with no full page reload.
06 — Architecture
System architecture
A server-rendered PHP application over MySQL. Shared includes handle configuration, the admin session/auth guard, and image upload; page scripts render the public pages and the admin CRUD flows. The live-search endpoint returns filtered results to the browser over AJAX.
Security is applied at the data boundary — prepared statements for every query, validation and sanitisation on input, and type/size checks on uploads — rather than bolted on afterwards.
07 — Data
Database design
A recipe belongs to a category and carries a title, short description, instructions, prep and cook times, a difficulty and an image path. A soft-delete timestamp preserves removed recipes for restore, and admin users authenticate against a hashed password. Ingredients are modelled relationally through a junction table.
08 — Features
Key features
Public recipe site
Home, category browsing, search and recipe detail for traditional Ghanaian dishes.
Secure admin CRUD
A hashed-password login gates full create, read, update and delete over recipes.
AJAX live-search
The admin's Manage Recipes list filters dynamically via JavaScript + AJAX, with no page reload.
Prepared statements
Every query uses prepared statements, separating SQL logic from user input to prevent injection.
Safe image uploads
Uploaded images are validated for file type and size before being stored.
Soft deletes & trash
Removed recipes move to a Trash and can be restored, rather than being destroyed.
Live preview on edit
The edit form previews the recipe card live as fields change.
09 — Engineering
Implementation decisions
Prepared statements everywhere
All database access is parameterised, keeping SQL logic separate from user input.
AJAX over the PHP backend
The live-search fetches filtered results asynchronously, demonstrating JS + AJAX + PHP working together.
Soft delete over hard delete
Deleting sets a timestamp and moves the recipe to Trash, so it stays recoverable.
Validated uploads
Image uploads are checked for type and size before being written to the server.
10 — Challenges
Challenges & how I solved them
Building the live-search
Wiring JavaScript, AJAX and the PHP backend so the table filters smoothly without a reload took careful handling of requests and rendering.
Safe input and uploads
Applying prepared statements, validation/sanitisation and upload checks consistently was the security discipline the module rewarded.
12 — Interface
Screenshots
13 — Outcome
Results
- A working, deployed recipe web app with a polished public site and a full admin CRUD area.
- Security fundamentals applied properly — prepared statements, validation and safe uploads throughout.
- A demonstrable grasp of JavaScript, AJAX and PHP working together in the live-search.
14 — Reflection
Lessons learned
Prepared statements and input validation are the baseline for any database-backed app — not an afterthought.
A small async touch like live-search noticeably improves how responsive an admin tool feels.
15 — What's next
Future improvements
- Tagging and richer public search and filtering.
- User accounts so visitors can save favourite recipes.
16 — Toolchain