Blok 4 - PHP


Prompt Engineering 1

Introductie

Prompt Engineering is alsof je een buitenstaander die niets van je weet iets wilt vragen. Omdat te doen moet je dus duidelijk en geod communiceren.

image.png

We gaan leren hoe we goede prompt kunnen schrijven.

Voor een goede prompt moet je rekening houden met de volgende zaken:

    1. Context - een goede propmt heeft voldoende contexrt.
    2. Details/Specifiek - een goed prompt heeft voldoende details en is zo specifiek mogelijk.
    3. Duidelijkheid - een goede prompt is duidelijk.
    4. Doelgericht - een goede prompt is doelgericht.
    5. Vorm - in een geode prompt kan je de output in een bepalade vorm vragen.
    6. Toon -door in de prompt de toon op te nemne, bepaal je de vorm van het antwoord.

Al deze punten worden stuk-voor-stuk behandeled. De eerste drie zijn rood omdat élke prompt altijd moet voldoen aan deze kenmerken.

Maar laten we eerst even kiijk wat nu eigelijk promting precies is.

Wat is prompting?

Prompting betekent dat je iets vraagt aan een AI, zoals ChatGPT, op een manier waardoor je een goed antwoord krijgt. Je geeft een opdracht of stelt een vraag, en dat noemen we een prompt.

Je kunt het vergelijken met hoe je een klasgenoot iets vraagt:

  1. Als je gewoon zegt: “Doe dit,” snapt die ander misschien niet precies wat je bedoelt.
  2. Maar als je zegt: “Kun je me helpen met deze code, want ik snap het niet?", is dat al een stukje beter.
  3. Maar het kan nog beter: "Kun je me helpen met deze code want ik krijg een foutmelding 'unknown variable on line 23', ik snap niet wat de foutmelding betekent? '".
  4. En zelfs dit kan nog beter want je vergeet een belangrijk detail, zie jij welke detail?

Kort gezegd: prompting is het slim stellen van een vraag of opdracht aan AI, zodat je krijgt wat je nodig hebt.

In de laatste zin staat niets over in welke omgeving en met welke programmeertaal je werkt. Ook zou je kunnen overwegen om de code of een stuk daarvan mee te sturen.

✍️ Opdracht 1

Verbeter de prompt die hierboven bij punt 4 staat.

1. Context

We hebben geleerd dat een goede prompt detail en context heeft.

Context is een soort van omgeving.

Als je vraagt om code aan passen dan moet je dus aangeven wat de 'omgeving' is, in dit geval PHP en als het je bepaalde frameworks gebruikt of andere zaken die van belang zijn dan noem je die ook. 

✍️ Opdracht 2

Situatie

Je hebt de volgende PHP-code gekregen.

Deze code toont de huidige datum:

<?php
echo date("Y-m-d");
?>

Maar jij wil dat de datum verschijnt in het Nederlands, zoals: 9 mei 2025

De AI moet je helpen om de code aan te passen.

📝 Jouw taak:

  1. Schrijf een prompt aan ChatGPT waarin je vraagt om deze code aan te passen zodat de datum in het Nederlands verschijnt.

  2. Let erop dat je duidelijk aangeeft wat de context is:

     

    • Je werkt met PHP

    • De code moet draaien op een gewone server (geen framework zoals Laravel)

    • Je wil de datum in het Nederlands

Inleveren

  1. Screenshot van de prompt en het antwoord dat je hebt gekregen.
  2. Screenshot van het resultaat in je browser.

2. Detail/Specifiek

Doel

Je leert hoe belangrijk detail en specificiteit zijn in een goede prompt. Hoe specifieker je bent, hoe beter de AI je kan helpen met het schrijven of verbeteren van PHP-code.

📚 Theorie

Een goede prompt bevat concrete dingen en bevat geen (of zo min mogelijk) 'vage' termen.

Test je prompt

Als je over een prompt vragen kan stellen dan is die niet 100% concreet.

Voorbeeld prompt:

Maak de bannder iets breder en verander het letter type zodat het groter is.

Wat is 'iets breder' en wat is 'groter'?

Beter zou zijn:

Maak de banner 5% breder en maak het font 2px groter.

✍️ Opdracht 3

Situatie

Je wil een contactformulier in PHP laten maken door ChatGPT.

Jouw taak

  1. Schrijf een prompt aan ChatGPT waarin je duidelijk vraagt om een contactformulier in PHP.

    Je moet in je prompt minimaal deze 4 dingen specifiek vermelden:

    • Welke velden het formulier moet hebben (bv. naam, e-mail, bericht)

    • Wat er met de data moet gebeuren (bijv. opslaan, versturen, tonen)

    • Of er foutcontrole moet zijn (bijv. verplicht invullen, geldig e-mailadres)

    • Of er een succesmelding moet komen na het verzenden

Inleveren

  1. Screenshot van de prompt en het antwoord dat je hebt gekregen.
  2. Screenshot van het resultaat in je browser.

3. Duidelijkheid

Duidelijk betekent dat je prompt voldoende detail bevat. Hierdoor is het duidelijk wat je precies bedoeld.

