PHP-1

1 Formulieren GET en POST

🎯 Leerdoelen

Je weet wat GET en POST zijn.
Je kunt gegevens doorsturen van een formulier naar een PHP-bestand.
Je begrijpt het verschil tussen GET en POST qua werking en veiligheid.

Weet je nog wat formulieren zijn in PHP?

Een formulier is een groep invoervelden in HTML. Deze velden wordne ingevuld en de waardes worden verstuurd naar een (meestal) andere pagina.

💡 Uitleg

Deze regel in een HTML form is belangrijk

 <form action="mijn-actie.php" method="get">

De action geeft aan waar het formulier de gegvens heen stuurt en de method geeft aan hoe deze gegevesn worden verstuurd.

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)	`mijn-actie.php?naam=Ali`
`POST`	Gegevens worden onzichtbaar verstuurd (veiliger)	De gegevens zitten in het HTTP-verzoek, niet in de URL

🎬Voorbeeld

In dit voorbeeld wordt het formulier naar 'zichzelf' vertuurd.

https://www.youtube.com/watch?v=6AzAYU8AOhQ

🛠️ Opdracht 1 – formulier.html (GET)

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)

Maak het bestand begroeting.php met de volgende PHP-code:

<?php
if (isset($_GET["naam"])) {
    $naam = $_GET["naam"];
    echo "<h1>Hallo $naam!</h1>";
} else {
    echo "<p>Geen naam ingevuld.</p>";
}
?>

Uitleg: We controleren met isset() of de waarde bestaat.

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

Pas in formulier.html het formulier aan naar:

<form action="begroeting2.php" method="post">

Maak een nieuw bestand begroeting2.php met deze code:

<?php
if (isset($_POST["naam"])) {
    $naam = $_POST["naam"];
    echo "<h1>Welkom, $naam (via POST)</h1>";
} else {
    echo "<p>Geen naam ontvangen.</p>";
}
?>

🧠 Reflectie

Wat is het verschil tussen POST en GET?
Wat gebeurt er precies in het PHP-bestand als je op “Verstuur” klikt?
Wanneer zou je liever POST gebruiken dan GET? Geef een voorbeeld.

📤 Inleveren

Lever de post-versie in van het formulier (.html).
Beantwoord de drie reflectievragen en lever dit in als .txt of .pdf-bestand.

2 Include en Require

🎯 Leerdoelen

Je weet wat include en require doen in PHP.
Je kunt een header of footer inladen met include.
Je herkent het verschil tussen include en require.

💡 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.

include "bestand.php": probeert het bestand in te laden. Als dat niet lukt, gaat de pagina wel gewoon verder.
require "bestand.php": probeert het bestand in te laden. Als dat niet lukt, stopt de pagina met een fout.

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>

🎬Voorbeeld

https://www.youtube.com/watch?v=aU0Tqxgtid8

🛠️ Opdracht – Header en footer maken

Maak een bestand header.php met een kop en menu zoals hierboven.
Maak een bestand footer.php met daarin bijvoorbeeld:
<footer>© 2025 Mijn Website</footer>
Maak een bestand index.php met bovenin een include("header.php") en onderin een include("footer.php").

🧠 Reflectie

Waarom is het handig om met include te werken?
Wanneer zou je liever require gebruiken?
Wat zou er gebeuren als je honderd pagina’s hebt zonder include te gebruiken? In welk geval zou dat onhandig zijn?

📤 Inleveren

Beantwoord de drie vragen n eigen woorden uit de reflectie en lever die in (.txt of .pdf bestand).

3 Arrays en Loops

🎯 Leerdoelen

Je weet wat een array is in PHP.
Je kunt een array maken met meerdere waarden.
Je kunt een foreach-loop gebruiken om alle items te tonen.

💡 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.

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

🎬Voorbeeld

Vanaf 0:30 -tot asan 06:30

https://www.youtube.com/watch?v=D7mqV-p1kEc

🛠️ 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…).

Gebruik een foreach-loop om ze allemaal op het scherm te tonen.
Geef elk item weer in een eigen paragraaf (<p>).

💡 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

