Denne siden er både porteføljen min og hjemmesiden til enkeltpersonforetaket mitt. Den skulle bygges én gang, skikkelig — ikke som nok et prosjekt jeg river ned om to år. Her er de tre beslutningene som formet den.
Hosting: les vilkårene
Vercel Hobby er teknisk sett perfekt for en Next.js-side — men vilkårene tillater kun ikke-kommersiell bruk. En side som skal skaffe et foretak kunder er kommersiell. Derfor er planen Cloudflare Workers ved lansering (gratis, kommersiell bruk tillatt), mens Vercel brukes som forhåndsvisning under utviklingen.
Det viktige grepet er at koden holdes hosting-agnostisk: standard Next.js uten plattformspesifikke API-er. Da er bytte av hosting en pipeline-endring, ikke en omskriving.
Tokens som eneste kilde til farge
Hver farge på siden kommer fra CSS-variabler i én fil. Aldri ren hvit, aldri ren svart, og begge moduser er håndplukket — mørk modus er ikke «invertert lys».
:root {
--color-bg: #f1f1f1;
--color-fg: #1a1a1e;
--color-accent: #0d6b85; /* 5.3:1 mot bakgrunnen */
}
[data-theme="dark"] {
--color-bg: #0e0e11;
--color-fg: #e8e8e6;
--color-accent: #35d0e8; /* 9.0:1 mot bakgrunnen */
}Kommentarene med kontrastverdier er ikke pynt: CI-en kjører Lighthouse med krav om 100 i tilgjengelighet, og en aksentfarge som ikke når 4,5:1 stopper hele bygget. Første aksentfargen min strøk faktisk på akkurat det.
Et budsjett med vetorett
Hver push kjører lint, typecheck, bygg og Lighthouse med budsjett: ytelse ≥ 95, tilgjengelighet = 100. Det høres strengt ut, men det er poenget — budsjettet har vetorett over designideer. En animasjon eller et bibliotek som ikke holder budsjettet, kommer ikke inn. Disiplinen er billig nå og umulig å ettermontere.
Resten av stacken: Next.js App Router, TypeScript strict, Tailwind v4, next-intl for norsk og engelsk, og Velite som typet innholdslag — alt innhold er markdown-filer i repoet, hentet gjennom én kontrakt som kan bytte backend senere uten at sidene merker det.
Siden du leser dette på er selv resultatet. Kildekoden viser resten.