Een duidelijke prompt zegt precies:

  1. Wat je wil

  2. Waarvoor je het wil

  3. Wat de beperkingen zijn
  4. En eventueel hoe je het eruit wil laten zien

Een voorbeeld van de punten zijn:

  1. Je wilt een website
  2. Je wilt een website waarin de gebruiker zijn naam en adres moet opgeven.
  3. Alle velden moeten op één web pagina passen en bestaat uit HTML en CSS.
    De velden zijn allemaal verplicht. Zodra de submot button wordt ingedrukt wordt gecontroleerd of alle velden zijn ongevuld. Als dat niet het geval is dan volgt er een aanwijzing/waarschuwing.
  4. Het moet er eenvoudig en professioneel uitzien, Gebruik 'Tailwind' als CSS framework.

📝 Opdracht 4

Situatie

Je wil een AI vragen om een klein PHP-script te maken waarmee je een getal controleert: is het even of oneven?

Hieronder zie je een voorbeeld van een vage prompt. Lees hem goed.

“Schrijf iets in PHP dat met getallen werkt.”

Je gaat nu zelf een duidelijke prompt schrijven waarin je vraagt om een PHP-script dat:

Inleveren

  1. Screenshot van de prompt en het antwoord dat je hebt gekregen.
  2. Screenshot van het resultaat in je browser.

4. Doelgericht

📚 Theorie

📝 Opdracht

Situatie

Je wil begrijpen hoe een while-loop werkt in PHP, en je wil dat de AI het aan je uitlegt.

Deel 1: Vergelijk twee prompts

Prompt A (niet doelgericht):

“Wat is een while-loop?”

Prompt B (wel doelgericht):

“Leg uit wat een while-loop in PHP doet. Geef een voorbeeld met code en uitleg in simpele taal, zodat ik het kan gebruiken in een quiz voor klasgenoten.”

🔍 Wat is het verschil tussen A en B?

Deel 2: Schrijf je eigen doelgerichte prompt

Bedenk nu een onderwerp in PHP dat jij lastig vindt (bijvoorbeeld: arrays, forms, functies, POST vs GET…).

Schrijf een doelgerichte prompt waarbij je duidelijk maakt wat je wil, in welke vorm, en voor wie het bedoeld i

Inleveren

  1. Deel 1, leg in je eigen woorden uit wat het verschil is tussen prompt A en prompt B.
  2. Deel 2, schrijf je eigen doelgerichte prompt (zie beschrijving deel 2). 

5. Vorm

📚 Theorie (kort samengevat)

Opdracht

Deel 1: Slechte prompt (voorbeeld)

“Leg uit hoe je een formulier maakt met PHP.”

Wat is hier onduidelijk over de vorm van het antwoord?

Deel 2: Schrijf zelf een betere prompt

Jij gaat nu een betere prompt schrijven waarin je duidelijk zegt in welke vorm je het antwoord wil krijgen. Kies een vorm, zoals:

📌 Vergeet niet te vermelden dat je werkt met PHP, en dat het voor een beginner is.

Inleveren

....

6. Toon

📚 Theorie

📝 Opdracht

Situatie:

Je wil dat ChatGPT uitlegt wat een functie in PHP is.

Je gaat dezelfde uitleg in verschillende tonen laten geven.

Stap 1: Schrijf drie verschillende prompts

Gebruik hetzelfde onderwerp (“Wat is een functie in PHP?”) en verander alleen de toon.

  1. 🎩 Formeel en technisch (voor iemand met programmeerervaring):

  2. 😄 Grappig en speels (alsof je het uitlegt aan een kind van 12):

  3. 💬 Duidelijk en vriendelijk (voor een klasgenoot die net begint met PHP):

Inleveren

  1. Welke toon vond jij het meest duidelijk voor een beginner?

  2. Welke toon past het best bij jouw klasgroep?

  3. Welke toon past het best bij jouw klasgroep?

  4. Wat gebeurt er als je géén toon vraagt in je prompt?

Samengevat

Een goede prompt.

  1. Context – Geef achtergrondinformatie, zoals voor wie het is, wat het doel is, of waar het over moet gaan (welke programmeertaal?).
  2. Detail – Hoe specifieker je bent, hoe beter het antwoord past bij wat je zoekt.
  3. Duidelijkheid – Gebruik duidelijke en begrijpelijke taal. Vermijd vage of dubbelzinnige zinnen.
  4. Doelgerichtheid – Geef aan wat je precies wil (bijvoorbeeld: een uitleg, een lijst, een verhaaltje, een vergelijking, enz.).
  5. Vorm – Soms helpt het als je zegt hoe het antwoord eruit moet zien (bijvoorbeeld: “maak er een tabel van”, “gebruik korte zinnen”, “schrijf het op het niveau van een brugklasser”).
  6. Toon/Stem – Wil je dat het grappig is? Serieus? Zakelijk? Kinderlijk? Dat kun je ook zeggen in je prompt.

Voorbeeld prompt

