Minor
Web Design
& Development

Lees hier wat je moet kunnen en kennen voor de minor en hoe je je kan voorbereiden.

Kunnen en kennen

Voor de minor Web Design & Development is het belangrijk dat je gedegen kennis hebt van HTML, CSS en JavaScript, en dat je al een aantal vakken en/of projecten hebt gevolgd over web development en web design. In de minor gaan we meteen volle kracht vooruit met de vakken Web App From Scratch en CSS to the Rescue … Zonder deze voorkennis en code ervaring is de minor niet haalbaar. We gaan er van uit dat je dit weet van HTML, CSS en JS:

HTML

Je kan met HTML een webpagina opmaken en je bent bekend met verschillende HTML-elementen. Je kent de basisstructuur van een HTML pagina. Je begrijpt het Document Object Model (DOM). Je kan een link maken, je kan een formulier maken, je kan een image, video en audio element tonen, en je weet hoe deze elementen werken.

CSS

Je weet hoe je CSS aan een pagina moet toevoegen en je kan met CSS DOM elementen stylen. Je kent verschillende selectors, zoals bijvoorbeeld id, class, child, target en de attribute selector. Je kan verschillende states van een interactief element vormgeven. Je kan Flexbox en Grid toepassen om een layout te maken, en je kan een responsive pagina ontwerpen en maken met media-queries en/of schaalbare units.

JavaScript

Je kan je eigen code schrijven en je weet hoe je JavaScript aan een pagina moet toevoegen. Je kan een functie schrijven en gebruiken, je kan verschillende type variabelen gebruiken, je kan arrays gebruiken en manipuleren en je kan condities en loops gebruiken. Je kan met de querySelector, het classList-object en verschillende UI-Events een microinteractie maken. Je kan een JSON bestand laden en je weet hoe je de data kan koppelen en aan de DOM kan toevoegen.

Voorbereiden

Om je goed voor te bereiden op de minor kun je proberen een microinteractie te maken met HTML, CSS en Javascript. Het is ook belangrijk dat je weet hoe je met JavaScript data kan laden om daar iets mee te maken. Voordat de minor begint moet je al wat met Javascript hebben geëxperimenteerd. Hieronder staan een aantal links en voorbeelden waar je op kan studeren!

Microinteractie maken

Voor de minor moet je met de querySelector, het classList object en verschillende UI-Events een microinteractie kunnen maken. In dit artikel staat goed uitgelegd hoe je dat doet: Hey designers, if you only know one thing about JavaScript, this is what I would recommend.

Zorg dat je weet hoe je de querySelector moet toepassen om één of meerdere elementen in de DOM te selecteren. Zorg dat je weet hoe je events kan gebruiken voor het coderen van een interactie. Zorg dat je het classList object begrijpt en weet hoe je een CSS class aan een element kan toevoegen of weg halen.

Data laden en gebruiken

Met JavaScript kun je JSON data laden om te gebruiken in een website. Hier staat een goede tutorial om te leren hoe dat moet: Working with JSON. Het is belangrijk dat je goed begrijpt wat er in de tutorial wordt beschreven, voor de minor moet je dit zelf kunnen maken en begrijpen.

Zorg dat je weet wat JSON data is, hoe de XMLHttpRequest API werkt en hoe de Fetch API werkt. Dit zijn twee verschillende manieren om data te laden, het is goed om beide manieren te begrijpen. Het is ook goed om te begrijpen dat een server een response code geeft waar je in de interface iets mee kan doen, zoals het tonen van een error state of loading state.

Javascript Challenge

Om meer ervaring op te doen in JavaScript kun je de 30 Days JS Coding Challenge van Wes Bos volgen. Elke dag bouw je iets met HTML, CSS en JavaScript en leer je over functies, arrays, variabelen en meer.

JavaScript leer je door dingen te maken. In de 30 Days JS Coding Challenge bouw je 30 verschillende toepassingen, zoals een klok, video player of navigatie patterns. In de Challenge zitten makkelijke en best moeilijke opdrachten. Happy coding !

to Code