Vandaag heb ik geleerd hoe ik een breakdown sketch maak en ervoorzorg dat ik eerst een visuele representatie heb van mijn pagina. Zo kan ik makkelijker te werk gaan
Studievragen:
Wat is het nu van een breakdown schets?
Waar moet je opletten als je een breakdown schets maakt?
Hoe vertaal je jouw breakdown schets naar je codering programma?
Wat ik nog wil checken en uitzoeken zijn de animaties die gemaakt kunnen worden in CSS3. Ik wil in mijn visitekaartje graag wat animaties verwerken.
Javascript en interactie. 5 september 2024
Vandaag heb ik geleerd hoe je in de console Javascript gebruikt. javascript is een taal die erg precies is en geen fouten vergeeft met codering. Wat ik vandaag verder ga leren en implementeren is het gebruik maken audio terwijl ik zweef boven een icoon.
Wat maakt Javascript een andere codetaal dan HTML en CSS?
Hoe verbreed ik mijn kennis met Javascript?
Hoe pas ik de nieuwe kennis van Javascript toe aan mijn huidige HTML en CSS?
Welke taken kan ik Javascript over laten nemen die ik momenteel gebruik met HTML en CSS?
9 september 2024
Vandaag zijn we begonnen met het maken van een squadpage. Ik heb al een aantal dingen geleerd als:
Wat er te vinden is op de HVA campus, Hoe je samen als team een idee schetst, waar de beste plekken zijn als team om te werken en hoe het programma Miro werkt
Met Miro werken
Hoe je samen werkt ahls een team aan een pagina
Uitschrijven van je concepten en schetsen zodat je zeker weet of de letters en afbeeldingen passen
meer leren over de stijl aanpassen van een website
Het samenwerken met het team en hoe je een project begeleid met elkaar
11 september 2024
In de les van vandaag hebben we geleerd over media queries. We hebben gekeken naar de verschillende pixel afmetingen van websites en hoe
zij breakpoints gebruiken. Met breakpoints bepaal je wanneer de layout van je site veranderd.
Het is natuurlijk belangrijk dat je website responsive is met de apparaten.
Welke studievragen zijn er?
Hoe maak jij jouw website responsive voor apparaten?
Hoe maak jij je website optimaal voor slechtziende of mensen met een meer dan 100 procent zoom op hun browser?
Wanneer kan ik het beste een breakpoint maken?
16 september 2024
In de les van vandaag zijn we bezig geweest met het maken van ontwerpen en dit later weer bij elkaar te voegen.
Ook is er vandaag bij ons geleerd over visuele hiërchie
17 september 2024
Vandaag bij de CSS workshop van Sanne hebben we de Transform en Transition eigenschappen geleerd in CSS. Zo hebben we geleerd bepaalde aspecten te transformeren en het te roteren, schalen en verplaatsen. Met deze nieuwe code kunnen we leren om knoppen leuker maken om een interactie mee te hebben.
Studievragen
Hoe maak je een 3d transitie met CSS?
Waarom gebruik je bij sommige codes de /*transform: en bij andere niet?
Hoe gebruik je de perspective code?
18 september 2024
Vandaag hebben we verder gewerkt aan onze website en hebben we een readme
geimplementeerd in onze website.
Wat heb ik vandaag geleerd?
Filter toegepast aan de foto's van ons project. Zodat ze grijs zijn op desktop en als je erover 'hovert' de afbeeldingen kleur hebben.
We hebben vandaag een readme pagina toegevoegd aan onze website. De readme vertelt over ons project, ons team en op welke manier je contact met ons kan zoeken.
We hebben geleerd samen in Visual Studio Code te werken via een LIVE link. Zo kunnen we samen aan dezelfde code werken en meteen zien wat de ander doet.
23 september 2024
Vandaag in de les gaan we aan de slag met een opdracht maken voor een klant. We gaan werken aan bieb in bloei. Een organisatie die mensen helpt met elkaar leren kennen en een groene
duim te geven met verbinden. We hebben vandaag met de klant gesproken Mariska die ons de opdracht heeft verteld en wat zij wilt
behalen
Welke dingen heb ik vandaag geleerd?
Een project lanceren/aanmaken op github
Een briefing aanmaken en leren noteren
Leren een debriefing te maken voor een duidelijke nabespreking
27 september
Wat heb ik vandaag geleerd? We hebben vandaag weer een review dag gehouden
Zo leren we waar we op kunnen letten. Een aantal studenten en Krijn hebben een issue ingeschoten.
Hier zijn een aantal issues die zijn ingeschoten en wat ik ook veranderd heb
Vandaag in de les hebben we geleerd over de Layout modes die er zijn die je kan toepassen in CSS. Ik ben vandaag bezig geweest met vooral
de grids beter leren kennen. Ik heb verschillende oefeningen gemaakt met de layout. Dit kun je terugzien in
de issues.
Welke drie dingen heb ik geleerd?
Multi-Column-Layout
Werken met column start en end
Werken met columns en hoeveel het er kunnen zijn
Leren hoe je de grids kunt verplaatsen en op een andere plek kan zetten via de css.
7 oktober 2024
In de les van vandaag hebben we 'code-conventies' geleerd.
Dat betekent dat je jouw code leesbaar opsteld en
dat het makkelijk te volgen is. Een aantal methodes
die we hebben geleerd zijn:
HTML Ademruimte geven. Je spaceert je HTMl zo nodig dat je duidelijke distinctie hebt in je code.
CSS Structuur als je HTML. Dat je in het CSS bestand ook net zo werkt in je HTML. Dus als er een H1 voor een img staat in je HTML verwerk je dit ook zo in CSS
Mediaqueries Nesten. Zorg ervoor dat je de mediaqueries die je
gebruikt voor verschillende viewports neerzet bij de juiste
selector. Het kan natuurlijk dat je navigatie balk een andere
breakpoints heeft dan je artikelen. Hiervoor plaats je
de mediaquery in de juiste selector.
9 oktober 2024
Vandaag hebben we een sprintreview gemaakt en een readme voor onze
website.
Wat ik heb gedaan is een README wat uitgebreider geschreven wat ik heb gedaan en meer formeel opgeschreven dan vorige keer.
Een Sprintreview maken zoals het hoort zodat ik uitleg wat ik deze aantal
weken heb gedaan EN welke vragen ik nog heb voor de klant
De readme verder uitwerken en formeel opschrijven wat het project is, welke
dingen ik heb gedaan met het project
14 oktober 2024
Vandaag in de les hebben we geleerd over over hoe je jouw website en/of pagina meer accessible maakt. Zo hebben we geleerd dat je website toegankelijk
moet zijn voor verschillende mensen met een tijdelijke of permanente beperking. Ik heb geleerd de Lighthouse test uit te voeren via
de console EN ik heb geleerd om de
checklistaf te gaan
om te kijken of het toegankelijk genoeg is. Ook heb ik geleerd om een WCAG audit te maken en dit
ga ik ook doen bij de
Coolblue website
Wat moet ik nog doen bij mijn WCAG Audit?
Wat ik nog bij mijn WCAg Audit moet doen is de issues verder opschrijven die vermeld staan in de Lighthouse test.
Ook moet ik nog de handmatige test uitvoeren zoals die bij een keyboard of text to speech
15 oktober
Vandaag in de workshop van Sanne hebben we over
positionering geleerd en hoe je het kan toepassen. In
deze les hebben we geleerd over:
Vandaag in de les hebben we over een aantal nieuwe elementen geleerd
en hoe je bijvoorbeeld een ID aan een element zet. Wat ik vandaag het meest interessante onderwerp vond was de accordeon oftewel
het details element. Met het details element kan je iets laten uitklappen op je pagina EN als je ook
een open naast details zet staat de informatie van je summary al open. Dat vond ik wel het beste tot nu toe.
Wat heb ik geleerd vandaag met UX in HTML?
Accordeon Element toevoegen
ID koppelen aan een element
Een Fieldset maken
Links. Hier heb ik geleerd een link een ID te geven zodat
je naar een deel van de pagina wordt geleid. Dit kan ik gebruiken voor verschillende workshops die al geweest zijn.
Afbeeldingen. Met afbeeldingen heb ik nu geleerd om het
een ALT te geven en in welke gevallen je het uberhaupt een
alt moet geven.
Labels. Labels hebben bij geleerd om ervoor te zorgen dat
alles dat een label element heeft het interactief wordt. Dat vind
ik persoonlijk wel heel handig voor op mijn site.
Accordeon. Met een accordeon vind ik het handig werken, want nu kan
ik makkelijk informatie onder een makkelijk verstopbaar kopje plaatsen.
21 oktober 2024
In de les van vandaag hebben we geleerd om kleur en contrast
nog meer toegankelijk te maken voor op onze website. Dit
is erg belangrijk, want 10% van mannen en 2% van vrouwen op
aarde is kleurenblind. Dat zijn dus 375191409 mannen en 75038282 vrouwen
die een vorm van zicht-belemmering hebben. Zo hebben we ook een aantal issues gemaakt. Ik zal de link daarvan hieronder neer zetten:
Onderscheidende kleuren gebruiken. We hebben in de les
wel al eens over Onderscheidende kleuren gehad, maar
nu gingen we er echt mee aan de slag. Er zijn drie vormen
van kleuren onderscheiden en die zijn:
Licht-donker kleurcontrast, Complementair kleurcontrast en Warm-koud kleurcontrast.
Leren testen met de
C.C.A (Colour Contrast Analyser)
zodat we de kleuren toegankelijk kunnen maken
voor mensen. Deze analyser test de A, AA en AAA; Essentieel, Ideale Support en gespecialiseerde Support
Geleerd om met overlays op een
afbeelding te werken. Is nog experimenteel volgens de MDN website
Strips Highlight techniek. Om op een afbeelding
de tekst in een rechthoek te zetten zodat
er genoeg contrast is. Dit is een vrij makkelijke techniek
waar je alleen de background-color en color van de tekst
hoeft aan te passen. Ook de margin of de padding.
vandaag heb ik geleerd om een betere readme te schrijven en een meer concrete sprintreview te schrijven.
Ik heb vandaag ook advies gekregen en gegeven aan een aantal studenten en ik heb vandaag ook gewerkt aan een readme schrijven.
Wat zijn de readme verbeteringen?
Wat ik heb veranderd aan mijn README is terugkoppelen in de code
Ik heb in mijn README ook duidelijke veranderingen uitgegeven
Wat ga je anders doen met een sprintreview
Wat ik anders ga doen met de sprintreview is vragen
wat zij met de agenda pagina wilt en of je vorige workshops moet kunnen zien en/of je vooruit kan kijken op toekomstige workshops.
Blok 2
11 november
Wat heb ik vandaag geleerd?
Vandaag in de les hebben we geleerd over huisstijlen maken.
Het opstellen van een Interface Inventory
Wat de uitingen en Onderdelen zijn van de huisstijl
Mijn projectboard linken aan een nieuwe repo
Bronnen
18 november
Wat heb ik vandaag in de les geleerd?
vandaag in de les hebben we het gehad over fonts. Ik heb
mijn eigen font gemaakt EN geleerd Waarom je geen
absolute eenheden moet maken.
Dat er 'mono-space' type fonts zijn. Deze fonts hebben dezelfde aan ruimte tussen elkaar
maakt niet uit welke letter of cijfer je gebruikt.
Dat een aantal principes als EM en cursief nog uit de tijd komen dat er
nog met grote machines werden afgedrukt.
Dat je jouw eigen font of een downloadbaar font via de fontface-query kan implementeren
in jouw eigen code. Ook heb ik geleerd dat je meerdere fonts als een back-up kan
neerzetten als iemand dat type font niet kan zien op het apparaat.
Hier is een zin getypt in mijn eigen lettertype die ik heb gemaakt in de les. Wat ik nu ga doen is een lettertype maken dat
beter leesbaar, maar wel een persoonlijke touch heeft.
Vandaag hebben geleerd over de verschillende input types die je kan gebruiken voor
formulieren op het web. Ikzelf heb gewerkt met de volgende inputs: Range, checkbox en text.
Wat heb ik vandaag geleerd?
Geleerd hoe je de input type gebruikt en welke attributen je ervoor kan gebruiken bij dat type
Wat fieldsets zijn en hoe je ermee moet werken
Geleerd hoe je fieldsets pas kan laten zien wanneer de fieldset daarvoor is ingevuld
Hoe je de focus, active en inactive attributen kan toevoegen
Wat ga ik toepassen op mijn site?
Ik wil de input voor contact gaan maken voor op mijn site. We hadden
al een beetje een form opgesteld, maar nu heb ik de gereedschappen
op het mooier te maken.
Wat ga ik nog leren?
Ik wil nog verder leren spelen met de fieldsets en attributen zodat
ik een leukere ervaring kan maken voor mijn I love Web
vandaag heb ik mijn I love web meer opgeschoond. Zo heb ik van mijn eerdere
leermomenten de correcte benamingen erbij gezet en het zo gemaakt dat ze allemaal
een duidelijk overzicht hebben.
Wat heb ik vandaag geleerd?
Ik heb geleerd hoe ik de marker bij de summary verander
Geleerd dat ik al mijn vorig gemaakte werk in een details kan zetten
en zo een overzichtelijk schema kan maken in blokken
Ik heb vandaag over de Gestallt principes geleerd.
Vandaag ben ik begonnen met de Common Region principe toepassen.
Dit helpt met het identificeren welke artikelen bij elkaar
horen op een pagina.
Figma prototype
Vandaag zijn we bezig geweest met de sprintreview van sprint 4 in portflow neerzetten. Ook zijn we erachter gekomen dat je
issues kan assignen aan een persoon in je team. Zo is het duidelijk wie welke issue aanpakt en wie zijn verantwoordelijkheid
het is voor het oplossen van die issue.
Vandaag hebben we geleerd over de User Flow en zijn we begonnen aan Sprint 5
van de opleiding. We gaan deze sprint interacties maken met javascript en hoe je een knop
interactief kan maken EN hoe je een transitie duidelijk maakt. Dat je dus een 'feedback' en een 'Feedforward' hebt
in je ontwerp.
Wat ga ik maken?
Met Bieb in Bloei staat er op de mainpagina 3 artikelen. Deze wil ik samen voegen tot een soort carousel.
Ik ga het zo maken dat je op een zaadje moet klikken om een volgend artikel te zien.
Hoe ver ben ik met javascript deeltaak en wat wil je leren?
Omdat vandaag de eerste dag was van de nieuwe sprint ben ik nog niet begonnen
met de javascript deeltaak. Wat ik nog wil leren over Javascript is hoe je knoppen werkend maakt en hoe je een automatische
calculator maakt en gebruikt in javascript.
3 december
Vandaag ben ik bezig geweest met een grid layout simpeler maken. We zijn vandaag te werk gegaan met
grid-column, grid-area, min, minmax en een subgrid. Vandaag zijn we ook meer gaan werken met de align-self en
de justify self met de grid les.
Momenteel heb ik er 3 gemaakt met een variatie op de eerste knop
Bij welk gedragscriterium hoort deze deeltaak?
Ik denk dat deze hoort bij 5
6 januari
Wat zijn mijn goede voornemens voor dit jaar?
Ik ga net als vorig jaar dit jaar ook werken aan nieuwe technieken voor CSS en mijn kennis over javascript verbeteringen.
Wat ik dit jaar ook ga doen is elke dinsdag naar de challenges komen zodat ik altijd up to date ben met de uitdagingen. Ik zal
ook wat meer naar de donderdagen komen.
Wat heb ik nodig om langer te blijven bij FDND?
Wat ik nodig heb om meer te blijven of langer door te gaan is een comfortabele plek waar ik kan zitten.
De openbare werkruimtes vind ik te luidruchtig en het aquarium vind ik nog wel eens te koud om te blijven werken.
Nu bij dit jaar heb ik wel gerealiseerd dat het handig kan zijn en daarom zal ik wat langer blijven na school deze dagen.
Blok 3
10 februari
Wat heb ik vandaag gedaan?
Vandaag zijn wij verder gegaan met het maken van de gezamelijke squadpage. Deze squadpage
11 februari
Wat heb ik vandaag gedaan?
Vandaag heb ik in de CSS challenge van Sanne 3 oefeningen gekregen.
In deze oefeningen heb ik ook een aantal nieuwe short-hand codes geleerd
die mij zullen helpen in nieuwe projecten.
In de workshop van vandaag hebben we gewerkt met een POST maken zodat je commentaar zou kunnen achterlaten.
Dit helpt omdat we in de laatste week van sprint 7 verder gaan met een 'data-driven-web' maken. met de
nieuwe info van vandaag hebben we een kleine chat kunnen maken, waar we elkaars berichten kunnen zien. We hebben vandaag
ook een nieuwe repo gemaakt zodat we met z'n allen in een repo gaan werken
In de wrap-up van vandaag moesten we verder aan onze readme en hebben we een standup gedaan.
een standup helpt met duidelijk maken wat de ander doet en nog moet doen voor het project.
Dit is terug te vinden in onze readme. Verder heb ik ook gewerkt aan de server.js, maar het lukt mij
niet om de juiste data op te halen.
Ik kan uitleggen wat NodeJS is en waarvoor het gebruikt wordt. Ik geef mijzelf hiervoor 1pnt.
Ik weet wat het doel van package.json is en heb hier aanpassingen ingemaakt. Ik geef mijzelf hiervoor 2 pnt.
Ik heb met npm packages geïnstalleerd en gebruikt in het bestand server.js. Ik geef mijzelf hiervoor 3pnt.
Ik kan met commando’s in de terminal een NodeJS project stoppen en starten. Ik geef mijzelf hiervoor 3 pnt.
Ik weet waarom ik mijn NodeJS project regelmatig moet herstarten en kan dit uitleggen. Ik geef mijzelf hiervoor 2 pnt.
Ik heb een strategie voor debuggen inNodeJS. Ik geef mijzelf hiervoor 1 pnt.
Ik kan uitleggen wat Express.js doet en waarom het nodig is om met NodeJS een website te bouwen. Ik geef mijzelf hiervoor 2 pnt.
Ik weet wat routes zijn en kan zelf een nieuwe route aanmaken. Ik geef mijzelf hiervoor 2 pnt.
Ik weet wat request en response argumenten zijn ineen functie voor het laden van data. Ik geef mijzelf hiervoor 2 pnt.
Ik heb gebruik gemaakt van een request parameter om specifieke data te laden. Ik geef mijzelf hiervoor 3 pnt.
Ik kan uitleggen wat Liquid doet en waarom het nodig is om met Express.js een website te maken. Ik geef mijzelf hiervoor 1 pnt.
Ik weet hoe ik data naar Liquid verstuur om dit te gebruiken bij het renderen van een pagina. Ik geef mijzelf hiervoor 2 pnt.
Ik weet hoe ik Liquid filters toe kan passen en waar ik kan vinden hoe die werken. Ik geef mijzelf hiervoor 3 pnt.
Ik heb een nieuwe route gemaakt en nieuwe data meegegeven aan een Liquid view. Ik geef mijzelf hiervoor 3 pnt.
Ik weet waar een foreach loop voor gebruikt wordt en pas het toe in een Liquid view omHTML te renderen. Ik geef mijzelf hiervoor 2 pnt.
Ik kan in Liquid een controle maken waarmee de avatar niet getoond wordt als deze niet in whois.fdnd.nl is ingevuld. Ik geef mijzelf hiervoor 2 pnt.
Ik heb een strategie voor debuggen in Liquid. Ik geef mijzelf hiervoor 1 pnt.
Ik kan data fetchen uit een REST API. Ik geef mijzelf hiervoor 3 pnt.
Ik snap het verschil tussen HTTP requests van de methodes GET en POST. Ik geef mijzelf hiervoor 2 pnt
Ik kan data uit eenREST API filteren of sorteren. Ik geef mijzelf hiervoor 3 pnt.
Ik snap wat het async keyword doet in JavaScriptcode. Ik geef mijzelf hiervoor 0 pnt.
Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON. Ik geef mijzelf hiervoor 0 pnt.
Ik begrijp het verschil tussen client-side JavaScript en server-side JavaScript en wanneer ik welke het handigst in kan zetten. Ik geef mijzelf hiervoor 0 pnt.
Ik kan formulier data die is ge-POST opslaan ineen variabele op de server en gebruiken bij het renderen van een pagina. Ik geef mijzelf hiervoor 0 pnt
Ik kan formulierdata die is ge-POST door middelvan een POST of PATCH HTTP request opslaan in de REST API. Ik geef mijzelf hiervoor 1 pnt.
Mijn totaal aantal punten is: 44 uit 75.
Dat betekent dat mijn punten wel voorbij het gemiddelde is, maar er zeker wel ruimte is voor verbetering.
3 maart
Sprintplanning, briefing en debriefing
Vandaag zijn we begonnen met sprint 8, daarbij hoort ook een nieuwe opdrachtgever voor de komende aantal weken.
We hebben vandaag onze nieuwe opdrachtgever ontmoet, Jaap van Woudenberg. Wij gaan aan de slag met Timu Mundo, een app gemaakt
op kinderen te helpen om tweetalig opgevoed te worden.
12 februari
Directus filteren opdracht
Zorgt ervoor dat de letters allemaal klein zijn
Verwijderd de letter D en de letter A van de naam van de buddy
| replace_first: "a", "x"vervangt de eerste letter "a" met een "x" in de tekst
titel, titel titelVerwijderd de laatste komma van de array
p/pEerst assign ik een eigen array aan. De eigen array komt van buddy.animal. Ik gebruik split
om van de string een array te maken. Door de split leeg te houden neemt het de gehele tekst over. Daarna vertel ik
dat "my_array" omgekeerd moet worden
14 maart 2025
Wat gaat er momenteel goed in de Studio?
Ruimte om te kunnen werken aan de tafel en ideeen uit te schrijven op het
whiteboard. Mogelijkheid om in het aquarium te zitten en te werken in wat meer rust. Genoeg stroompunten om je laptop op
te kunnen laden en andere elektronische apparaten.
Wat gaat er minder goed?
Kan nog geen gebruik maken van een koelbox of koelkast om drinken koud te houden. Stoelen zijn niet erg comfortabel
om voor een langere tijd aan te zitten, liever een stoel met een kussen.
24 maart 2025
Frontend Design & Development
Dinsdag 25 maart
26 maart
het nieuwe
light dark()
Sinds mei 2024 is het mogelijk om het
color-scheme
item te veranderen met light-dark.
Ik heb het nu op mijzelf genomen om hiermee te spelen. Dit heb ik gedaan met codepen en dat heb ik
hier
gedaan. Als je de weergave van je systeem op light modus zet worden er andere kleuren getoond dan als je het op dark mode hebt staan.
4 april 2025
Vragenlijst part two: electric boogaloo
Ik kan uitleggen wat NodeJS is en waarvoor het gebruikt wordt. Ik geef mijzelf hiervoor 2pnt.
Ik weet wat het doel van package.json is en heb hier aanpassingen ingemaakt. Ik geef mijzelf hiervoor 3 pnt.
Ik heb met npm packages geïnstalleerd en gebruikt in het bestand server.js. Ik geef mijzelf hiervoor 3pnt.
Ik kan met commando’s in de terminal een NodeJS project stoppen en starten. Ik geef mijzelf hiervoor 3 pnt.
Ik weet waarom ik mijn NodeJS project regelmatig moet herstarten en kan dit uitleggen. Ik geef mijzelf hiervoor 3 pnt.
Ik heb een strategie voor debuggen inNodeJS. Ik geef mijzelf hiervoor 2 pnt.
Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON. Ik geef mijzelf hiervoor 0 pnt.
Ik begrijp het verschil tussen client-side JavaScript en server-side JavaScript en wanneer ik welke het handigst in kan zetten. Ik geef mijzelf hiervoor 2 pnt.
Dat betekent dat mijn punten wel voorbij het gemiddelde is, maar er zeker wel ruimte is voor verbetering.
16 april 2025
Nou ik vind dit niks
Ja, dat kan je wel zeggen ja.
22 april 2025
De dag van lazy loading
Foto 1
Foto 2
Foto 3
Foto 4
Foto 5
Blok 4
9 mei 2025
Review sprint 9
Nieuwe vragenlijst
Ik begrijp het verschil tussen client-side JavaScript en server-side
JavaScript en wanneer ik welke het handigst in kan zetten. Ik geef mijzelf
hiervoor 2 punten. Ik heb dit zelf toegepast, maar dit komt
uit voorbeelden van de leerstof.
ClientsideServerside
Ik heb een strategie voor server-side JavaScript debuggen
voor client-side JavaScript debuggen, en voor Liquid code debuggen. Ik geef mij hiervoor 1 punt.
Dit komt omdat ik wel debug in de serverside, maar nog niet in liquid en clientside.
Serverside debuggen
Ik kan GET en POST routes aanmaken en request parameters gebruiken. Ik geef mijzelf hiervoor 2 punten.
Dit komt omdat ik dit zelf wel al kan toepassen, maar moet regelmatig nog wel naar mijn eigen werk
terug kijken om na te lopen of ik het goed doe.
POST
en
GET
routes
Ik kan server-side JSON data fetchen uit een REST API. Ik geef mijzelf hiervoor 3 punten.
Ik weet hoe ik uit de API de JSON data kan fetchen.
Fetch
Ik kan data uit een REST API filteren of sorteren. Ik geef mijzelf hiervoor 2 punten. Ik weet welke filters
ik kan toepassen vanuit de directus API en welke woorden ik moet gebruiken om de juiste data te krijgen.
Filter
Ik snap wat het async keyword doet in JavaScript code. Ik geef mijzelf 2 punten hiervoor. Async is het woord dat de data pas wordt ingeladen
wanneer de pagina zelf is ingeladen en dat de content dus wacht met inladen.
Async
Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON. Ik geef mijzelf hiervoor 0 punten. Ik weet
dat het een behandeling is wanneer er iets is ingevoerd dat niet bij de data klopt.
Ik kan met een client-side fetch een werkend formulier verrijken. Ik geef mijzelf 1 punt. Met dank aan
Suus was het mij gelukt het formulier.
Clientside formulier verrijken
Ik kan multi-page en single-page view transitions inzetten en aanpassen. Ik geef mijzelf hiervoor 1 punt.
Ik kan multi-page transitions toepassen, maar single-page nog niet. Multi page op
pagina 1
en
Pagina 2
Ik kan verschillende manieren van responsive images uitleggen en toepassen. Ik geef mijzelf hiervoor 0 punten. Ik heb
meegedaan aan de opdrachten alleen was het mij helaas neit duidelijk.
Responsive Images
Ik weet hoe ik de resultaten van een performance audit moet interpreteren en hoe ik performance problemen kan oplossen. Ik geef mijzelf hiervoor 1 punt.
Ik weet hoe ik images in grootte minder kan maken en hoe ik het laden daarvan kan beïnvloeden.
Ik weet hoe ik met client-side JS de UX kan verbeteren, rekening houdend met progressive enhancement. Ik geef mijzekf hiervoor 2 punten
Ik weet hoe ik binnen HTML, CSS en client-side JS nieuwe technieken toe kan passen, rekening houdend met oudere browsers. Ik geef mijzelf heirvoor 2 punten
dit doe ik door middelvan te werken met de supports tag.
Ik weet wat objecten, arrays, strings, loops, variabelen, functies en parameters zijn, en kan die in JavaScript inzetten. Ik geef mijzelf
hiervoor 2 punten. Ik weet nog niet veel van loops en strings
Ik weet wat geavanceerdere concepten in JavaScript zijn, zoals closures,
promises, callbacks, scope en de event loop. Ik geef mijzelf hiervoor 1 punt. Ik weet
Ik kan via GitHub met feature branches werken, pull requests aanmaken, reviewen en mergen. Ik geef mijzelf hiervoor 1 punt.
Ik weet hoe ik formulieren pro-actief kan valideren met client-side code. Ik geef mijzelf hiervoor 1 punt.
Ik weet de eerste regel van ARIA, en wat dat betekent voor hoe ik HTML schrijf. Ik geef mijzelf hiervoor 0 punten.
Ik weet wat layout shifts zijn, door wat ze veroorzaakt worden, hoe ik ze kan meten en hoe ik ze kan oplossen. Ik geef mijzelf hiervoor 2 punten.
Ik weet wat de Core Web Vitals zijn, hoe ik die kan meten, en hoe ik de cijfers moet interpreteren. Ik geef mijzelf hiervoor 0 punten
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. Ik geef mijzelf hiervoor 0 punten
Ik kan UI states in meerdere lagen van progressive enhancement inzetten om de UX te verbeteren. Ik geef mijzelf hiervoor 1 punt.
Ik kan een UI leuker en prettiger maken, zonder de core functionaliteit uit het oog te verliezen. Ik geef mijzelf hiervoor 2 punten.
Ik kan scroll-driven animations inzetten om de UI beter te maken. Ik geef mijzelf hiervoor 1 punt.
Ik weet hoe ik verschillende vormen van feature detection in kan zetten in HTML, in CSS en in client-side JS ik geef mijzelf hiervoor 1 punt
20 juni
Ik begrijp het verschil tussen client-side JavaScript en server-side JavaScript en wanneer ik welke het handigst in kan zetten. Ik geef mijzelf hiervoor 2 punten
Ik heb een strategie voor server-side JavaScript debuggen, voor client-side JavaScript debuggen, en voor Liquid code debuggen. Ik geef mijzelf hiervoor 1 punt
Ik kan GET en POST routes aanmaken en request parameters gebruiken. Ik geef mijzelf hiervoor 3 punten.
Ik kan server-side JSON data fetchen uit een REST API. Ik geef mijzelf hiervoor 2 punten
Ik kan data uit een REST API filteren of sorteren. Ik geef mijzelf hiervoor 2 punten.
Ik snap wat het async keyword doet in JavaScript code. Ik geef mijzelf hiervoor 2 punten.
Ik weet wat het doel is van een try/catch block en kan het gebruiken bij het parsen van JSON. Ik geef mijzelf hiervoor 1 punt.
Ik kan met een client-side fetch een werkend formulier verrijken. Ik geef mijzelf hiervoor 1 punt.
Ik kan multi-page en single-page view transitions inzetten en aanpassen. Ik geef mijzelf hiervoor 1 punt.
Ik kan verschillende manieren van responsive images uitleggen en toepassen. Ik geef mijzelf hiervoor 1 punt.
Ik weet hoe ik de resultaten van een performance audit moet interpreteren en hoe ik performance problemen kan oplossen. Ik geef mijzelf 0 punten.
Ik weet hoe ik met client-side JS de UX kan verbeteren, rekening houdend met progressive enhancement. Ik geef mijzelf hiervoor 0 punten
Ik weet hoe ik binnen HTML, CSS en client-side JS nieuwe technieken toe kan passen, rekening houdend met oudere browsers. Ik geef mijzelf hiervoor 1 punt.
Ik weet wat objecten, arrays, strings, loops, variabelen, functies en parameters zijn, en kan die in JavaScript inzetten. Ik geef mijzelf hiervoor 2 punten.
Ik weet wat geavanceerdere concepten in JavaScript zijn, zoals closures, promises, callbacks, scope en de event loop. Ik geef mijzelf hiervoor 1 punt.
Ik kan via GitHub met feature branches werken, pull requests aanmaken, reviewen en mergen. Ik geef mijzelf hiervoor 1 punt.
Ik weet hoe ik formulieren pro-actief kan valideren met client-side code. Ik geef mijzelf hiervoor 1 punt.
Ik weet de eerste regel van ARIA, en wat dat betekent voor hoe ik HTML schrijf. Ik geef mijzelf hiervoor 0 punten.
Ik weet wat layout shifts zijn, door wat ze veroorzaakt worden, hoe ik ze kan meten en hoe ik ze kan oplossen. Ik geef mijzelf hiervoor 2 punten.
Ik weet wat de Core Web Vitals zijn, hoe ik die kan meten, en hoe ik de cijfers moet interpreteren. Ik geef mijzelf hiervoor 1 punt
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. Ik geef mijzelf hiervoor 2 punten.
Ik kan UI states in meerdere lagen van progressive enhancement inzetten om de UX te verbeteren. Ik geef mijzelf hiervoor 1 punt.
Ik kan een UI leuker en prettiger maken, zonder de core functionaliteit uit het oog te verliezen. Ik geef mijzelf hiervoor 1 punten.
Ik kan scroll-driven animations inzetten om de UI beter te maken. Ik geef mijzelf hiervoor 1 punt.
Ik weet hoe ik verschillende vormen van feature detection in kan zetten in HTML, in CSS en in client-side JS. ik geef mijzelf hiervoor 2 punten
Jaar 2
Leervragen begin sprint 13
Hoe kan ik Sveltekit beter begrijpen en implementeren in mijn huidge projecten?
Hoe til ik mijn Javascript kennis omhoog bij het niveau dat nodig is in jaar 2?
Hoe leer ik realistisch plannen en poker planning?
8 september
Leervragen van vandaag
Welke keuzes heb jij gemaakt in jouw motion language (shapes, direction, easing, duration)?.
Ik heb gekozen voor mijn animatie die in de centrale richting beweegt. De duratie van deze view-transition
zal niet langer duren van één seconde. De duratie zal 0,3 seconden zijn.
Hoe zou je animatie kunnen toepassen om de gebruikerservaring van je overzichtspagina te versterken?
Je zou animatie kunnen toepassen om focus te leggen waar de gebruiker zal moeten kijken op de pagina.
Waar je het ook voor zou kunnen gebruiken als je een filter hebt is het rustiger maken van je gezichtsveld
17 september
Hoe verschilde jouw conventies met die van de FDND Agency? uiteindelijk
waren er wel wat verschillen met de Gitflow van het project, waar het wel beter
had kunnen werken. Leren branchen in de
Gitflow. Een develop branch maken en vanuit daar feature branches maken. De andere conventies zoals
commentaar deed ik al.
Welke conventies zou je willen toevoegen aan die van de FDND Agency? Ik zou
er geen willen toevoegen, maar mij er wel zelf aan willen houden
Wat waren de belangrijkste punten uit de kampvuursessie? Dat ik meer initiatief moet nemen
in het project.
23 september
vandaag heb ik wat gespeeld met de nieuwe corner-shape die wordt ondersteund in Chrome en Edge.
Het is een interessante tool en je kan op elke rand een nieuwe shape maken. Ik vind dit een handige
tool.
6 oktober
Welke stappen neem je om een project in SvelteKit op te starten? De stappen die ik voortaan neem
is mijn sitemap weer eens erbij pakken en op basis daarvan mijn project inrichten.
Hoe kan je AI gebruiken om principes en best-practices van een framework te ontdekken? Ik ga ai gebruiken door
mijn prompts slim op te stellen en woordenschat gebruiken die bij de opleiding hoort.
Welke SvelteKit principes en best-practices heb je geleerd te gebruiken? Forms, layouts, routes, error, stores, components en evironment variables
13 oktober
Hoe ging de refinement op de backlog? Het ging goed nadat we de user stories in subissues hebben gedaan. Ik vond dit een duidelijk process
Hoe helpt een refinement jouw project? Het helpt om je user stories op te delen in kleine schaalbare taken die jij en je teamleden kunnen zien.