“Leg uit wat een if-statement is in PHP. Geef een simpel voorbeeld met uitleg in makkelijke taal. Ik ben 14 en net begonnen met PHP, dus graag zonder moeilijke woorden. Laat ook zien wat er gebeurt als de voorwaarde niet waar is.”

Opdracht 3

Maak een prompt waarin je aan AI vraagt om een programma in HTML-pagina te maken die er zo goed mogelijk lijkt op deze website template.

image.png

Probeer dit in één tekst prompt te doen (gebruik dus géén plaatje) en denk aan alle 6 eigenschappen voor een geode prompt.

Inleveren

  1. Prompt die je hebt gemaakt (schermafdruk).
  2. Resultant (schermafdruk van de webpage).

PHP Intro

1 Front-End en Back-End

🎯 Leerdoelen

Wat is frontend?

👉 Vergelijking: de menukaart en bediening van een restaurant.

Wat is backend?

👉 Vergelijking: de keuken van een restaurant.

Client en server

De computer is geen restaurant, maar je kunt het er wel mee vergelijken: de webbrowser waar de bestellingen worden opgenomen en de webserver (ergens in de cloud) is de keuken.

image-1655279215130.png

Bestandsoorten

We kennen al HTML en CSS, later gaan we ons verdiepen in Javascript en PHP.

Bestandssoorten Functie Waar
HTML Basis opmaak van een webpagina Front-end / browser
CSS Detail opmaak van een webpagina Front-end / browser
JavaScript Interactie programmeren in de browser Front-end / browser
PHP Interactie programmeren op de server Back-end / server

Opdracht 1

Geef van elk van de onderstaande situatie wat het is:

front-end, back-end of beiden?

Licht elk antwoord in eigen woorden toe.


Situatie

Front-end, back-end, beiden

Toelichitng

1

Je klikt op een knop om een filmpje te starten.



2

Je stuurt een contactformulier in en krijgt “Bedankt voor je bericht!”.



3

Een webwinkel controleert of er nog voorraad is.



4

Je ziet de kleuren en lettertypes van een website veranderen.



5

Een systeem herkent of je het juiste wachtwoord hebt ingevuld.



6

Je krijgt je resultaten na een online quiz.



Opdracht 2

Beantwoord de volgende vragen in eigen woorden

Inleveren

Open het Word document Opdracht Front-end backend.docx en beantwoord de vragen uit opdracht 1 en opdracht 2. Bewaar het bestand als PDF en lever dat in.

2 Installeren XAMPP

Wij hebben (nog) geen webserver in de cloud. In plaats daarvan gaan we een soort 'nep-server' gebruiken en hiervoor gaan we XAMPP installeren.

Download de software

Google of download de juiste versie van apachefriends

Voer de installatie uit

Je hebt alleen Apache en MySQL nodig, de andere opties kan je beter niet installern.

Als er wordt gevraagd om php.exe aan het path toe te voegen dan kies je ja/yes. Alle andere opties kun je laten staan zoals ze default staan.

Opstarten XAMPP

Als het goed is, is er tijdens de installatie een short-cut gemaakt die heet XAMPP Control.

Deze shortcut voert C:\xampp\xampp-control.exe uit.

Druk op de eerste twee knopjes start naast Apache en MySQL. Hiermee start je de webserver en de database op. Als alles goed is dan zie je het volgende.

XAMPP Instellingen

We gaan een paar dingen anders instellen.

Allereerst gaan we de database als Windows-service laten draaien dat verhoogt de stabiliteit.

1 Stop XAMPP

Stop XAMPP en als dat niet lukt, restart je machine of gebruik de Windows task manager om XAMPP te stoppen.

2 Properties xampp-controll.exe

Ga via de file explorer naar c:\xampp\ en zoek naar xampp-controll.exe, selecteer met rechtermuis propertjes (of eigenschappen).

3 Compatibily 'Run this program as an administror'

Selecteer onder het tabje Compatibily 'Run this program as an administror'

4 OK en klaar.

.image-1671310391146.png

5 Start XAMPP

Sluit XAMPP en start XAMPP opnieuw op.

6 Groen vinkje

Druk op het rode kruisje links naast MySQL. Het kruisje wordt een groen vinkje.

image-1687096321945.png

7 index.php weg

Tenslotte, ga naar c:\xampp\htdocs\ en gooi het bestand index.html weg.

Waarom dat is dat zien we later als we met XAMPP gaan werken.

Opdracht

Voer ale 7 stappen uit.

Inleveren

  1. Screenshot van XAMPP Control panel met (minimaal) één groen vinkje en Apache en MySQL gestart.
    Er zijn geen rood gekleurde foutmeldingen te zien.

3 Installatie Visual Studio Code

In deze les leer je hoe je Visual Studio Code installeert, waarom we een code editor gebruiken, en hoe je PHP-bestanden opent vanuit de htdocs-map.

🔰 Wat gaan we doen?

💡 Waarom Visual Studio Code?

Zonder goede editor werk je in Kladblok of iets simpels – dat is lastig lezen, foutgevoelig en traag werken.

📚 Installatie

1. Ga naar de officiële website: https://code.visualstudio.com/

2. Klik op Download for Windows