Wat is het voordeel van een array ten opzichte van losse variabelen?
Wat is het verschil tussen for en foreach?
Wanneer zou je liever een for-loop gebruiken?

📤 Inleveren

Lever een screenshot in van jouw lijst.php met minimaal 5 items in een array, getoond in de browser.
Laat zien dat je zowel foreach als for gebruikt hebt.

4 Loops met indexed arrays

🎯 Leerdoelen

Je weet wat een indexed array is in PHP.
Je kunt een array maken en vullen met meerdere waarden.
Je kunt met een foreach-loop door een array lopen.
Je kunt gegevens uit een array weergeven met echo.

💡 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.

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

Voorbeelduitvoer:

Brood
Melk
Appels

Totaal: 3 producten

🧠 Reflectie

Waarom is het handig om een lijst in een array op te slaan?
Wat gebeurt er als je een nieuw product toevoegt aan de array? Moet je je loop aanpassen?
Hoe zou je deze code hergebruiken als iemand anders een andere boodschappenlijst heeft?

📤 Inleveren

Lever je bestand winkelmandje.php in.
Lever je reflectie in als .txt of .pdf.

5 (Associative) Arrays en Loops

🎯 Leerdoelen

Je begrijpt het verschil tussen indexed en associatieve arrays.
Je kunt beide soorten arrays aanmaken in PHP.
Je kunt met een foreach-loop informatie uit arrays tonen.

💡 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>";
?>

🎬Voorbeeld

Vanaf 0:30 -tot asan 06:30 had je al bekeken eerder, nu ga je kijken vanaf 08:55 - 12:00

https://www.youtube.com/watch?v=D7mqV-p1kEc

🛠️Opdracht – Studentenlijst maken

Test beide voorbeelden.

onder aan de code druk je nog een keer alle waarden af, maar dan door geburik te maken va een loop.
Voeg dan op regel 2 in de eerste code je eigen naam toe en test je code nog een keer. Wat gebeurt er?
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

Wat is het verschil tussen indexed en associatieve arrays?
Wat gebeurt er als je een 'key' verkeerd typt?
In de opdracht heb je kunnen zien waarom je beter een loop kan gebruiken om een array af te drukken. Leg in eigen woorden uit waarom.

📤 Inleveren

Lever je reflectie in als .txt of .pdf.

6 Functies in PHP

🎯 Leerdoelen

Je weet wat een functie is in PHP.
Je kunt zelf een functie schrijven en aanroepen.
Je kunt gegevens meegeven aan een functie (parameters).

💡 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");
?>

🎬Voorbeeld

https://www.youtube.com/watch?v=SBFO5bIDYHQ&t=185s

🛠️ Opdracht 1 – Maak je eigen begroetfunctie

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

🛠️ Opdracht 2 – Maak een rekentool met functie

Maak een functie kortingBerekenen die twee getallen als parameter gebruikt: $bedrag en $percentage
Laat de functie het bedrag na korting returnen
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

Waarom is het handig om functies te gebruiken?
Wat gebeurt er als je geen parameter meegeeft aan een functie die er wel één verwacht?
Waar zou je functies nog meer voor kunnen gebruiken?

📤 Inleveren

functie.php met ten minste 1 begroetfunctie én 1 rekentool.
Je moet ten minste 2 functies gebruiken met parameters, waarvan 1 ook een return gebruikt.

7 Datum en Tijd in PHP

🎯 Leerdoelen

Je weet hoe je de huidige datum en tijd kunt tonen met PHP.
Je kunt berekenen hoeveel dagen of jaren geleden iets was.
Je kunt de leeftijd berekenen op basis van een geboortedatum.

💡 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.

date("Y") → jaar (bijv. 2025)
date("d-m-Y") → dag-maand-jaar (bijv. 04-06-2025)
date("H:i") → tijd in uren:minuten (bijv. 14:36)

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

Maak een bestand datum.php
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

Wat is het verschil tussen date() en new DateTime()?
Waarom moet je bij het berekenen van leeftijd een diff() gebruiken?
Wat zou er gebeuren als je geboortedatum in een verkeerd formaat schrijft?

📤 Inleveren

