Koppel de database aan jouw webshop en gebruik de data om de producten op je webshop te tonen.

Dat doe je door bestaande HTML code te vervangen of uit te breiden met PHP.

Stappenplan

1. Database connectie opzetten Maak een PHP file aan waarin je een verbinding maakt met jouw database. Gebruik hiervoor bij voorkeur PDO. Zie voor meer informatie: https://www.w3schools.com/php/php_mysql_connect.asp Test het PHP script door het uit te voeren. Vergeet niet je Webserver en Databaseserver aan te zetten in XAMPP. De standaard gebruikersnaam van de XAMPP databaseserver is ‘root’. Het wachtwoord is standaard leeg.
2. Simpele select uitvoeren Voer nu een simpele select uit waarmee je data uit de database toont in je HTML pagina. Zie voor meer informatie: https://www.w3schools.com/php/php_mysql_select.asp
3. HTML uitbreiden/vervangen door PHP code Nu je een database verbinding hebt gemaakt en het is gelukt om gegevens uit de database op het scherm te tonen ga je dit principe toepassen op je bestaande webshop. Je gaat de bestaande webshop ‘dynamisch’ maken. D.w.z. dat de producten uit de database bepalen wat er te zien is op je webshop producten overzichtspagina. Daarvoor vervang je bestaande ‘statische’ data door dynamische data. Gebruik ook een for/while loop zodat je maar voor 1 webshop product code hoeft te schrijven. https://www.w3schools.com/php/php_mysql_select.asp
4. Doorlinken naar detail pagina vanuit webshop producten overzicht Breng een link aan in/op ieder product dat doorlinkt naar een pagina waarop de details van het product kunnen worden bekeken.
5. Webshop detail pagina realiseren Maak een dynamische detail pagina waarop de details van 1 product worden getoond op basis van de id van het product in de database.
6. Herstructureer je bestandsstructuur en isoleer een ‘connection script’ Vaak ik het handig om het stukje code waarmee je verbinding maakt met de database in een afzonderlijke file op te nemen en het te ‘includen’ in andere bestanden op het moment dat je het nodig hebt.

Opleveren

• overzichtspagina met webshopproducten die doorlinken naar een detailpagina
• detailpagina met een webshop product
• commit en push steeds nieuwe versies van jouw project naar Git

Voorbeeld Pokemon code

Maak eventueel gebruik van de voorbeeldcode die in de les is besproken.

Extra uitdaging

• Pager bij de overzichtspagina Maximaliseer het aantal producten op 1 pagina en geef de gebruiker de mogelijkheid er meer te laten zien, bijvoorbeeld door een ‘pager’.

  

• Meerdere afbeeldingen bij 1 webshop product (slider) Maak het mogelijk om meer dan 1 afbeelding aan een webshop product te koppelen en voeg een slider/gallery toe bij

  

• Reviews bij een webshop product. Maak het mogelijk om reviews te koppelen aan een webshopproduct.

  

Voorbeeld code ‘Products’ met meerdere ‘Images’ en één ‘Category’ gekoppeld. Maakt gebruik van ‘foreign keys’.