3. Start het installatieprogramma en kies de standaardinstellingen (volgende, volgende...)

4. Vink aan: "Add to PATH" en "Open with Code" in contextmenu als dat wordt gevraagd

📚 Eerste keer openen

Open Visual Studio Code. Je ziet een startscherm. Je hoeft je nergens aan te melden.

🛠️ Openen van een PHP-bestand

  1. Ga in VSC naar File > Open Folder
  2. Navigeer naar de map htdocs op jouw computer (bijv. C:\xampp\htdocs)
  3. Klik op Select Folder
  4. In de linkerbalkmaak je nu een nieuw bestand en die noem je test.php
  5. Klik op een bestand om het te openen en te bewerken

Tip: Klik met rechts op het bestand en kies "Reveal in File Explorer" als je het ook in Verkenner wil zien.

💡 Extra VSC Tips

Opdracht

Zet dit in het bestand test.php

<?php

echo "TEST";

Sla op en ga nu mert de browser naar https://localhost/test.php

Wat zie je?

🧠 Reflectie

Niet inleveren mar probeer dit voor je zefl te beantwoorden als voorbereiding op de Kennis-Check.

📤 Inleveren

Maak een screenshot van:

  1. Visual Studio Code met een geopend bestand uit htdocs

4 Jouw eerste PHP-pagina

In deze les ga je jouw allereerste PHP-pagina maken. Je leert hoe je PHP-code schrijft en uitvoert, en hoe je PHP en HTML samen kunt gebruiken.

🔰 Wat gaan we doen?

ℹ️ Uitleg

Voorbeeld 1: eenvoudige tekst

<?php
echo "Hallo wereld!";
?>

Toont de tekst "Hallo wereld!" in je browser.

Voorbeeld 2: HTML + PHP

<!DOCTYPE html>
<html>
<body>
  <h1>Welkom</h1>
  <p><?php echo "Dit is gegenereerd door PHP!"; ?></p>
</body>
</html>

Hierin zie je dat je PHP kunt combineren met gewone HTML.

🛠️ Opdracht 3A

Maak een bestand intro.php in de map htdocs en zet daarin:

<html>
<body>
  <h2>Over mij</h2>
  <p>
    <?php
      echo "Hallo! Ik ben [jouw naam] en dit is mijn eerste PHP-pagina.";
    ?>
  </p>
</body>
</html>

🛠️ Opdracht 3B – Extra

Laat meer zinnen zien met meerdere echo-regels en gebruik <br> om af te breken:

<?php
echo "Ik hou van programmeren.<br>";
echo "Mijn favoriete kleur is blauw.<br>";
echo "PHP is best leuk!";
?>

📌 Tip: combineer dit in een klein "dagboekje over jezelf".

🧠 Afsluiting

📤 Inleveren

  1. Screenshot van de pagina in je browser met jouw naam zichtbaar

5 Variabelen en Strings in PHP

In deze les leer je hoe je gegevens kunt opslaan in variabelen, hoe je met tekst (strings) werkt, en hoe je deze informatie kunt tonen op je website met PHP.

🔰 Wat gaan we doen?

💡 Wat is een variabele?

Voorbeeld

<?php
$naam = "Fatima";
$leeftijd = 16;
echo "Hallo, mijn naam is " . $naam . " en ik ben " . $leeftijd . " jaar oud.";
?>

Resultaat: Hallo, mijn naam is Fatima en ik ben 16 jaar oud.

🛠️ Opdracht – Toon jouw info

Maak een bestand opdracht5.php in je htdocs-map.

Vul dit in met jouw eigen gegevens:

<?php
$naam = "Jouw naam hier";
$leeftijd = 15;
$school = "ROC Amstelland";

echo "<h1>Over mij</h1>";
echo "<p>Ik ben " . $naam . " en ik ben " . $leeftijd . " jaar oud.</p>";
echo "<p>Ik zit op " . $school . ".</p>";
?>

🛠️ Opdracht – Extra uitdaging

ℹ️ Uitleg

🧠 Reflectie

📤 Inleveren

  1. Lever je het bestand opdracht.php5i n.
    Je tekst moet minimaal 3 variabelen gebruiken

6 Strings en Getallen in PHP

In deze les leer je het verschil tussen tekst (strings) en getallen (integers) in PHP. Je leert ook wat er gebeurt als je probeert te rekenen met tekst of tekst toevoegt aan een getal.

🔰 Wat gaan we doen?

💡 Wat is het verschil?

Voorbeeld

<?php
$tekst1 = "Hallo";
$tekst2 = "wereld";
$getal1 = 10;
$getal2 = 5;

echo $tekst1 . " " . $tekst2; // Hallo wereld
echo "<br>";
echo $getal1 + $getal2;       // 15
?>

🛠️ Opdracht – Reken met getallen

Maak een nieuw bestand aan in je htdocs-map: rekenen.php

Schrijf een script dat dit doet:

Voorbeeldcode

<?php
$prijs = 7.50;
$aantal = 3;
$totaal = $prijs * $aantal;

