sprint -

1.Ik kan uitleggenwat NodeJS isen waarvoorhet gebruikt wordt

NodeJS is een programma waar je custom data kan opslaan en dit kan laten zien door het te fetchen doormiddel van JSserver 2punten


2. Ik weet wat het doel van package.json is en heb hier aanpassingen ingemaakt

Hiermee kan je Json ophalen in github. 1puntent


3. Ik heb met npm packages geïnstalleerd en gebruikt in het bestand server.js

npm packages zorgen ervoor dat de server te gebruiken is op een local host. 3punten


4. Ik kan met commando’s in de terminal een NodeJS project stoppen en starten

ja dit kan ik doormiddel van NPM start. 3 punten


5. Ik weet waarom ik mijn NodeJS project regelmatig moet herstarten en kan dit uitleggen

dit moet als je aanpassingen maakt in de serverJS 3punten


6. Ik heb een strategie voor debuggen in NodeJS

ja dit kan ik doormiddel van console log te gebruiken om te testen of het werkt. 3punt


7. Ik kan uitleggen wat Express.js doet en waarom het nodig is om met NodeJS een website te bouwen

hiermee kan je dingen fetchen en ervoor zorgen dat de server kan runnen 2 punten


8. Ik weet wat routes zijn en kan zelf een nieuwe route aanmaken

met routes kan je vervolgpaginas aanmaken 3 punten


9. Ik weet wat request en response argumenten zijn ineen functie voor het laden van data

dit zorgt ervoor dat data opgevraagd kan worden en op een manier verwerkt / verstuurd word 2 punten


10. Ik heb gebruik gemaakt van een request parameter om specifieke data te laden

ja door met .get te werken 2 punten


11. Ik kan uitleggen wat Liquid doet en waarom het nodig is om met Express.js een website te maken

met liquid kan je bijvoorbeeld in meerdere pagina's 1 header of footer laden 2 punten


12. Ik weet hoe ik data naar Liquid verstuur om dit te gebruiken bij het renderen van een pagina

ja dit weet ik dit kan bijvoorbeeld door de json code op te zoeken en deze te typen en zo krijg je de opgevraagde data 3 punten


13. Ik weet hoe ik Liquid filters toe kan passen en waar ik kan vinden hoe die werken

hiermee kan je bepaalde filters kiezen 2 punten


14. Ik heb een nieuwe route gemaakt en nieuwe data meegegeven aan een Liquid view

ja dit heb ik gedaan toen we de squadpage gingen maken 2 punten


15. Ik weet waar een foreach loop voor gebruikt wordt en pas het toe in een Liquid view om HTML te renderen

hiermee kan je een loop bouwen meer weet ik niet 1 punten


16. Ik kan in Liquid een controle maken waarmee de avatar niet getoond wordt als deze niet in whois.fdnd.nl is ingevuld

nog niet gedaan 1 punten


17. Ik heb een strategie voor debuggen in Liquid

geen idee 1 punten


18. Ik kan data fetchen uit eenREST API

- 1 punten


19. Ik snap het verschil tussen HTTP requests van de methodes GET en POST

bij appget vraag je gegevens op en bij post zorg je dat die verwerkt worden in de route erna 2 punten


20. Ik kan data uit eenREST API filteren of sorteren

ja doormiddel van een een fetch de gegevens ophalen en die zetten in de post route 2 punten


21. Ik snap wat het async keyword doet inJavaScriptcode

nee 0 punten


22. Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON

geen idee 0 punten


23. Ik begrijp het verschil tussen client-side JavaScript en server-side JavaScript en wanneer ik welke het handigst in kan zetten

ja opzich wel 1 punt


24. Ik kan formulier data die is ge-POST opslaan ineen variabele op de server en gebruiken bij het renderen van een pagina

weet even niet hoe ik dit beschrijf 1 punten

25. Ik kan formulierdata die is ge-POST door middelvan een POST of PATCH HTTP request opslaan in de REST API

met een sort? heb even geen idee 0 punten

sprint 9

