Eén bron van waarheid
Alles op deze site komt uit een handvol TypeScript-bestanden in src/lib/data. De rollen hebben een begin- en einddatum en een stack. De rest wordt afgeleid: hoe lang ik elke skill gebruikte, de grafieken, de cijfers bij Over mij, de skillniveaus. Voeg ik een rol toe, dan werkt elk getal zich bij.
{ id: 'property-plan', company: 'Property Plan', start: '2025-07', end: '2026-07', stack: ['Angular', 'Ionic Framework', 'Capacitor', 'RxJS', 'Playwright', 'MCP']}Overlappende rollen tellen één keer, dus twee parallelle projecten met React maken van één jaar React geen twee.
Statisch, maar niet saai
De site is gebouwd met SvelteKit en geëxporteerd als gewone HTML met adapter-static, gehost op GitHub Pages. Elke pagina, in beide talen, is vooraf gerenderd, dus hij werkt zonder JavaScript en zoekmachines zien de volledige tekst.
Zwaardere secties laden pas als je in de buurt scrolt. De lettertypes worden zelf gehost, dus je IP-adres gaat niet naar Google. Statistieken komen van Cloudflare Web Analytics, zonder cookies, dus ook zonder cookiebanner.
Twee talen, twee URL’s
Engels staat op / en Nederlands op /nl/. Elke pagina linkt met hreflang-tags naar zijn vertaling, zodat een Nederlandse zoekopdracht de Nederlandse pagina toont. De tekst per taal staat in een eigen map, en TypeScript controleert dat de Nederlandse versie elke sleutel van de Engelse heeft.
Getest als een product
- Unittests met Vitest voor het datumrekenwerk en de afgeleide statistieken.
- End-to-end tests met Playwright, inclusief een axe-toegankelijkheidsscan van elke pagina in beide thema’s.
- Lighthouse CI bij elke pull request, met budgetten voor performance, toegankelijkheid en SEO.
- Een Content Security Policy met hashes voor elk inline script.
De status van mijn open-source pull requests wordt bij het bouwen opgehaald uit de GitHub API, en de site bouwt zichzelf elke week opnieuw, zodat een gemergde PR niet maandenlang als open blijft staan.
De code staat onder MIT-licentie op GitHub. Gebruik hem gerust voor je eigen portfolio.