Il sito che stai leggendo. Ho ricostruito il mio portfolio da zero come esercizio deliberato di sobrietà: spedire meno JavaScript possibile, rendere ogni pagina veloce e accessibile, e avere comunque un look riconoscibile. È anche una demo dal vivo di come mi piace costruire per il web.
L’obiettivo
Un sito personale che trasmetta credibilità tecnica a colpo d’occhio — veloce, curato, accessibile e chiaramente progettato, non calato su un template. I vincoli che mi sono dato: static-first, zero JS di default, piena parità bilingue (IT/EN) e punteggi Lighthouse il più vicino possibile a 100 su ogni pagina, mobile e desktop.
Static-first, zero JS di default
Costruito sull’architettura a isole di Astro: le pagine sono .astro statiche di default e non spediscono JavaScript al client. L’interattività è opt-in — il form di contatto e la navigazione mobile sono le uniche isole React, idratate con la direttiva più pigra che funziona. La navigazione usa le view transition native cross-document più il prefetch dei link, così sembra istantanea senza un router lato client.
Un design system da zero
Tutto il look “outrun / synthwave” è fatto a mano su Tailwind CSS v4 con un’architettura di token a tre livelli (primitive → semantico → componente) in OKLCH, così la palette è ri-brandabile da un solo file. shadcn/ui (su primitive Base UI) fornisce i componenti interattivi, incapsulati dietro un’unica superficie d’import. La hero è una scena animata a tutto schermo — campo stellare, sole che pulsa, griglia prospettica — progettata per animarsi a basso costo (niente drop-shadow per frame) e per rispettare pienamente prefers-reduced-motion.
È tutto su un’unica pagina: esplora il living design system — token, scala tipografica, componenti, effetti di testo e le utility neon, guidati dalle vere variabili del tema.
Bilingue per progetto
Ogni pagina e ogni contenuto esiste sia in italiano sia in inglese, usando il routing i18n nativo di Astro più un dizionario di stringhe UI type-safe e a runtime zero. I contenuti lunghi (progetti, esperienza) vivono in Content Collection per-locale. Un test di parità automatico blocca ogni build in cui una traduzione va in deriva o manca — così la SEO multilingue (hreflang simmetrici, self-canonical, JSON-LD per locale) resta pulita.
Sotto il cofano
Viene distribuito su Cloudflare Workers come static assets tramite build guidate da Git, con Bun come runtime e toolchain locale. L’unico pezzo dinamico — il form di contatto — gira come Astro Action validata con uno schema Zod condiviso, protetta da Turnstile e consegnata tramite l’API HTTP di Resend. Header di sicurezza (una CSP mirata, HSTS) e analytics conformi al GDPR, attivati solo dopo il consenso, completano il quadro. Il risultato tiene ~100 su Lighthouse per accessibilità, best practice e SEO, e resta sopra il 90 per le performance.