echo "<p>Prijs per stuk: €" . $prijs . "</p>";
echo "<p>Aantal: " . $aantal . "</p>";
echo "<p>Totaalprijs: €" . $totaal . "</p>";
?>

💡 Let op met aanhalingstekens!

Als je een getal tussen aanhalingstekens zet, wordt het een string en kun je er niet goed mee rekenen:

$getal1 = "10"; // string
$getal2 = 5;    // integer
echo $getal1 + $getal2; // dit werkt, maar PHP zet de string stilletjes om naar een getal

Tip: Probeer getallen zonder aanhalingstekens te houden als je ermee rekent!

🧠 Reflectie

📤 Inleveren

  1. Lever een screenshot in van jouw rekenen.php in de browser
    Je code moet verschillende berekningen laten zien.

7 Leeftijd check met formulier

In deze les leer je hoe je een formulier maakt dat gegevens doorstuurt naar een PHP-script, en hoe je met if-statements reageert op die gegevens.

🎯 Leerdoelen

🛠️ Formulier maken

Maak een bestand formulier.html aan in je htdocs-map. Zet hierin de volgende code:

<!DOCTYPE html>
<html>
<body>

  <h2>Hoe oud ben jij?</h2>

  <form action="leeftijd.php" method="get">
    <label for="leeftijd">Voer je leeftijd in:</label><br>
    <input type="number" name="leeftijd" id="leeftijd"><br><br>
    <input type="submit" value="Verstuur">
  </form>

</body>
</html>

Uitleg

Dit is een eenvoudig HTML-formulier dat de leeftijd vraag en die deze waarde dan opstuurd naar het bestand leeftijd.php.

🛠️ leeftijd.php

Maak nu een bestand leeftijd.php en voeg dit toe:

<?php
$leeftijd = $_POST["leeftijd"];

echo "<h2>Jouw leeftijd is: " . $leeftijd . "</h2>";

if ($leeftijd >= 18) {
  echo "Je bent volwassen.";
} else {
  echo "Je bent nog geen 18.";
}
?>

Uitleg

Op regel 2 wordt de $leeftijd uit de formulier variable gehaald.

Regel 6 t/m 10 laten zien hoe je een conditiemet een if-then-else in PHP maakt.

🛠️ Opdracht – Zelf uitbreiden

📘 Tip

🧠 Reflectie

📤 Inleveren

  1. Lever een screenshot in van leeftijd.php met een ingevuld formulier en meerdere testleeftijden
    Je code moet minstens 3 if-statements bevatten waarvan minimaal 1 if-then-else.

8 Kortingscalculator met formulier

In deze les maak je een eigen kortingscalculator. Je vult een bedrag en een kortingspercentage in, en de PHP-code berekent de prijs na korting.

🎯 Leerdoelen

🛠️ Stap 1 – Pas je formulier aan

Pas het formulier uit formulier.html aan zodat het er zo uitziet:

<!DOCTYPE html>
<html>
<body>

  <h2>Kortingscalculator</h2>

  <form action="korting.php" method="get">
    <label for="bedrag">Voer het bedrag in:</label><br>
    <input type="number" name="bedrag" step="0.01" required><br><br>

    <label for="korting">Korting (%):</label><br>
    <input type="number" name="korting" step="1" required><br><br>

    <input type="submit" value="Bereken korting">
  </form>

</body>
</html>

🛠️ Stap 2 – Maak korting.php

Maak een nieuw bestand aan in je htdocs-map met de naam korting.php en plak daarin de volgende code:

<?php
$bedrag = $_POST["bedrag"];
$korting = $_POST["korting"];

$kortingBedrag = $bedrag * ($korting / 100);
$nieuwBedrag = $bedrag - $kortingBedrag;

echo "<h2>Resultaat</h2>";
echo "<p>Oorspronkelijk bedrag: €" . $bedrag . "</p>";
echo "<p>Korting: " . $korting . "%</p>";
echo "<p>Korting in euro: €" . round($kortingBedrag, 2) . "</p>";
echo "<p>Bedrag na korting: €" . round($nieuwBedrag, 2) . "</p>";
?>

📘 Uitleg berekening

🛠️ Opdracht 1

🛠️ Opdracht 2

Maak een .txt. of PDF en geef antwoord op de volgende vragen.

Vraag 1

In het formulier staat: <input type="number" name="bedrag" step="0.01" required><br><br>
Wat doet step="0.01"; wat gebeurt er als je step ="1" gebruikt?

Vraag 2

In het formulier staat: <input type="number" name="bedrag" step="0.01" required><br><br>
Wat doet required; wat gebeurt er als je dit weglaat?

Vraag 3

In het formulier staat: <input type="number" name="bedrag" step="0.01" required><br><br>
Verander name="bedrag" naar name="prijs". Test of de berekening nog werkt.

Leg uit wat je moet aanpassen in de code korting.php om de berekning weer te laten werken na deze aanpassingen.

🧠 Reflectie

📤 Inleveren

  1. Het php bestand korting.php
  2. PDF of txt-bestand met de antwoorden op de drie vragen in eigen woorden.

PHP-1

1 Formulieren GET en POST

🎯 Leerdoelen

💡 Uitleg