datum.php met de juiste datum, tijd en berekende leeftijd.
Je gebruikt minstens één functie met datum en één met tijd, en diff() voor de leeftijd.

8 Sessies en Inloggen met PHP

🎯 Leerdoelen

Je weet wat een sessie is in PHP.
Je kunt een eenvoudige inlogpagina maken.
Je kunt een gebruiker herkennen op een andere pagina.

💡 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();
?>

🎬Voorbeeld

https://www.youtube.com/watch?v=JXKQmIpjRTk

🛠️ 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>

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

Waarom moet je altijd session_start() gebruiken bovenaan?
Wat gebeurt er als je probeert welkom.php te openen zonder in te loggen?
Wat zou je kunnen uitbreiden, bijvoorbeeld met wachtwoordcontrole?

📤 Inleveren

Screenshots van inloggen.html, welkom.php met jouw naam, en uitloggen.php na het uitloggen.
Je moet gebruik maken van sessies en de naam van de gebruiker correct kunnen tonen op meerdere pagina’s.

9 Inloggen met wachtwoordcontrole

🎯 Leerdoelen

Je maakt een formulier met gebruikersnaam én wachtwoord.
Je controleert de invoer in PHP.
Je begrijpt waarom $_GET niet veilig is voor wachtwoorden.
Je leert werken met een associatieve array.

💡 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

Pas het formulier aan zodat het method="post" gebruikt
Pas controle.php aan zodat het $_POST gebruikt
Test: zie je het wachtwoord nog in de URL?

💡 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

Wat is het verschil tussen een indexed array en een associatieve array?
Waarom is het veiliger om $_POST te gebruiken voor wachtwoorden?
Wat zou je doen om inloggen met een wachtwoord nog veiliger te maken?

📤 Inleveren

controle.php
Een .txt. of .pdf bestand met de antwoorden op de drie reflectievragen.

3 WordPress installatie uitvoeren

🎯 Leerdoelen

Je kunt het installatieproces van WordPress starten via je browser.

Je weet hoe je Apache en MySQL moet starten in XAMPP.

Je kunt inloggen op je eigen WordPress-site via de juiste URL.

💡 Uitleg

Je bent nu klaar om WordPress te installeren. Dit doe je in je browser, maar eerst moet je controleren of de juiste onderdelen van XAMPP actief zijn:

Zorg dat Apache en MySQL zijn gestart in de XAMPP-console. Ze moeten groen zijn.

Open nu je browser en ga naar:

http://localhost/wp-<jouwnaam>

Voorbeeld: http://localhost/wp-ayoub

Je ziet nu het installatieproces van WordPress in je browser. Lees alles zorgvuldig en vul de gevraagde gegevens correct in. Gebruik hierbij de informatie die je eerder hebt genoteerd (zie opdracht 1).

Na de installatie:

Je krijgt een bevestiging te zien dat WordPress is geïnstalleerd.

Je kunt direct inloggen met de gebruikersnaam en het wachtwoord die je tijdens de installatie hebt opgegeven.

Als je deze link niet meer ziet, kun je inloggen via:

http://localhost/wp-<jouwnaam>/wp-admin

🛠️ Opdracht – Installatie controleren

Maak een screenshot van je browser, waarop de WordPress-beheerderspagina zichtbaar is, met jouw naam in de adresbalk.

Open ook phpMyAdmin en klik op de database die je net hebt aangemaakt.

Maak een screenshot van de tabellenstructuur van jouw WordPress-database.

📤 Inleveren

inloggen-gelukt-jouwnaam.jpg: Screenshot van jouw WordPress-dashboard met jouw naam zichtbaar in de adresbalk.

phpmyadmin-jouwnaam.jpg: Screenshot van jouw WordPress-database in phpMyAdmin met tabellen zichtbaar.

4 Frontend en Backend in WordPress

🎯 Leerdoelen

Je begrijpt het verschil tussen de frontend en backend van een WordPress-site.

Je weet hoe je kunt inloggen op de backend (beheeromgeving).

Je kunt schakelen tussen frontend en backend via de admin-balk.

💡 Uitleg

In WordPress werk je in twee verschillende omgevingen:

