IT

xarop.com pagina di destinazione

Disseny & Desenvolupament · 2026 · visita →

Design FrontEnd Portfolio

#a11y #Astro #cloudflare #css #design #javascript #performance #TypeScript #xarop

Il progetto

Pagina di landing di xarop.com: una pagina di ingresso ad alte prestazioni costruita con Astro 5 e TypeScript. Presenta il portfolio, i servizi e le FAQ in tre lingue (CA / ES / EN), con palette di colori intercambiabili e supporto per tema scuro/chiaro.

Stack

  • Astro 5 — generazione statica, routing e componenti
  • TypeScript — tutta la logica dei componenti e configurazione tipizzata
  • Vanilla CSS — design tokens, 7 palette flavor, modalità scura, senza framework esterni
  • Asap — tipografia auto-ospitata, zero chiamate a Google Fonts
  • Cloudflare Pages — deploy e CDN globale

Caratteristiche

  • ~10 KB di JavaScript — tutto progressivo, la pagina funziona senza JS
  • 7 varianti di palette persistenti in localStorage
  • Multilingue (CA / ES / EN) tramite routing nativo di Astro
  • Scroll reveal con IntersectionObserver, senza dipendenze
  • Accessibile — WCAG 2.1, focus ring, prefers-reduced-motion
  • Deploy compatibile con Cloudflare Pages, Vercel e Netlify

xarop.com → · Codice su GitHub