Bij een formulier kies je of je GET of POST gebruikt om gegevens naar de server te sturen:

Methode Kenmerk Voorbeeld
GET Gegevens worden zichtbaar in de URL (minder veilig) pagina.php?naam=Ali
POST Gegevens worden onzichtbaar verstuurd (veiliger) De gegevens zitten in het HTTP-verzoek, niet in de URL

🛠️ Opdracht 1 – formulier.html (GET)

  1. Maak een bestand formulier.html en zet daar deze code in:
<!DOCTYPE html>
<html>
<body>

  <h2>Wat is je naam?</h2>

  <form action="begroeting.php" method="get">
    <label for="naam">Naam:</label><br>
    <input type="text" id="naam" name="naam" required><br><br>
    <input type="submit" value="Verstuur">
  </form>

</body>
</html>

Let op de method="get" en het attribuut required.

🛠️ Opdracht 2 – begroeting.php (GET)

  1. Maak het bestand begroeting.php met de volgende PHP-code:
<?php
if (isset($_GET["naam"])) {
    $naam = htmlspecialchars($_GET["naam"]);
    echo "<h1>Hallo $naam!</h1>";
} else {
    echo "<p>Geen naam ingevuld.</p>";
}
?>

Uitleg: We controleren met isset() of de waarde bestaat. htmlspecialchars() voorkomt XSS-aanvallen.

Vul het formulier in en kijk wat er gebeurt. Wat zie je op URL als je de begroeting ziet? Pas de tekst na het = teken op de url aan en reload je pagina, wat gebeurt er?

🛠️ Opdracht 3 – POST-versie maken

  1. Pas in formulier.html het formulier aan naar:
<form action="begroeting2.php" method="post">
  1. Maak een nieuw bestand begroeting2.php met deze code:
<?php
if (isset($_POST["naam"])) {
    $naam = htmlspecialchars($_POST["naam"]);
    echo "<h1>Welkom, $naam (via POST)</h1>";
} else {
    echo "<p>Geen naam ontvangen.</p>";
}
?>

🧠 Reflectie

📤 Inleveren

2 Include en Require

🎯 Leerdoelen

💡 Uitleg

Vaak gebruik je op meerdere pagina’s dezelfde stukjes HTML, zoals een menu of een footer. Je kunt dat opslaan in een apart bestand en invoegen met include of require.

Voorbeeld:

Stel, je maakt een bestand header.php met daarin een simpel menu:

<!-- header.php -->
<header>
  <h1>Mijn Website</h1>
  <nav>
    <a href="index.php">Home</a> |
    <a href="info.php">Info</a>
  </nav>
</header>

En dan gebruik je include in een andere pagina:

<?php include "header.php"; ?>

<h2>Welkom op de homepagina</h2>
<p>Dit is de inhoud van index.php</p>
  1. Maak een bestand header.php met een kop en menu zoals hierboven.
  2. Maak een bestand footer.php met daarin bijvoorbeeld:
    <footer>© 2025 Mijn Website</footer>
  3. Maak een bestand index.php met bovenin een include("header.php") en onderin een include("footer.php").

🧠 Reflectie

📤 Inleveren

3 Arrays en Loops

🎯 Leerdoelen

💡 Uitleg

Een array is een soort lijstje waarin je meerdere dingen kunt bewaren, zoals hobby’s of namen.

Een (gewone) variabele is plaats in get computergehuegen waarin je één waarde kan opslaan.

Een array is een variabele die meer dan één waarde kan bevatten.

image.png

Je gebruikt een foreach-loop om elk item uit de array één voor één te gebruiken.

Voorbeeld:

<?php
$hobbies = ["voetbal", "lezen", "gamen"];

foreach ($hobbies as $hobby) {
  echo "<p>Mijn hobby is: $hobby</p>";
}
?>

Resultaat:
Mijn hobby is: voetbal
Mijn hobby is: lezen
Mijn hobby is: gamen

🛠️ Opdracht – Eigen array

Maak een bestand lijst.php en vul dit met een array van 5 dingen die jij leuk vindt (hobby’s, favoriete eten, games…).

💡 Uitleg

Er is ook een ander soort loop; een for-loop. 

Gebruik een for-loop in plaats van foreach:

<?php
$games = ["Minecraft", "FIFA", "Fortnite", "Roblox"];
for ($i = 0; $i < count($games); $i++) {
  echo "<p>" . $i . " Favoriete game: " . $games[$i] . "</p>";
}
?>

De waarde van $games[0] is dus "Minecraft", $games[1] = "FIFA", etc, etc.

Het eerste element in een array heeft een index 0!

🛠️ Opdracht - deel 2

Plaats in de PHP-code (lijst.php) een eigen voorbeeld waarbij je een for-loop gebruikt.

🧠 Reflectie

📤 Inleveren

4 Loops met indexed arrays

🎯 Leerdoelen

💡 Uitleg

Een indexed array is een lijst waarbij elk element een nummer (index) heeft, beginnend bij 0. Bijvoorbeeld:

<?php
$producten = ["Chips", "Cola", "Tandpasta", "Zeep"];
?>

