Catalogo e discovery
La homepage combina hero, catalogo e segnali di qualità. Il catalogo è locale e statico, ma l'interazione è client-side: search, filtri, ordinamento e reset non ricaricano la pagina.
User Guide
Questa guida separa il comportamento utente dalla documentazione tecnica: spiega cosa provare nel sito, cosa è mockato e quali limiti sono intenzionali per mantenere la compatibilità con GitHub Pages.
La demo è pensata per mostrare un percorso shopper completo senza server runtime: scoperta prodotto, decisione, carrello e checkout simulato.
La homepage combina hero, catalogo e segnali di qualità. Il catalogo è locale e statico, ma l'interazione è client-side: search, filtri, ordinamento e reset non ricaricano la pagina.
Ogni prodotto ha una route statica generata da slug, immagini locali, prezzo formattato in euro, descrizione, feature principali e CTA contestuale per aggiungerlo al carrello.
Il carrello è un drawer laterale persistito in localStorage. Supporta apertura da CTA e header, Escape close, overlay close, focus management, quantità, rimozione e subtotale.
La pagina checkout simula una sessione Stripe nel browser. Non usa chiavi reali, API route o chiamate server: mostra solo il comportamento frontend atteso.
Il theme switch persiste la preferenza esplicita e usa prefers-color-scheme quando l'utente non ha scelto. La label descrive sempre l'azione futura.
Engineering documenta qualità tecnica e trade-off, Coverage mostra il report Vitest, Docs espone la reference TypeDoc generata, GitHub porta al codice sorgente.
Static by design
Questi limiti non sono funzionalità mancanti: rendono il progetto stabile, ispezionabile e pubblicabile come static export.