Welkom bij de Frontend Olympics! Waar developers hun skills testen, hun zenuwen verliezen, en hun browser console vervloeken. Bereid je voor op een epische strijd tussen CSS, JavaScript, en je eigen ego.
De Opdracht: Centreer een div. Ja, dat is alles. Nee wacht, dat is NIET alles. Doe dit op zo veel mogelijk manieren. Denk buiten de doos. (extra punten voor meest creatieve oplossing)
De Opdracht: Maak een simpel icoon (bijvoorbeeld een hamburger menu dat verandert in een kruisje) zonder afbeeldingen of SVG. Puur CSS. Alleen divs en transform.
De Opdracht: Je krijgt een modaal venster (popup) dat je niet met het toetsenbord kunt sluiten. Je taak: maak het toegankelijk!
Je moet implementeren:
De Opdracht: Maak een zoekbalk die een API call doet, maar pas nadat de gebruiker 500ms gestopt is met typen.
Waarom? Omdat niemand houdt van een server die crasht omdat iemand "react" typt en je 5 API calls doet voor elk karakter. Je moet leren geduld te hebben. Of in ieder geval, je code moet dat leren.
De Uitdaging: Implementeer debounce zonder een library te gebruiken. Want we zijn hier om te leren, niet om lodash te importeren (ook al is dat eigenlijk best slim).
De API Endpoint:
/api/search?q=<jouw-zoekterm>GETProbeer het zelf uit (zonder debounce):
Type quickly and watch the server get overwhelmed. Notice how each keystroke triggers a new API call!
De Opdracht: Dit is een teamspel. Eén persoon is De Prompter:
De andere persoon is De Copy-Paster:
Het Doel: Leren hoe je visuele instructies vertaalt naar technische prompts. Want in de toekomst zal je vaker met AI werken dan je denkt. En "maak het mooi" is geen goede prompt. Trust us.