Techniek
Waar deze sitewerkelijk van gemaakt is.
Negentien keuzes, vier lagen, en de afweging die elke keuze meebrengt. Kies een laag om de weergave te versmallen, open een techniek om te lezen waarom die er is en wat die kost.
01Lagen
Selecteer een laag om te filteren en open daarna een techniek voor de redenering erachter.
Alle lagen tegelijk — de volledige opbouw, van boven naar beneden.
02Technieken
18 van 18 getoond
- next 16.2.10
Het raamwerk: App Router, servercomponenten, één build, één deploy.
Gedeeld met Equilibrium
- react 19.2.4react-dom 19.2.4
De UI-runtime — servercomponenten voor de schil, clientcomponenten voor alles waar een hand aan zit.
Gedeeld met Equilibrium
- tailwindcss ^4
Het ontwerpsysteem: vijf paletten uit één set semantische tokens.
Gedeeld met Equilibrium
- framer-motion ^12.42.2
Elke animatie op de site, van de onthulling van de koppen tot de kaarten die op deze pagina opengaan.
Gedeeld met Equilibrium
- lenis ^1.3.25
Vloeiend scrollen — de traagheid onder elke pagina.
Gedeeld met Equilibrium
- three ^0.185.1@react-three/fiber ^9.6.1
Het 3D-terrein, geschreven als React-componenten in plaats van imperatieve scènecode.
Gedeeld met Equilibrium
- next-themes ^0.4.6
Paletwissels — Paper, Weide, Bos, Nacht en Nocturne — als een klasse op het document.
Alleen deze site
- lucide-react ^1.23.0
De iconenset: pijlen, chevrons en statusmarkeringen.
Alleen deze site
- clsx ^2.1.1tailwind-merge ^3.6.0
Voorwaardelijke klassenamen, waarbij latere utilities eerdere terecht verslaan.
Alleen deze site
- Platform
Hosting, CDN en deploys. Een push naar de main-branch is een productierelease.
Gedeeld met Equilibrium
- @vercel/blob ^2.6.1
De private opslag met het gepubliceerde contentdocument en de geüploade foto's van de studio.
Gedeeld met Equilibrium
- Zelf gebouwd
Bewerken op de live site: inloggen, op elke zin klikken, hem in beide talen herschrijven, publiceren.
Alleen deze site
- next-auth ^4.24.14
De Google-login die de editor bewaakt — een toegangslijst van precies één adres.
Alleen deze site
- typescript ^5
Slapend. Een contentstudio die nog op een eigen route hangt, bewaard maar niet gebruikt.
Gedeeld met Equilibrium
- eslint ^9eslint-config-next 16.2.10
De taal waarin alles geschreven is — ook de vorm van het contentdocument.
Alleen deze site
- @tailwindcss/postcss ^4
De lintpoort, die vóór elke pull request de eigen regelset van het framework draait.
Gedeeld met Equilibrium
- @types/node ^20@types/react ^19@types/react-dom ^19@types/three ^0.185.1
De enige buildstap tussen het stijlblad en de browser.
Gedeeld met Equilibrium
- Scripts in de repository
Types voor de bibliotheken die er zelf geen meeleveren.
Alleen deze site
De versienummers op deze pagina worden bij het bouwen uit de package.json van de repository gelezen, zodat ze niet kunnen afwijken van wat er werkelijk geïnstalleerd is.
03Uitgangspunten
De regels onder de lijst
- 01Eén animatiebibliotheek. Nooit een tweede ernaast.
- 02Kleuren heten naar hun rol, nooit naar een hexcode — zo komen er vijf paletten uit één set componenten.
- 03Elke animatie heeft een stille versie. Reduced motion is een volwaardige manier om deze site te lezen, geen uitgeklede.
- 04Elk bedieningselement draagt een zichtbaar woord. Niets hier is een icoon dat je moet ontcijferen.
- 05Beide talen zijn echte adressen, geen schakelaar in de browser — Nederlandse pagina's zijn vindbaar, deelbaar en indexeerbaar.
- 06Er wordt niets samengevoegd voordat de typecontrole, de linter en de productiebuild alle drie zwijgen.
Hetzelfde manifest wordt byte-identiek bijgehouden in de Equilibrium-repository, zodat beide sites tegen elkaar te controleren zijn. Convergentie is het plan; het versieverschil is het werk.
11/18 hiervan draaien ook op Equilibrium