Ik kan uitleggen wat NodeJS is en waarvoor het gebruikt wordt. 2pnt

Ik weet wat het doel van package.json is en heb hier aanpassingen in gemaakt 2pnt

Ik heb met npm packages geïnstalleerd en gebruikt in het bestand server.js 2pnt

Ik kan met commando’s in de terminal een NodeJS project stoppen en starten 3pnt

Ik weet waarom ik mijn NodeJS project regelmatig moet herstarten en kan dit uitleggen 2pnt

Ik heb een strategie voor debuggen in NodeJS 2pnt

Ik kan uitleggen wat Express.js doet en waarom het nodig is om met NodeJS een website te bouwen 3pnt

Ik weet wat routes zijn en kan zelf een nieuwe route aanmaken 3pnt

Ik weet wat request en response argumenten zijn in een functie voor het laden van data 2pnt

Ik heb gebruik gemaakt van een request parameter om specifieke data te laden 2pnt

Ik kan uitleggen wat Liquid doet en waarom het nodig is om met Express.js een website te maken 3pnt

Ik weet hoe ik data naar Liquid verstuur om dit te gebruiken bij het renderen van een pagina 3pnt

Ik weet hoe ik Liquid filters toe kan passen en waar ik kan vinden hoe die werken 2pnt

Ik heb een nieuwe route gemaakt en nieuwe data meegegeven aan een Liquid view 3 pnt

Ik weet waar een foreach loop voor gebruikt wordt en pas het toe in een Liquid view om HTML te renderen 3pnt

Ik kan in Liquid een controle maken waarmee een image niet getoond wordt als deze niet in de database is ingevuld 2pnt

Ik heb een strategie voor debuggen in Liquid 2 pnt

Ik kan data fetchen uit een REST API 2 pnt

Ik snap het verschil tussen HTTP requests van de methodes GET en POST 3pnt

Ik kan data uit een REST API filteren of sorteren 2pnt

Ik snap wat het async keyword doet in JavaScript code 2pnt

Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON 2pnt

Ik begrijp het verschil tussen client-side JavaScript en server-side JavaScript en wanneer ik welke het handigst in kan zetten 2 pnt

Ik kan formulier data die is ge-POST opslaan in een variabele op de server en gebruiken bij het renderen van een pagina 2 pnt

Ik kan formulier data die is ge-POST door middel van een POST of PATCH HTTP request opslaan in de REST API 2 pnt





sprint 10

Ik begrijp het verschil tussen client-side JavaScript en server-side JavaScript en wanneer ik welke het handigst in kan zetten. Verschil is dat je server side gebruikt voor server en client side meer voor animaties. 2pnt

Ik heb een strategie voor server-side JavaScript debuggen, voor client-side JavaScript debuggen, en voor Liquid code debuggen ik doe dit eigenlijk niet het enige wat ik doe is soms de server opnieuw starten en te console loggen. 3pnt

Ik kan GET en POST routes aanmaken en request parameters gebruiken. dit doe ik doet app.get app.post ik weet hoe dit werkt. 3pnt

Ik kan server-side JSON data fetchen uit een REST API dit doe ik door een fetch aan te vragen en dit kan ik dan omzetten in liquid 3pnt

Ik kan data uit een REST API filteren of sorteren. dit doe ik door te kijken welk onderdeel ik nodig heb en deze aan te vragen met een ?=sort of ?=filter 2pnt

Ik snap wat het async keyword doet in JavaScript code. het async keyword zorgt ervoor dat er andere dingen niet blokkeren tijdens het ophalen van data 1pnt

Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON. met try catch kan je iets van data proberen op te halen en als dit niet lukt geef je een andere functie. 2pnt

Ik kan multi-page en single-page view transitions inzetten en aanpassen. dit kan door @view-transition met navigation:auto hieraan kan je dan nog custom transition toevoegen met @keyframe animaties. 3pnt

Ik kan verschillende manieren van responsive images uitleggen en toepassen. dit kan door in je html de image size op te vragen uit de data fetch en daarbij bijvoorbeeld een max-width binnen html te zetten 2pnt.

