Systeemarchitectuur & Culinair platform
Een op maat gemaakte webapplicatie gebouwd met PHP en MySQL voor het ontdekken, bereiden en delen van kookrecepten. Het platform beschikt over realtime asynchroon zoeken via de Fetch API, een beveiligd ledengedeelte met Bcrypt-wachtwoordhashing en strikte MIME-validatie voor receptafbeeldingen.
┌─────────────────────────────────────────────────────────────────────────────┐
│ Cuisinea Full-Stack Web Architecture │
└──────────────────────────────────────┬──────────────────────────────────────┘
│
┌───────────────────────────┼───────────────────────────┐
▼ ▼ ▼
🔍 Moteur Asynchrone (AJAX) 👤 Espace Membre & Sécurité 🍲 Modèle de Données (SQL)
• Fetch API en temps réel • Hash Bcrypt / Argon2 • Tables categories & recipes
• Requête SQL LIKE préparée • Sessions PHP & Rôles • Clés étrangères & Contraintes
• Filtrage par catégories • Envois SMTP (PHPMailer) • Validation MIME binaire
• Injection DOM sans reload • Protection XSS & Uploads • Chargement différé (Lazy)
Direct asynchroon zoeken
JavaScript ES6 Fetch API-zoekmachine die de MySQL-database realtime bevraagt zonder de pagina opnieuw te laden.
Ledengedeelte & Beveiliging
Registratie- en inlogsysteem met cryptografische wachtwoordhashing en geautomatiseerde SMTP-notificaties via PHPMailer.
Strikte uploadvalidatie
Binaire bestandscontrole met getimagesize() en unieke veilige bestandsnamen via slugify() en uniqid().
1. Functionele modules & Gebruikerservaring
Ergonomisch ontworpen modules om het ontdekken en toevoegen van recepten eenvoudig te maken:
Dynamische startpagina
Willekeurige selectie van 3 recepten bij elk bezoek voor continue culinaire inspiratie.
RAND() SQLCartes dynamiquesBootstrap 5
Gedetailleerde receptpagina
Overzichtelijke presentatie met ingrediënten per regel en genummerde stapsgewijze kookinstructies.
IngrédientsÉtapes pas-à-pasnl2br
Recepten toevoegen & Beheren
Beveiligd formulier voor ingelogde leden met categorieselectie en gecontroleerde foto-uploads.
Upload MIMEslugify()uniqid()
2. Asynchroon zoeken & SQL-beveiliging
Het search.php-script voert voorbereide multi-criteria SQL-query's uit en beschermt volledig tegen SQL-injecties:
// Requête préparée multi-critères sécurisée (search.php)
$sql = "SELECT * FROM recipes
WHERE (? = '' OR title LIKE ?
OR description LIKE ?
OR ingredients LIKE ?)
AND (? = '' OR category_id = ?)";
$stmt = $pdo->prepare($sql);
$stmt->execute([
$searchTerm, "%$searchTerm%", "%$searchTerm%", "%$searchTerm%",
$category, $category
]);
- Universele tekstuele zoekfunctie: Gelijktijdig zoeken in recepttitels, beschrijvingen en ingrediënten met de SQL LIKE-operator.
- Categoriefiltering: Direct filteren op maaltijdtype (Voorgerechten, Hoofdgerechten, Desserts), dynamisch geladen via de API.
- Melding bij geen resultaten: Vriendelijk en duidelijk bericht wanneer er geen recepten overeenkomen met de zoekcriteria.
3. MySQL-datamodel & Relationeel schema
Genormaliseerd relationeel database-ontwerp dat de integriteit tussen recepten, categorieën en gebruikers waarborgt:
| Tabel |
Belangrijkste kolommen |
SQL-typen |
Beschrijving & Beperkingen |
| categories |
id, name |
INT, VARCHAR(255) |
Receptcategorieën met automatisch ophogende primaire sleutel. |
| recipes |
id, category_id, title, description, ingredients, instructions, image |
INT, TEXT, VARCHAR(255) |
Recepten gekoppeld aan categorieën via vreemde sleutels, met ingrediëntenlijsten en bereidingsstappen. |
| users |
id, first_name, last_name, email, password, role |
INT, VARCHAR(255) |
Gebruikersaccounts met unieke e-mailbeperking en veilig gehashte wachtwoorden. |
4. Technische componentenmatrix
| Component |
Technische implementatie |
Gebruikers- & Prestatievoordeel |
| Asynchroon zoeken |
JavaScript ES6 Fetch API + search.php |
Vloeiende ervaring Directe dynamische filtering zonder herladen van de pagina |
| Prepared Statements (PDO) |
PHP PDO Prepared Statements |
Maximale veiligheid Volledige bescherming tegen SQL-injectiekwetsbaarheden |
| Upload-sanitisatie |
getimagesize() + slugify() + uniqid() |
Bestandsintegriteit Blokkeert vermomde uitvoerbare bestanden en voorkomt overschrijvingen |
| Wachtwoordhashing |
password_hash() & password_verify() (Bcrypt) |
Gegevensbescherming Standaard conform beheer van inloggegevens met Bcrypt |