Ny version av xarop.com (2026)

2026-04-23 Blog

#a11y #Català #css #Git #github-pages #html #javascript #meta #Node.js #WordPress #xarop #xarop.com

Den här webbplatsen är 2026-versionen av xarop.com. Det är i grund och botten mindre: mindre kod, färre beroenden, färre abstraktioner.

Vad jag hade innan

En WordPress-installation. Anpassat tema. MySQL-databas. Cache. Säkerhetsplugins. Säkerhetskopior. En VPS. En uptime-monitor. Ett år utan att skriva någon artikel eftersom det att uppdatera bloggen innebar att öppna administratörspanelen och kämpa mot Gutenberg-redigeraren.

Vad jag har nu

En mapp med Markdown-filer. Ett Node.js build-skript. Tre CSS-filer. GitHub Pages. Noll databas.

För att skriva en artikel:

$ touch content/blog/nytt-inlägg.md
$ $EDITOR content/blog/nytt-inlägg.md
$ git push

GitHub Actions bygger webbplatsen och publicerar den. Trettio sekunder senare är den på internet.

Varför

För att WordPress var overkill för en personlig blogg med åtta artiklar per år. För att att underhålla en server är arbete som inte ger mig något. För att webben blir bättre när den är liten, platt och semantisk.

Också: för att jag gillade idén om att min webbplats hade smaker. "xarop" betyder xarop på katalanska — söt och koncentrerad — och smakerna var ett visuellt skämt som jag var glad över att implementera. Nu kan du ändra hela paletten med ett klick. Ingen omladdning. Det är nästan allt CSS. Totalt finns det sju smaker: jordgubbe, blåbär, körsbär, mynta, citron, apelsin och lakrits.

Stack

• HTML skrivet för hand, semantiskt så rent som jag kunnat.
• Moderna CSS med custom properties, @media (prefers-color-scheme), ::selection, color-scheme, view transitions. Ingen framework.
• Markdown för innehållet, gray-matter för front-matter, marked för rendering.
• Asap — typografi för rubriker, själv-hostad (OFL), utan några anrop till Google Fonts.
• Node.js för build (ingen runtime på klienten).
• GitHub Pages för hosting.

Det är mycket troligt den mest tråkiga stacken jag använt på tio år. Det gör mig mycket glad.

Innehållsmigrering

WordPress-arkivet (2007–2024) har migrerats till Markdown-format: ungefär 90 blogginlägg och 70 portföljprojekt, med kategorier, taggar och framhävda bilder bevarade. Inget innehål förlorat, ingen databas.

Framhävda bilder laddades ned från den gamla servern, konverterades till WebP (max 1200px, q82) och själv-hostades. Nya projekt utan bild genererar automatiskt en skärmdump av projektets URL via Puppeteer.

Navigering av innehål

Blog och portfölj har en sticky aside med alla kategorier och taggar som ett navigerbart moln. Sidor för varje kategori och tagg visar filtrerat innehål med samma aside för att fortsätta utforska.

Vad kommer härnäst

Tekniska anteckningar om moderna CSS, prestanda, tillgänglighet och några sporadiska utflykter till andra ämnen. Ingen kalender, ingen förpliktelse.

Tack för att du läser — om det här är första gången du hamnar här, välkommen.