CRUD - Challenge

8 CRUD Challenge – Te laat meldingen (AI-proof editie)

🎯 Leerdoelen

• Je kunt zelfstandig een volledige CRUD-toepassing bouwen met PDOPHP en PHP.PDO.
• Je pastkunt invoercontrolegebruikersinvoer controleren en gebruikersinteractiefoutmeldingen toe in formulieren.afhandelen.
• Je begrijpt dewaarom rolveilige databasequery's belangrijk zijn.
• Je kunt je eigen ontwerpkeuzes uitleggen en verdedigen.
• Je kunt AI gebruiken als hulpmiddel zonder afhankelijk te worden van prepare(), execute(), en veilige query’s.AI.

💡 Uitleg

InJe deze challenge bouw jebouwt een complete toepassingwebapplicatie waarin te laat meldingen van studenten worden bijgehouden.geregistreerd. JeDe gebruiktapplicatie allesmoet watgegevens je geleerd hebt over forms, PDO, databaseverwerking en CRUD-operaties.

Het eindresultaat is een overzichtspagina met alle meldingen, waarin je nieuwe meldingen kuntkunnen toevoegen, bestaande meldingen kunttonen, wijzigen en meldingen kunt verwijderen (met bevestiging).verwijderen.

Voorbeeld

Je

Bekijkmag AI gebruiken tijdens deze opdracht. De beoordeling gaat echter niet alleen over het voorbeeldeindresultaat, op:maar stampwerk.nl.ook Probeerover jouw begrip van de knop 'Weer eentje te laat' en kijk wat er gebeurt.code.

DeTijdens bedoelingde isbeoordeling datkan een docent willekeurige vragen stellen over jouw code. Kun je eenniet CRUDuitleggen gaathoe maken.jouw Watoplossing iswerkt, eendan CRUD?kunnen Datpunten leggen we zo uit. Eerste het voorbeeld, dat kan je vinden op:

https://stampwerk.nl

vervallen.

Wat is een CRUD?

CRUD staat voor Create, Read, Update en Delete.voor:

• Create → gegevens toevoegen
• Read → gegevens bekijken
• Update → gegevens wijzigen
• Delete → gegevens verwijderen

Deze vier functiesonderdelen zijnvormen samen de basisfunctiesbasis van veel webapplicaties.

---

🛠️ Opdracht

Gegevens die je opmoet een tabel uit de database kan uitvoeren. Stel je hebt een tabel student, je kunt een student toevoegen (Create), je kunt een overzicht krijgen van studenten (Read), je kunt de gegevens van een student aanpassen (Update) en als laatste kun je een student ook weer verwijderen.

De challenge is dat jij een CRUD gaat maken voor te laat meldingen. Maak daarvoor eerst een tabel in de database waarin je te laat meldingen kan registreren.

Als je naar het voorbeeld kijkt dan zie je dat je van een te laat melding de volgende gegevens wilt vastleggen:

registreren

• naamNaam van de student
• klasKlas
• aantalAantal minuten te laat
• de redenReden van het te laat komen.komen

Verplicht extra veld

Bedenk zelf minimaal één extra veld dat volgens jou nuttig is.

Voorbeelden:

• Datum
• Docent
• Lokaal
• Type melding
• Herhaald te laat

Je moet tijdens de beoordeling kunnen uitleggen waarom je dit veld hebt toegevoegd.

---

🛠️ Stappenplan

Stap 1 – Database maken

• Maak een database en een tabel meldingen.
met
• Gebruik de volgendeverplichte velden:
  • id (INT, AUTO_INCREMENT, PRIMARY KEY)
  • student (VARCHAR)
  • klas (VARCHAR)
  • minuten (INT)
  • reden (TEXT)
  velden.
• Voeg zelfje enkeleeigen (extra veld toe.
• Voeg minimaal 3)5 testregelstestrecords toe via PHPMyAdmin. toe.

Ontwerpvraag

Leg in een tekstbestand van minimaal 100 woorden uit:

• Waarom heb je voor dit extra veld gekozen?
• Welke datatype heb je gekozen?
• Waarom past dit datatype bij jouw veld?

---

Stap 2 – Read:Read overzicht maken

(Overzicht)

• Maak read.phpeen waarinoverzichtspagina.
je
• Toon alle meldingenvelden toontuit inde een HTML-tabel.database.
• GebruikToon requirehet 'connection.php'totaal vooraantal meldingen boven de databaseverbinding.
• Gebruik query() en fetchAll() om gegevens op te halen.tabel.
• Voeg bovenaan knoppen toe voor “toevoegen”toevoegen, wijzigen en “zoeken”.
• "zoeken" staat er als knop maar hoef je niet uit te werken.verwijderen.

Extra uitdaging

Bedenk zelf één extra functie voor het overzicht.

Voorbeelden:

• Sorteren op naam
• Sorteren op minuten te laat
• Kleurregels voor ernstige meldingen
• Totaal aantal minuten te laat tonen
• Laatste meldingen bovenaan

Je kiest zelf welke functie je bouwt.

---

Stap 3 – Create:Create melding toevoegen

(Toevoegen)

• Maak create.php met een formulier.
• Voeg invoervelden toe voor student, klas, minuten en reden.
• Sla de gegevens op met een INSERT-queryprepared viastatement.
• Gebruik prepare() en execute().
• Controleer