Met een foreach-loop kun je door deze array heen lopen en elk item laten zien:

<?php
foreach ($producten as $product) {
  echo "<p>$product</p>";
}
?>

🛠️ Opdracht – Winkelmandje weergeven

Situatie: Je bouwt een simpele webwinkel. Je hebt een lijst met producten die iemand in zijn winkelmandje heeft geplaatst. Jij zorgt dat de producten netjes op het scherm getoond worden met behulp van een array en een loop.

  1. Maak een nieuw bestand aan met de naam winkelmandje.php.
  2. Maak een indexed array met minimaal 5 producten uit een supermarkt (bijv. "Brood", "Melk", ...).
  3. Gebruik een foreach-loop om de lijst als HTML-lijst (<ul>) weer te geven.
  4. Tel hoeveel producten er in het winkelmandje zitten met count() en toon dat onderaan.

Voorbeelduitvoer:

Totaal: 3 producten

🧠 Reflectie

📤 Inleveren

5 (Associative) Arrays en Loops

🎯 Leerdoelen

💡 Uitleg

Indexed array

Een indexed array gebruikt nummers als 'key'. Dit is handig voor eenvoudige lijsten:

<?php
$namen = ["Fatima", "Noah", "Aziz"];
echo $namen[0];
echo "<br>";
echo $namen[1];
echo "<br>";
echo $namen[2];
echo "<br>";
?>

Associatieve array

Een associatieve array gebruikt zelfgekozen 'keys'. Dit is handig voor gegevens met betekenis:

<?php
$student = [
  "voornaam" => "Fatima",
  "achternaam" => "Bakker",
  "email" => "fatima.bakker@example.com"
];
echo $student['voornaam'];
echo "<br>";
echo $student['achternaam'];
echo "<br>";
echo $student['email'];
echo "<br>";
?>

🛠️ Opdracht – Studentenlijst maken

Test beide voorbeelden.

  1. onder aan de code druk je nog een keer alle waarden af, maar dan door geburik te maken va een loop.
  2. Voeg dan op regel 2 in de eerste code je eigen naam toe en test je code nog een keer. Wat gebeurt er?
  3. Voeg dan tussen achternaam en email voor de student de woonplaats toe. Geef deze een waarde. Test je code nog een keer. Wat gebeurt er?

🧠 Reflectie

📤 Inleveren

6 Functies in PHP

🎯 Leerdoelen

💡 Uitleg

Een functie is een blokje code dat je een naam geeft en later opnieuw kunt gebruiken. Zo hoef je niet telkens dezelfde code opnieuw te schrijven.

Je kunt informatie aan een functie meegeven (dat noem je een parameter) en je kunt iets teruggeven (dat noem je een return).

Voorbeeld:

<?php
function begroet($naam) {
  echo "Hallo, $naam!<br>";
}

begroet("Fatima");
begroet("Ali");
?>

🛠️ Opdracht 1 – Maak je eigen begroetfunctie

  1. Maak een nieuw bestand functie.php
  2. Maak daarin een functie begroet die één parameter accepteert: $naam
  3. Laat de functie een boodschap tonen zoals “Hoi, [naam], welkom terug!”
  4. Roep de functie minstens 3 keer aan met verschillende namen.

🛠️ Opdracht 2 – Maak een rekentool met functie

  1. Maak een functie kortingBerekenen die twee getallen als parameter gebruikt: $bedrag en $percentage
  2. Laat de functie het bedrag na korting returnen
  3. Laat het resultaat op het scherm zien met echo

Voorbeeldcode:

<?php
function kortingBerekenen($bedrag, $korting) {
  $nieuwBedrag = $bedrag - ($bedrag * ($korting / 100));
  return $nieuwBedrag;
}

echo "<p>Je betaalt nu: €" . kortingBerekenen(100, 25) . "</p>";
?>

🧠 Reflectie

📤 Inleveren

7 Datum en Tijd in PHP

🎯 Leerdoelen

💡 Uitleg

PHP heeft functies om met datum en tijd te werken. De belangrijkste is date(), waarmee je de huidige tijd kunt weergeven in verschillende formaten.

Voorbeeld:

<?php
echo "Vandaag is het: " . date("d-m-Y") . "<br>";
echo "Het is nu: " . date("H:i") . " uur.";
?>

🛠️ Opdracht 1 – Toon de datum en tijd

  1. Maak een bestand datum.php
  2. Laat daarin zien:
    • Welke dag het vandaag is
    • De datum in formaat dd-mm-yyyy
    • De tijd in uren en minuten

🛠️ Opdracht 2 – Leeftijd berekenen

Bereken iemands leeftijd op basis van geboortedatum:

<?php
$geboortedatum = "2007-03-15";
$geboortedag = new DateTime($geboortedatum);
$vandaag = new DateTime();

$verschil = $vandaag->diff($geboortedag);
echo "Je bent " . $verschil->y . " jaar oud.";
?>

Uitleg: PHP kan automatisch het aantal jaren berekenen tussen twee datums met diff().

🧠 Reflectie

📤 Inleveren

8 Sessies en Inloggen met PHP

