JavaScript is een high-level, dynamisch getypeerde scripttaal en de kern van modern webdevelopment. Het brengt interactiviteit, dynamische content en complexe functionaliteit naar websites. Het draait in de browser én server-side via Node.js. ES6+ introduceerde features als arrow functions, classes, modules en async/await.
FCP
AA
Performance
First Contentful Paint
FCP is het moment waarop de eerste tekst of afbeelding in beeld komt. Het laat zien wanneer een gebruiker 'iets' ziet. Verbeter dit met critical CSS, een snelle serverrespons, minder render-blocking JS/CSS en geoptimaliseerde fonts.
AA
Performance
MongoDB
AA
Database
MongoDB
MongoDB is een leidende NoSQL-documentendatabase die data opslaat in flexibele JSON-achtige documenten (BSON), niet in tabellen en rijen. Het schema is flexibel en documenten kunnen verschillen. Het is schaalbaar en snel voor ongestructureerde data. Queries lijken op JavaScript.
AA
Database
Bootstrap
A
Frontend
Bootstrap CSS Framework
Bootstrap is een populair CSS-framework met een responsive grid, kant-en-klare componenten (buttons, cards, modals, navbars) en JavaScript-plugins. Het is mobile-first en aanpasbaar via Sass-variabelen. Ideaal voor snelle prototypes en consistente designs zonder diepe CSS-kennis.
A
Frontend
CSR
AA
Concepten
Client-Side Rendering
Bij CSR rendert de browser de pagina volledig met JavaScript: de server stuurt een vrijwel lege HTML-pagina en de browser bouwt de content op. Voordelen zijn een app-achtige ervaring na het laden. Nadelen zijn langzamere initiële laadtijd en complexere SEO. React en Vue zonder SSR zijn standaard CSR.
AA
Concepten
Webpack
AA
Tools
Webpack
Webpack is een krachtige modulebundler die JavaScript, CSS, afbeeldingen en andere assets analyseert, transformeert en bundelt. Het ondersteunt code splitting, tree shaking, loaders en plugins. De configuratie is complex, maar erg flexibel. Vite is een modern en sneller alternatief.
AA
Tools
Handlers
AAA
Talen & Formaten
Handlers
Een handler is een functie of methode die wordt aangeroepen als reactie op een specifieke gebeurtenis of conditie. In frontend-code zijn dit event handlers (addEventListener, onclick) — in backend-code zijn het request handlers, error handlers of middleware-functies. Handlers koppelen gedrag aan triggers en zijn een fundamenteel patroon in event-driven en request-response-architecturen.
AAA
Talen & Formaten
Tree-shaking
AAA
Concepten
Tree-shaking
Tree-shaking is een optimalisatietechniek in bundlers zoals Webpack en Rollup die ongebruikte code (dead code) uit de uiteindelijke bundle verwijdert. Bundlers analyseren de import/export-boom van ES-modules en schudden ongebruikte branches weg. Dit verkleint de bundle-omvang en verbetert de laadtijd aanzienlijk.
AAA
Concepten
Minification
A
Performance
Minification
Minificatie verkleint code door whitespace, comments en andere niet-essentiële tekens te verwijderen en soms namen te verkorten. Dit reduceert bestandsgrootte vaak met 30-60% zonder functionaliteit te wijzigen. Tools zijn Terser (JS) en cssnano (CSS).
A
Performance
JSON
A
Talen & Formaten
JavaScript Object Notation
JSON is een lichtgewicht, menselijk leesbaar formaat voor data-uitwisseling, gebaseerd op de JavaScript-objectsyntax. Het ondersteunt objecten, arrays, strings, numbers, booleans en null, en is taalonafhankelijk. Het is de facto standaard voor web-API's en configuratie.
A
Talen & Formaten
WebAssembly
AAA
Talen & Formaten
WebAssembly
WebAssembly (Wasm) is een formaat waarmee code geschreven in talen als C++, Rust of Go razendsnel in de browser kan draaien. Hierdoor kunnen complexe applicaties zoals games, video-editors en grafische tools op het web worden gebouwd met bijna dezelfde snelheid als native software. WebAssembly werkt naast JavaScript en draait veilig in een geïsoleerde omgeving (sandbox).
AAA
Talen & Formaten
Progressive Enhancement
AAA
Frontend
Progressive Enhancement
Progressive enhancement begint met een solide basis die overal werkt. Eerst lever je content met HTML, daarna presentatie met CSS en vervolgens interactie met JavaScript. Zo krijgt iedereen toegang, met extra's voor moderne browsers.
AAA
Frontend
Render-blocking
AA
Performance
Render-blocking resources
Render-blocking resources zijn CSS- en JavaScript-bestanden die de browser dwingen het renderen van de pagina te pauzeren totdat ze geladen en verwerkt zijn. CSS in de <head> blokkeert altijd — scripts zonder async of defer ook. Dit vertraagt de First Contentful Paint. Oplossingen: inline critical CSS, defer/async voor scripts en preload voor kritieke resources.
AA
Performance
Jest
AA
Tools
Jest
Jest is een JavaScript-testframework met zero-config en veel features. Het ondersteunt unit- en integratietests, snapshots, coverage en async-tests. Tests draaien snel en parallel. Standaardkeuze bij React, alternatief: Vitest (Vite-gebaseerd).
AA
Tools
Asynchroon
A
Concepten
Asynchroon
Asynchrone uitvoering betekent dat taken kunnen worden gestart zonder te wachten op de voltooiing ervan. De rest van het programma loopt gewoon door. Dit is essentieel in webbrowsers en Node.js voor zaken als API-aanroepen, bestandslezen en timers, zodat de interface of server niet blokkeert. Tegenhanger: synchroon.
A
Concepten
jQuery
A
Frontend
JavaScript Query Library
jQuery is een library die DOM-manipulatie, events, animaties en AJAX vereenvoudigt met goede cross-browser compatibiliteit. Het gebruik nam af door modern JavaScript en frameworks, maar blijft aanwezig in legacy-projecten en eenvoudige sites. Iconisch is de $()-selectorsyntax.
A
Frontend
CDN
A
Netwerk
Content Delivery Network
Een CDN is een wereldwijd netwerk van servers dat content vanaf de dichtstbijzijnde locatie levert. Voordelen zijn: snellere laadtijden, minder origin-load, DDoS-mitigatie en wereldwijde dekking. Het cachet vooral statische assets zoals afbeeldingen, CSS, JS en video's.
A
Netwerk
Axios
AA
Frontend
Axios JavaScript HTTP Client
Axios is een populaire JavaScript-library voor het doen van HTTP-requests in browsers en Node.js. Het biedt een schone, promise-based API met features als automatische JSON-serialisatie, request/response-interceptors, timeout-handling en global request-configuratie. Het is een veelgebruikt alternatief voor de Fetch API.
AA
Frontend
TypeScript
AA
Talen & Formaten
Typed JavaScript
TypeScript is een superset van JavaScript met statische types, interfaces en sterke IDE-ondersteuning. Het compileert naar standaard JavaScript. Types helpen typefouten vroeg te vinden en verbeteren onderhoudbaarheid en ontwikkelaarservaring, vooral in grotere projecten.
AA
Talen & Formaten
ESLint
AA
Tools
ESLint
ESLint is een pluggable lintingtool voor JavaScript/TypeScript gericht op codekwaliteit en consistentie. Regels zijn configureerbaar (.eslintrc) en veel issues kun je automatisch fixen. Het integreert met editors en CI en heeft talloze plugins en stijlgidsen.
AA
Tools
INP
AAA
Performance
Interaction to Next Paint
INP meet de algehele interactiviteitsrespons van een pagina gedurende de volledige levensduur van een bezoek. Het registreert de vertraging bij elke interactie (klik, toets, tap) en rapporteert de slechtste. INP heeft FID vervangen als Core Web Vital voor interactiviteit. Verbeter INP door lange JavaScript-taken op te splitsen, web workers in te zetten en zware event handlers te optimaliseren.
AAA
Performance
TSX
AAA
Talen & Formaten
TypeScript XML
TSX is de TypeScript-variant van JSX en combineert types met JSX-syntax voor type-safe React-componenten. Voordelen: type-checking voor props, betere IDE-support en eerder fouten vangen. Het transpileert naar JavaScript en is aanbevolen voor grotere apps.
AAA
Talen & Formaten
Async/await
A
Concepten
Async/await
Async/await is syntactische suiker voor Promises in JavaScript (en andere talen) waarmee je asynchrone code schrijft die eruitziet als synchrone code. Met `async` markeer je een functie als asynchroon — `await` pauzeert de uitvoering totdat de Promise is opgelost. Dit maakt code leesbaarder dan geneste callbacks of `.then()`-ketens.
A
Concepten
LESS
AA
Talen & Formaten
LESS
LESS is een CSS-preprocessor vergelijkbaar met Sass. Het biedt variabelen (@), nesting, mixins en functies. Minder populair dan Sass. De compiler is JavaScript-gebaseerd en compileert naar .css.
AA
Talen & Formaten
Code Splitting
AA
Performance
Code Splitting
Code splitting splitst je JavaScript-bundle op in kleinere stukken die geladne worden op het moment dat ze nodig zijn. Dat verkleint de initiële bundlegrootte aanzienlijk. Implementaties zijn route-gebaseerd (per pagina) of component-gebaseerd. Tools als Webpack, Rollup en Vite ondersteunen dit automatisch.
AA
Performance
JSX
AAA
Talen & Formaten
JavaScript XML
JSX is een JavaScript/XML-achtige syntax voor React-componenten. Het is syntactic sugar die via Babel transpileert naar React.createElement(). Zo kun je HTML-achtige code in JavaScript schrijven. Bestanden hebben vaak .jsx als extensie, maar .js kan ook.
AAA
Talen & Formaten
Memoization
AAA
Performance
Memoization
Memoization is een caching-techniek waarbij de resultaten van dure functies worden opgeslagen op basis van hun invoer. Bij dezelfde invoer wordt het gecachede resultaat direct teruggegeven, zonder de berekening opnieuw uit te voeren. Nuttig bij recursieve algoritmen en dure renderfuncties. In React: useMemo en useCallback.
AAA
Performance
Scraping
AAA
Concepten
Web scraping
Web scraping is het automatisch extraheren van data van websites door HTML te parseren. Tools zijn BeautifulSoup (Python), Puppeteer (JavaScript) en Scrapy (Python). Toepassingen zijn prijsvergelijking, contentmonitoring en data-analyse. Let op juridische en ethische aspecten: controleer de gebruiksvoorwaarden, robots.txt en de privacywetgeving (GDPR).
AAA
Concepten
Mapping
AAA
Talen & Formaten
Mapping
Mapping is het koppelen of transformeren van waarden van het ene formaat of de ene structuur naar het andere. In programmeren gebruik je map() om arrays element voor element te transformeren. In databases koppelt een ORM klassen aan tabellen (object-relational mapping). Bij API-integraties wordt data gemapped tussen formaten. Het is een kernpatroon in data-transformaties en functioneel programmeren.
AAA
Talen & Formaten
React
AA
Frontend
React JavaScript Library
React is een component-gebaseerde JavaScript-library voor interactieve UIs. Het gebruikt een virtuele DOM voor efficiënte updates, JSX (JS + XML) en hooks voor state en lifecycle. Het ecosysteem is uitgebreid (React Router, Redux, Next.js) en React is dominant voor SPAs.
AA
Frontend
Node.js
A
Backend
Node JavaScript Runtime
Node.js is een omgeving waarin je JavaScript op de server draait, met de snelle V8-engine van Chrome. Het werkt met events en blokkeert niet bij invoer en uitvoer, waardoor het veel taken tegelijk aankan en goed werkt voor realtime apps met veel data. Het npm-ecosysteem is enorm. Toepassingen zijn API's, microservices, tooling en full-stack development.
A
Backend
Prettier
AA
Tools
Prettier
Prettier is een codeformatter die een consistente stijl afdwingt zonder eindeloze discussies. Het formatteert automatisch bij opslaan of committen en ondersteunt JS, TS, CSS, HTML, JSON en Markdown. Minimale configuratie is benodigd.
AA
Tools
Polyfill
AA
Performance
Polyfill
Een polyfill is JavaScript-code die moderne browserfeatures nabootst in oudere browsers. Denk aan een Promise- of fetch-polyfill. Polyfills detecteren of een feature ontbreekt en vullen alleen dan aan. Dit verbetert compatibiliteit, met wat extra overhead.
AA
Performance
DOM
A
Frontend
Document Object Model
De DOM is de boomstructuur die de browser van een HTML-document maakt, waarbij elk element een node is. JavaScript kan de DOM manipuleren met bijvoorbeeld getElementById, querySelector en appendChild. Dit triggert reflow/repaint en kost performance. Een virtual DOM (zoals in React) optimaliseert dit.
A
Frontend
Parse
AA
Talen & Formaten
Parse
Parsen is het analyseren en omzetten van data van het ene naar het andere formaat, bijvoorbeeld van string naar object. In JavaScript zet JSON.parse() een JSON-string om naar een object en maakt parseInt() van een string een number. Het omgekeerde is stringify/serialize. Parsen gebeurt ook bij HTML/XML en bij compilers en interpreters.
AA
Talen & Formaten
Transpiling
AAA
Talen & Formaten
Transpiling
Transpilen zet moderne JavaScript (ES6+) om naar een oudere versie (ES5) voor legacy browsers. Tools zoals Babel transformeren bijvoorbeeld arrow functions, classes en async/await naar oudere, gelijkwaardige syntax. Dit is essentieel voor brede browserondersteuning.
AAA
Talen & Formaten
Event Loop
AAA
Talen & Formaten
Event Loop
De event loop is het mechanisme in JavaScript dat zorgt voor niet-blokkerende, asynchrone uitvoering. De call stack verwerkt synchrone code — asynchrone callbacks wachten in de event queue tot de call stack leeg is. Zo kan JavaScript meerdere taken tegelijk afhandelen, ondanks dat het single-threaded is. Het is de kern van hoe Node.js en browsers werken.
AAA
Talen & Formaten
Een uitgebreide collectie begrippen voor elk niveau
Van HTML & CSS tot databases en security
Geschikt voor beginners en gevorderden
Ideaal als lesmateriaal of teambuilding tool
Fysiek aan de slag, zonder scherm