invoer:

Verplichte invoercontrole

• geenGeen lege veldenvelden.
• minutenMinuten ismoet eengroter positiefzijn getal
dan

0.

ToonMinuten eenmag foutmeldingniet bijgroter ongeldigezijn invoerdan en een succesmelding bij correcte invoer.240.

Front-end controle mag, en back-end controleStudentnaam moet enminimaal je2 moettekens kunnen laten zien dat het werkt.bevatten.

Extra uitdaging (verplicht)

Bedenk zelf nog één extra validatie.

Voorbeeld:

• Klas moet beginnen met "SD"
• Reden moet minimaal 10 tekens bevatten
• Datum mag niet in de toekomst liggen

---

Stap 4 – Delete: melding verwijderen

Delete

• Voeg op read.php een knopverwijderknop “verwijder” toe per rij.toe.
• LaatVraag dezeeerst verwijzenom naar delete.php?id=....bevestiging.
• Toon eerst een bevestigingspagina met de gegevens van de melding.
melding
• Voervoordat pasdeze naverwijderd bevestiging de DELETE-query uit.wordt.

Extra uitdaging (verplicht)

Laat op de bevestigingspagina duidelijk zien welke student verwijderd gaat worden.

Voorkom dat een gebruiker zomaar een niet-bestaand ID kan verwijderen.

---

Stap 5 – Update

• Voeg op read.phpMaak een knop “wijzig” toe per rij.
• Laat deze verwijzen naar update.php?id=....wijzigpagina.
• Controleer op de update pagina of het id is meeggegeven em of het idID bestaat.
• OntbreektToon foutmeldingen als het idID of is deze niet aanwezig dan laat je een foutmelding zien.ontbreekt.
• Haal deVul bestaande gegevens opautomatisch met een SELECT-query.
• Toon een formulier met ingevulde waarden.in.
• Werk de gegevens bij met een UPDATE-UPDATE-query.

Extra uitdaging (verplicht)

Toon bovenaan de pagina welke melding wordt aangepast.

Bijvoorbeeld:

Melding #17 wijzigen
Student: Max Janssen

---

🔒 Veiligheid

Je moet kunnen uitleggen:

• Waarom prepare() veiliger is dan een gewone query.
• Wat SQL-injection is.
• Waarom invoercontrole belangrijk is.

---

🤖 AI-verantwoording

Maak een bestand ai-gebruik.txt.

Beschrijf hierin:

• Welke AI-tool(s) je hebt gebruikt.
• Waarvoor je AI hebt gebruikt.
• Welke code je zelf hebt aangepast.
• Welke fout je bent tegengekomen en hoe je die hebt opgelost.

Minimaal 150 woorden.

---

🧠 ReflectieMondelinge controle

Tijdens de beoordeling kiest de docent willekeurig drie onderdelen uit jouw code.

Je moet kunnen uitleggen:

• Wat hebde code doet.
• Waarom je geleerddeze overoplossing hethebt werken met databases in PHP?
• Wat ging er goed, en waar had je hulp bij nodig?
• Wat zou je in een volgend project anders aanpakken?gekozen.
• Hoe zorg je ervoor dat jede database veiligerbij blijftbetrokken bij gebruikersinvoer?is.

---

📤 Inleveren

1. EénScreenshot screenshot van je overzichtspagina (read.php).overzichtspagina.
2. EénScreenshot screenshot van je invoerpagina (create.php).invoerpagina.
3. EénScreenshot screenshotwijzigpagina.
van je wijzigpagina (update.php).
4. SQL-export.
5. Alle PHP-bestanden, SQL-export van de database, en eventuele CSS.bestanden.
6. Een reflectieverslag in .txt of .pdf met de bovenstaande vragen beantwoord.Reflectieverslag.
7. Maak een afspraak met een docent die je uitlegt hoe je code werkt.ai-gebruik.txt.

---

📊 Puntentelling

Je moet minimaal 81 van de 100 punten halen om deze opdracht succesvol af te ronden.

datatypesenprimarykeyeennieuwemeldingtoe, nettebestandsstructuur.

Punten	Onderdeel
105	DatabaseDatabaseontwerp eninclusief tabel:eigen juisteextra velden,veld.
5	Read-overzicht zijnwerkt aangemaakt.correct.
10	Read:Nette overzichtspaginavormgeving toonten meldingen correct in een tabel.gebruiksvriendelijkheid.
10	Layout:Create netteinclusief opmaakverplichte met CSS (Bootstrap, Tailwind, ...), duidelijke structuur. Gebruik het voorbeeld als uitgangspunt.validaties.
205	Create:Eigen formulierextra voegtvalidatie.
5	Delete inclusief invoercontrole.bevestiging en foutafhandeling.
10	Invoercontrole:Update negatieveinclusief of ongeldige invoer wordt opgevangen met een melding.foutafhandeling.
10	Delete:Zelfgekozen verwijderenextra werkt inclusief bevestiging én juiste studentnaam.
20	Update: bestaand record kan worden aangepast via een formulier met ingevulde velden.functie.
10	CodekwaliteitCodekwaliteit, &PDO, veiligheid: gebruik van prepare(), execute(),.
30	Uitleg code

Je moet minimaal 90 van de 100 punten halen om de opdracht succesvol af te ronden.