1. De backend

De backend is het beheergedeelte van je site. Hier kun je onder andere:

Nieuwe pagina’s aanmaken

Functies toevoegen via plugins

Gebruikers beheren

Thema’s (templates) installeren voor het uiterlijk van je site

Je hebt een account nodig om toegang te krijgen tot de backend. Dat account heb je aangemaakt tijdens de installatie.

De standaard URL om in te loggen op de backend is:

http://sitenaam.nl/wp-admin

Als je lokaal werkt is dit bijvoorbeeld:
http://localhost/wp-jouwnaam/wp-admin

2. De frontend

De frontend is de website zoals bezoekers deze zien. Iedereen kan deze omgeving bekijken – je hebt geen wachtwoord nodig, tenzij je dat instelt.

Switchen tussen frontend en backend

Als je bent ingelogd, zie je bovenaan een zwarte balk. Deze admin-balk is zichtbaar op alle pagina’s, zowel in de backend als de frontend.

Met deze balk kun je makkelijk wisselen tussen beide omgevingen.

🔁 Manier 1 – Naar de homepage of het dashboard

Klik linksboven in de zwarte balk op het icoon naast het WordPress-logo.

Om naar de homepage te gaan: klik op het huis-icoontje.

Om naar het dashboard te gaan: klik op het dashboard-icoontje.

🧪 Probeer dit zelf een paar keer:
Wissel tussen de backend en frontend van jouw site met behulp van de zwarte balk.

🧭 Manier 2 – Direct naar het onderdeel dat je wilt bewerken

Als je bijvoorbeeld een pagina bekijkt en je wilt de inhoud wijzigen, kun je via de zwarte balk direct naar de bewerkingspagina in de backend gaan.

Deze functie maakt het snel en makkelijk om onderdelen van je site aan te passen terwijl je ze bekijkt.

Hoe dit precies werkt, kom je later in deze module nog uitgebreid tegen!

🧠 Reflectie

Wat is het verschil tussen frontend en backend?

Waarvoor gebruik je de zwarte admin-balk?

Waarom is het handig om direct vanuit de frontend naar het bewerkvenster te gaan?

📤 Inleveren

Antwoord op de reflectievragen (pdf of txt).

Welke onderdelen van Wordpress gaan we in deze module gebruiken?

5 Pagina’s maken en aanpassen in WordPress

🎯 Leerdoelen

Je weet hoe pagina’s werken in WordPress.

Je kunt pagina’s bekijken en bewerken vanuit de frontend én de backend.

Je begrijpt het verschil tussen pagina’s in WordPress en losse HTML-bestanden.

💡 Uitleg

Als software developer heb je waarschijnlijk al vaak webpagina’s gemaakt met HTML en CSS. In WordPress kan dat ook, maar het hoeft niet!

In plaats van losse HTML-pagina’s en CSS-bestanden gebruikt WordPress een andere manier. Je maakt en bewerkt pagina’s gewoon via de backend, met een visuele editor. Je hoeft dus geen code te schrijven – al mag dat natuurlijk wel als je wilt!

Belangrijk om te onthouden:

Je hoeft niet technisch te zijn om een mooie website te maken in WordPress.

Maar als je wél technische kennis hebt, kun je die gebruiken voor extra aanpassingen.

Frontend ↔ Backend gebruiken

Via de zwarte admin-balk kun je gemakkelijk wisselen tussen de frontend en backend van je site. Zoals je eerder hebt geleerd, kun je dan heen en weer gaan tussen de homepage (frontend) en het dashboard (backend).

Maar soms wil je direct naar een specifieke pagina in de backend, bijvoorbeeld als je een stuk tekst wilt aanpassen op een bepaalde pagina.

Direct bewerken via de frontend

Als je bent ingelogd en je bekijkt een pagina via de frontend, dan zie je bovenaan een zwarte balk. Deze bevat een knop waarmee je direct naar het bewerkvenster van die pagina in de backend kunt gaan.

Dit is handig, want zo hoef je de pagina niet eerst handmatig op te zoeken in het dashboard.

Voorbeeldpagina bij installatie

