Com he construït aquest blog

Aquest blog és un conjunt de fitxers de text amb historial de versions. Quan els canvio, un servei extern els converteix en pàgines HTML i les publica. Aquest article explica quina és cada peça i com encaixen.

Un blog dinàmic (WordPress o similar) és un servidor, una base de dades, un panell d’administració i un reguitzell d’actualitzacions de seguretat. Cada peça s’ha de mantenir al dia, i si no ho fas, es converteix en un risc de seguretat.

Un blog estàtic és només això: fitxers. No hi ha cap procés a explotar, cap base de dades a fer malbé, res a actualitzar. I cada canvi queda registrat en l’historial de versions: es pot consultar, comparar i desfer. El contingut és text pla que qualsevol eina pot llegir, ara i en el futur.

La pila

• Hugo: generador de llocs estàtics. Entrada: Markdown. Sortida: HTML i CSS. Generar el lloc triga dècimes de segon.
• Markdown: text pla amb format mínim. Es llegeix amb qualsevol editor i no depèn de cap programa concret.
• Tema Alpine: minimalista i pensat per a la web independent. Cada pàgina porta metadades invisibles que altres programes poden llegir: el contingut no és només text per a persones, també són dades per a màquines.
• Adaptacions pròpies: el tema és una base que es pot actualitzar. Tots els retocs que hi he fet (capçalera, dates en català, respostes als posts, selector de tema) estan en una carpeta separada del lloc, no dins del tema. Així, quan el tema s’actualitza, els meus canvis no es perden.
• Git + GitHub: l’historial de versions viu a GitHub, que a més fa de còpia de seguretat. Cada versió de cada post queda registrada.
• Cloudflare Pages: allotjament i desplegament automàtic. El projecte està enllaçat amb GitHub: cada cop que envio els canvis, el lloc es regenera i es publica en un minut, amb HTTPS i una xarxa de distribució de continguts (CDN). Gratuït.
• GoatCounter: analítica ètica. Un comptador de visites sense cookies ni perfils d’usuari, amb una línia de JavaScript.
• Webmention.io: rep les respostes que em fan des d’altres llocs (per exemple, Mastodon) i les mostra sota cada post. La conversa no queda tancada a cap plataforma.
• Decap CMS: un panell d’edició que desa directament al repositori. Publicar des del mòbil sense obrir un terminal: el panell guarda els canvis per mi.
• Selector de tema: variables CSS i un botó amb poques línies de JavaScript; la tria es guarda al navegador. Sense frameworks.

El flux

1. Escric un fitxer .md a content/posts/ (o ho faig des del Decap CMS).
2. Desa els canvis i envia’ls al repositori (el panell ho fa automàticament).
3. Cloudflare Pages detecta els canvis, genera el lloc i publica el resultat al CDN.
4. El visitant rep fitxers estàtics: sense servidor d’aplicacions, sense base de dades, sense res a vigilar.

El límit

Cloudflare Pages és gratuït i ràpid, però continua sent un tercer: el lloc viu a la seva xarxa, el domini és llogat (pages.dev) i les regles les posa ell. Aquesta pila resol el problema de la propietat del contingut (els fitxers són meus i portables), però no el de la propietat de la infraestructura. El següent pas és un servidor propi, i el tinc mig planejat: potser acaba sent una Raspberry Pi, un ordinador petit i barat que pot funcionar dia i nit a casa. Fins llavors, aquest blog és una casa on el terreny encara és llogat; els mobles, les parets i tot el que hi ha dins són meus.