|
Deze periode heb ik voor informatica een volledig functionerende webshop ontworpen en gecodeerd. Alle basiseisen doen het, en ik heb twee expert eisen er in verwerkt. Dit proces was niet zonder zijn hobbels en tegenslagen. In dit verslag neem ik door wat er allemaal in de webshop is te doen, wat er allemaal ontbreekt, en waarom ik deze keuzes heb gemaakt.
Deel 1: Functionaliteiten De website is enorm uitgebreid. Als een gebruiker er voor het eerst opkomt, wordt deze gegroet met de index.html pagina. Als eerst ziet men de naam, Server-Tom. Deze heb ik gekozen omdat mijn domeinnaam server-tom.com is. Daar onder staan de producten in een grid-view. Daar kunnen mensen dan op twee knoppen klikken; bekijk product brengt men naar de productpagina’s, uitgerust met url-parameters om deze dynamisch te maken via een javascript. Ook is de grote “Koop Nu”-knop met extra nadruk te zien. De dikgedrukte knop voegt een product toe aan het winkelmandje, waar naartoe genavigeerd kan worden met de knop rechts boven op de pagina. Daar kan vervolgens de kwantiteit worden aangepast, een kortingscode worden ingevoerd, en worden besteld. Er is ook een indicatie van de totaalprijs onderaan de pagina. Wanneer er wordt besteld wordt mensen gevraagd om in te loggen. Dit is te doen door terug te gaan naar de index.html pagina, en daar rechtsboven op mijn account te klikken. Daar wordt gevraagd om in te loggen, of te registreren. Wanneer dat is gedaan is het vanaf het dashboard mogelijk om terug te gaan naar de mand en daar te bestellen. Voor deze demonstratie is het bij het bestellen niet nodig om te betalen. Na het bestellen wordt de klant bedankt, en naar de bestelpagina in zijn/haar account omgeleid. Daar kan de klant kijken naar al zijn voltooide aankopen. In de back end worden de bestelde producten ook uit de voorraad gehaald. Als admin is het ook mogelijk om in te loggen. Het is mogelijk om bestellingen te bekijken, voorraad in te boeken, en nieuwe producten aan te maken. De account en admin pagina’s zijn ook beveiligd via een JavaScript account-check. Het UI/UX is zo ontworpen dat het geen probleem is als de gebruiker op mobiel zijn bestellingen doet en bekijkt. Dit zijn lang niet alle functionaliteiten, maar in ieder geval de belangrijkste bij het gebruiken van de webshop. Deel 2: Tekortkomingen De website heeft ook een aantal functionaliteiten niet. Alhoewel ik niet denk dat deze functionaliteiten storend zijn om niet te hebben op deze website, neemt dat niet weg dat ze ontbreken. Om te beginnen, de webshop heeft geen veilingmodel. Ik heb besloten deze niet te programmeren omdat ik niet denk dat het logisch zou zijn voor een Apple Reseller om een veilingssysteem te hebben. Er ontbreken verder bij sommige interacties animaties, die misschien wel logisch zouden zijn om te hebben. Zo krijgt de klant bij het toevoegen van producten aan de winkelmand een melding, in plaats van een chique animatie. Er is verder ook geen enkele manier om te zoeken of filteren op de website. Ik denk ook niet dat dat een groot probleem is omdat Apple’s assortiment er om bekend staat vrij beperkt te zijn in grote, maar het kan een probleem worden bij uitbreidingen van de website. Deel 3: Reflectie op het werkproces Bij het maken van deze website heb ik enorm veel geleerd, meer dan bij alle andere informatica opdrachten, maar er waren ook een hoop moeilijkheden. Omdat ik niet veel lessen informatica heb in de periode, moest ik heel veel thuis doen, waardoor ik op sommige momenten snel dacht dat het gewoon weg makkelijker was om het te vibe-code, omdat ik het anders gewoon niet af zou krijgen. Het is uiteindelijk gelukt om de website op tijd af te krijgen, maar ik heb meer met ChatGPT gedaan dan bij welke andere opdracht dan ook. Wel ben ik er achter gekomen dat ChatGPT de wereld van coderen nog lang niet gaat overnemen, kijkende naar de honderden lijnen niet werkende code die hij heeft gehallucineerd in een poging mijn code werkende te krijgen. Als ik iets anders zou mogen doen denk ik dat ik minder gebruik zou hebben gemaakt van ChatGPT. Ook had ik gehoopt dat er meer tijd over zou zijn voor kleine details, zoals de opmaak van de website. Maar kijkende nu naar het eindresultaat, dan realiseer ik me wel dat ik maar acht lessen informatica heb gehad voor dit project, en denk ik toch maar; het is in ieder geval af en werkend. Deel 4: inleveren De bestanden van de website zijn hier te vinden in een zip archief, de link naar de website is informatica.server-tom.html/webshop, en de inlog voor het admin account is mijn school e-mailadres, met als wachtwoord 123456. Het is uiteraard niet zomaar mogelijk om een nieuw admin account aan te maken via de front end. De kortingscode is verstopt in de code, het is informatica10. Hoe ik de database zou moeten inleveren weet ik niet. Als het nodig is kan ik het wachtwoord van mijn account met jullie delen maar dan doe ik dat liever niet via een openbare website. |