Ik weet hoe ik de resultaten van een performance audit moet interpreteren en hoe ik performance problemen kan oplossen. dit doe je door te kijken naar wat het probleem is en dit probleem te analyseren. hierna kan je dit gaan oplossen door dit op te zoeken en toe te passen, of door het toe te passen als je het al weet. 3pnt

Ik weet hoe ik met client-side JS de UX kan verbeteren, rekening houdend met progressive enhancement. dit kan door bijvoorbeeld eerst basisstyling toe te passen en complexe styling met @supports in CSS. als het dan niet word gesupport dan word de javascript functie niet toegepast 2pnt

Ik weet hoe ik binnen HTML, CSS en client-side JS nieuwe technieken toe kan passen, rekening houdend met oudere browsers. dit kan door bijvoorbeeld fallback functies te gebruiken. Ook kan je dit doen bijvoorbeeld met img door picture te gebruiken, hierin kan je dan verschillende formaten kiezen en dan word de beste gekozen verschillend per browser. Ook kan je in CSS dit doen door @supports toe te voegen aan complexere en nieuwere code. 2pnt

Ik weet wat objecten, arrays, strings, loops, variabelen, functies en parameters zijn, en kan die in JavaScript inzetten. Ik weet redelijk wat deze zijn ook omdat ik JS fundamentals heb gevolgd. Ik kan deze redelijk toepassen soms moet ik alleen nog even opzoeken hoe ze precies perfect toepast. 2pnt

Ik weet wat geavanceerdere concepten in JavaScript zijn, zoals closures, promises, callbacks, scope en de event loop. callback functie is een backup functie voor als er iets niet werkt op een oudere device of browser maar de rest weet ik niet 1pnt

Ik kan via GitHub met feature branches werken, pull requests aanmaken, reviewen en mergen. dit hebben wij nog niet gehad 1pnt

Ik weet hoe ik formulieren pro-actief kan valideren met client-side code. Dit kan je doen door te console loggen wat er gebeurd zodra je op de form klikt op de website 2pnt

Ik weet de eerste regel van ARIA, en wat dat betekent voor hoe ik HTML schrijf. Ja dit is dat je het niet gebruikt voor attributen die het al vanzelf hebben zoals buttons. met een aria label kan je een rol geven 2pnt

Ik weet wat layout shifts zijn, door wat ze veroorzaakt worden, hoe ik ze kan meten en hoe ik ze kan oplossen. Je kan ze meten door je chaching in je web op 3g te zetten en dan kan je zien wat er gebeurt, dit kan je bijvoorbeeld vermijden door grote images een lazy loading te geven of een skeleton state 3pnt

Ik weet wat de Core Web Vitals zijn, hoe ik die kan meten, en hoe ik de cijfers moet interpreteren 0pnt

Ik weet hoe perceived performance invloed heeft op de beleving van een gebruiker, en ik heb de ontwerp- en code vaardigheden om die toe te passen. ja door testen en de testresultaten te verwerken 2pnt

Ik kan UI states in meerdere lagen van progressive enhancement inzetten om de UX te verbeteren. Ja door bijvoorbeeld te beginnen met simpele animaties die op elk device worden ondersteund 2pnt

Ik kan een UI leuker en prettiger maken, zonder de core functionaliteit uit het oog te verliezen. Ja door bijvoorbeeld met @supports te werken voor complexe animaties op dde core functionaliteit 2pnt

Ik kan scroll-driven animations inzetten om de UI beter te maken, ja maar nog niet echt toegepast weet wel hoe het werkt. 2pnt

Ik weet hoe ik verschillende vormen van feature detection in kan zetten in HTML, in CSS en in client-side JS. Ja bijvoorbeeld met input types, @supports en if & else 2pnt

sprint 12

Ik begrijp het verschil tussen client-side JavaScript en server-side JavaScript en wanneer ik welke het handigst in kan zetten. client side gebruik je vooral voor enhancements en server sdie voor basis 2pnt

voorbeeld

