This Website
A data-driven website where photos, GPS tracks, and geographic data become web pages. From structured YAML to static HTML, through Python and Astro.
Live
alessiogoria.com is not a template. It's a system where data from my experiences — photos, GPS tracks, coordinates, metadata — automatically become web pages. This is the story of how it was built.
The evolution
Version 1: static site with hand-written HTML. Version 2: React SPA with client-side routing. Version 3 (current): full migration to Astro 4 SSG with React islands. Zero JavaScript for content, hydration only where needed (gallery, navigation). Result: Lighthouse 95+, perfect SEO, sub-second load times.
Data-driven architecture
Content lives in structured YAML files: 22 trips, 20+ mountain outings, each with complete metadata (coordinates, dates, photos, bilingual descriptions). Python scripts transform YAML into optimized JSON. Astro generates a static HTML page for each content at build time. No production database for content: everything is pre-compiled.
Admin Panel
For content management I built a complete admin panel: React SPA with JWT authentication and PBKDF2 hashing, schema-driven structured forms, drag & drop image upload to Netlify Blobs, revision queue for editors, user management with roles and per-section permissions. Backend uses Netlify Functions v2 with Turso database (serverless libsql).
Content pipeline
The flow is: source YAML → Python script (build_content.py) → JSON in content-data/ → Astro getStaticPaths() → static HTML. Photos go through automatic optimization. IT/EN translations are managed by a dedicated i18n system. Sitemap is generated automatically. The entire process is reproducible with a single command.
Native bilingual
Every page exists in Italian and English with dedicated URLs (/viaggi/giappone-2025 and /en/viaggi/giappone-2025). Interface translations are centralized in a translations.js file. Content has _it and _en fields in every YAML. The language toggle maintains page position. Hreflang tags ensure correct indexing.