🎯 Leerdoelen

💡 Uitleg

Een sessie in PHP is een manier om informatie te onthouden zolang de gebruiker je website bezoekt. Bijvoorbeeld of iemand is ingelogd of wat zijn/haar gebruikersnaam is.

Je start een sessie met:

<?php
session_start();
?>

🛠️ Opdracht 1 – inloggen.html

Maak een bestand inloggen.html met een formulier waarin je gebruikersnaam invoert:

<!DOCTYPE html>
<html>
<body>

  <h2>Inloggen</h2>

  <form action="login.php" method="post">
    <label for="naam">Naam:</label><br>
    <input type="text" name="naam" id="naam" required><br><br>
    <input type="submit" value="Inloggen">
  </form>

</body>
</html>

🛠️ Opdracht 2 – login.php

Maak een bestand login.php dat de naam opslaat in een sessie en doorstuurt:

<?php
session_start();
$_SESSION["gebruiker"] = $_POST["naam"];
header("Location: welkom.php");
exit;
?>

🛠️ Opdracht 3 – welkom.php

Maak een bestand welkom.php dat de gebruiker begroet:

<?php
session_start();
if (isset($_SESSION["gebruiker"])) {
  echo "<h1>Welkom, " . $_SESSION["gebruiker"] . "!</h1>";
  echo '<p><a href="uitloggen.php">Uitloggen</a></p>';
} else {
  echo "<p>Je bent niet ingelogd.</p>";
}
?>

🛠️ Opdracht 4 – uitloggen.php

<?php
session_start();
session_destroy();
header("Location: inloggen.html");
exit;
?>

🧠 Reflectie

📤 Inleveren

9 Inloggen met wachtwoordcontrole

🎯 Leerdoelen

💡 Uitleg

Een loginformulier stuurt gebruikersnaam en wachtwoord naar PHP. In deze les gebruiken we eerst $_GET om te laten zien waarom dat niet veilig is – je ziet het wachtwoord in de URL.

🛠️ Opdracht 1 – login.html

Maak een bestand login.html:

<!DOCTYPE html>
<html>
<body>

  <h2>Loginformulier</h2>

  <form action="controle.php" method="get">
    <label>Gebruikersnaam:</label><br>
    <input type="text" name="gebruiker" required><br><br>

    <label>Wachtwoord:</label><br>
    <input type="password" name="wachtwoord" required><br><br>

    <input type="submit" value="Log in">
  </form>

</body>
</html>

🛠️ Opdracht 2 – controle.php

Maak een bestand controle.php waarin je controleert of de gebruiker mag inloggen:

<?php
$gebruiker = $_GET["gebruiker"];
$wachtwoord = $_GET["wachtwoord"];

if ($gebruiker == "admin" && $wachtwoord == "geheim123") {
  echo "<h2>Welkom, $gebruiker!</h2>";
} else {
  echo "<p>Foutieve inloggegevens. Probeer opnieuw.</p>";
}
?>

Let op:

Als je dit formulier verstuurt, zie je het wachtwoord in de URL. Dat is niet veilig!

🛠️ Opdracht 3 – Verbeter met POST

💡 Uitleg – Associatieve array

Tot nu toe heb je gewerkt met lijsten zoals:

$hobby’s = ["voetbal", "gamen", "lezen"];

Dit is een indexed array: de computer onthoudt zelf de volgorde (index 0, 1, 2).

Een associatieve array heeft zelfgekozen namen als index (zogenaamde "keys"):

$gebruikers = [
  "admin" => "geheim123",
  "student" => "welkom01"
];

Je kunt dan bijvoorbeeld zeggen:

echo $gebruikers["admin"]; // toont: geheim123

Heel handig voor wachtwoorden of gebruikerslijsten!

🛠️ Extra opdracht – Meerdere gebruikers

Breid controle.php uit met een associatieve array van toegestane gebruikers en wachtwoorden:

<?php
$gebruikers = [
  "admin" => "geheim123",
  "student" => "welkom01",
  "docent" => "phprules"
];

$gebruiker = $_POST["gebruiker"];
$wachtwoord = $_POST["wachtwoord"];

if (isset($gebruikers[$gebruiker]) && $gebruikers[$gebruiker] == $wachtwoord) {
  echo "<h2>Welkom, $gebruiker!</h2>";
} else {
  echo "<p>Inloggen mislukt.</p>";
}
?>

Voeg zelf nog twee gebruikers toe: één voor jouw zelf (dus je eigen voornaam) en één voor een klasgenoot.

🧠 Reflectie

📤 Inleveren

PHP Challenge

PHP Challenge - Mini-website bouwen

🎯 Doelen

📜 Opdracht

Kies één van onderstaande opties of bedenk in overleg je eigen variant:

🌟 Optie 1 – Persoonlijke website

🎮 Optie 2 – Quiz met score

🛒 Optie 3 – Simpele webshop of rekentool

💡 Eisen

Jouw project moet aan de volgende eisen voldoen:

Gebruik AI om je te helpen, maar begrijp wat er gebeurt!

🧠 Reflectie

📤 Inleveren