Bij de installatie van WordPress wordt er automatisch een voorbeeldpagina aangemaakt. Die kun je bekijken via de volgende URL:

http://localhost/wp-<jouw-naam>/voorbeeld-pagina

Bijvoorbeeld: http://localhost/wp-ayoub/voorbeeld-pagina

🛠️ Opdracht – Voorbeeldpagina bekijken en bewerken

Ga naar http://localhost/wp-jouwnaam/voorbeeld-pagina.

Bekijk de pagina zoals een bezoeker deze zou zien.

Klik op de zwarte balk bovenin op Bewerken om de backend-versie van de pagina te openen.

Pas de titel van de pagina aan naar bijvoorbeeld: “Welkom op mijn WordPress-site”.

Pas ook de tekst op de pagina aan (bijvoorbeeld je eigen naam toevoegen).

Klik op Bijwerken om je aanpassingen op te slaan.

Bekijk de pagina opnieuw aan de frontend: zijn de wijzigingen zichtbaar?

🧠 Reflectie

Wat is het voordeel van werken met WordPress-pagina’s ten opzichte van losse HTML-bestanden?

Wat vond je makkelijker: bewerken via de frontend of backend? Waarom?

Welke rol speelt de zwarte admin-balk bij het onderhouden van pagina’s?

📤 Inleveren

Maak een screenshot van jouw aangepaste voorbeeldpagina in de frontend (met jouw aanpassing zichtbaar).

Sla het bestand op als voorbeeldpagina-jouwnaam.jpg.

PHP-1

1 Formulieren GET en POST

🎯 Leerdoelen

💡 Uitleg

🎬Voorbeeld

🛠️ Opdracht 1 – formulier.html (GET)

🛠️ Opdracht 2 – begroeting.php (GET)

🛠️ Opdracht 3 – POST-versie maken

🧠 Reflectie

📤 Inleveren

2 Include en Require

🎯 Leerdoelen

💡 Uitleg

Voorbeeld:

🎬Voorbeeld

🛠️ Opdracht – Header en footer maken

🧠 Reflectie

📤 Inleveren

3 Arrays en Loops

🎯 Leerdoelen

💡 Uitleg

Voorbeeld:

🎬Voorbeeld

🛠️ Opdracht – Eigen array

💡 Uitleg

🛠️ Opdracht - deel 2

🧠 Reflectie

📤 Inleveren

4 Loops met indexed arrays

🎯 Leerdoelen

💡 Uitleg

🛠️ Opdracht – Winkelmandje weergeven

Voorbeelduitvoer:

🧠 Reflectie

📤 Inleveren

5 (Associative) Arrays en Loops

🎯 Leerdoelen

💡 Uitleg

Indexed array

Associatieve array

🎬Voorbeeld

🛠️Opdracht – Studentenlijst maken

🧠 Reflectie

📤 Inleveren

6 Functies in PHP

🎯 Leerdoelen

💡 Uitleg

Voorbeeld:

🎬Voorbeeld

🛠️ Opdracht 1 – Maak je eigen begroetfunctie

🛠️ Opdracht 2 – Maak een rekentool met functie

Voorbeeldcode:

🧠 Reflectie

📤 Inleveren

7 Datum en Tijd in PHP

🎯 Leerdoelen

💡 Uitleg

Voorbeeld:

🛠️ Opdracht 1 – Toon de datum en tijd

🛠️ Opdracht 2 – Leeftijd berekenen

🧠 Reflectie

📤 Inleveren

8 Sessies en Inloggen met PHP

🎯 Leerdoelen

💡 Uitleg

🎬Voorbeeld

🛠️ Opdracht 1 – inloggen.html

🛠️ Opdracht 2 – login.php

🛠️ Opdracht 3 – welkom.php

🛠️ Opdracht 4 – uitloggen.php

🧠 Reflectie

📤 Inleveren

9 Inloggen met wachtwoordcontrole

🎯 Leerdoelen

💡 Uitleg

🛠️ Opdracht 1 – login.html

🛠️ Opdracht 2 – controle.php

Let op:

🛠️ Opdracht 3 – Verbeter met POST

💡 Uitleg – Associatieve array