Ik heb een strategie voor server-side JavaScript debuggen, voor client-side JavaScript debuggen, en voor Liquid code debuggen. door te console loggen of door een p met de informatie in het bestand te zetten zodat dit zichtbaar word op de site. 3pnt

voorbeeld

Ik kan GET en POST routes aanmaken en request parameters gebruiken. makkie 3pnt

voorbeeld

Ik kan server-side JSON data fetchen uit een REST API Makkie 3pnt

voorbeeld

Ik kan data uit een REST API filteren of sorteren jazeker nog niet perfect maar begrijp het wel 2pnt

voorbeeld

Ik snap wat het async keyword doet in JavaScript code het pauzeert tot het resultaat er is 2pnt

Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON hiermee kan je bijvoorbeeld iets proberen en als het niet werkt een error of iets anders meegeven 3pnt

Ik kan met een client-side fetch een werkend formulier verrijken ik begrijp het maar nog niet perfect 2.5 pnt

voorbeeld

Ik kan multi-page en single-page view transitions inzetten en aanpassen. jazeker gedaan in sprint 10/11 3pnt

voorbeeld

Ik kan verschillende manieren van responsive images uitleggen en toepassen, ik kan dit maar nog niet perfect 2pnt

Ik weet hoe ik de resultaten van een performance audit moet interpreteren en hoe ik performance problemen kan oplossen. jazeker door de informatie te lezen en op te zoeken krijg je alles wat je nodig hebt hiervoor 3pnt

Ik weet hoe ik met client-side JS de UX kan verbeteren, rekening houdend met progressive enhancement. jazeker door bijvoorbeeld een search veld live te laten werken of loading states 2pnt

voorbeeld

Ik weet hoe ik binnen HTML, CSS en client-side JS nieuwe technieken toe kan passen, rekening houdend met oudere browsers. jazeker door fallbacks te gebruiken met @supports en niet te nesten 3pnt

voorbeeld

Ik weet wat objecten, arrays, strings, loops, variabelen, functies en parameters zijn, en kan die in JavaScript inzetten jazeker maar nog niet 100% perfect 2pnt

voorbeeld

Ik weet wat geavanceerdere concepten in JavaScript zijn, zoals closures, promises, callbacks, scope en de event loop. ik weet wat dit zijn nog niet heel erg gebruik van gemaakt 2pnt

Ik kan via GitHub met feature branches werken, pull requests aanmaken, reviewen en mergen makkie 3pnt

Ik weet hoe ik formulieren pro-actief kan valideren met client-side code 1pnt

Ik weet de eerste regel van ARIA, en wat dat betekent voor hoe ik HTML schrijf ja dit is handig voor screenreaders 2pnt

Ik weet wat layout shifts zijn, door wat ze veroorzaakt worden, hoe ik ze kan meten en hoe ik ze kan oplossen jazeker, kan komen door grote images, kan je vermijden met lazy loading of skeleton states. 2.5pnt

voorbeeld

Ik weet wat de Core Web Vitals zijn, hoe ik die kan meten, en hoe ik de cijfers moet interpreteren, ja dingen zoals performance layout shifts, first contentful paint, largest contentful paint. 3pnt

Ik weet hoe perceived performance invloed heeft op de beleving van een gebruiker, en ik heb de ontwerp- en code vaardigheden om die toe te passen jazeker bijvoorbeeld lazy loading skeleton states auto updates succes state. 2pnt bijna 3pnt

Ik kan UI states in meerdere lagen van progressive enhancement inzetten om de UX te verbeteren jazeker met @supports en fallbacks 3pnt

voorbeeld

Ik kan een UI leuker en prettiger maken, zonder de core functionaliteit uit het oog te verliezen jazeker zoals hierboven benoemd en door op te zoeken hoe het ondersteund owrd 3pnt

voorbeeld

Ik kan scroll-driven animations inzetten om de UI beter te maken ik kan dit wel, nog niet perfect 2pnt

voorbeeld

Ik weet hoe ik verschillende vormen van feature detection in kan zetten in HTML, in CSS en in client-side JS if en else states 2pnt