Please enable JavaScript.
Coggle requires JavaScript to display documents.
Web app di crescita personale — React 18 + Vite, backend Firebase (Auth +…
Web app di crescita personale — React 18 + Vite, backend Firebase (Auth + Firestore), coach AI via Google Gemini. Progetto d'esame SAW, Universita di Pisa. Live: habitforge-saw26.web.app
-
Sottili wrapper sui Context: espongono alle pagine una fetta di stato gia pronta, nascondendo useContext e la logica del provider.
Consuma AuthContext e lancia un errore esplicito se usato fuori dal provider: bug da intercettare subito in sviluppo.
-
-
-
Orchestra la conversazione col coach: costruisce lo snapshot utente e lo invia a Gemini in una sola chiamata.
Preferenza promemoria (attivo? a che ora?) in localStorage: e una scelta di dispositivo, non un dato applicativo.
-
Funzioni pure, senza React e senza Firebase: il cuore algoritmico dell'app, il piu facile da testare.
Le date viaggiano sempre come stringhe 'YYYY-MM-DD': ordinabili alfabeticamente e coincidenti con la chiave dei documenti completions.
Conta i giorni PROGRAMMATI consecutivi completati: per le abitudini custom valgono solo i giorni in habit.days; i giorni non programmati si saltano, uno programmato mancato azzera la streak.
Traduce il rapporto completate/totali in uno dei 5 livelli di colore, su scala GitHub-like.
Progresso di un obiettivo: automatico contando i completamenti dell'abitudine collegata, oppure manuale dal contatore salvato.
Somma i pesi delle risposte su due assi — approccio (analitico/creativo) e ritmo (costante/esplosivo) — e sceglie l'etichetta del quadrante.
-
CSS Modules per i componenti, piu due fogli globali.
Design token: palette, spaziature, tipografia e raggi come custom properties CSS.
Reset, stili di base e tema applicati a tutto il documento.
Due Context React eliminano il prop drilling: identita utente e dati applicativi sono leggibili da qualsiasi componente.
Osserva onAuthStateChanged per reagire a login/logout/reload. Il merge dello stato preserva il displayName gia presente: un hydrate senza nome non deve azzerarlo.
Sottoscrizione realtime a users/{uid}: tiene aggiornati profile, dailyReport e dailyQuote. Si ri-sottoscrive solo al cambio di uid.
Unico punto di verita per habits, completions, goals e diary. Realtime con onSnapshot: le CRUD scrivono su Firestore senza toccare lo stato locale, cosi due schede restano sincronizzate.
Una sottoscrizione per collezione (habits, completions, goals, diary), con cleanup di tutte le unsubscribe all'unmount.
Firestore restituisce [{id:'YYYY-MM-DD', habits:[...]}]; il provider la converte nella mappa {'YYYY-MM-DD': [...]} attesa dal resto dell'app.
Confine tra applicazione e mondo esterno: Firebase, Firestore, API Gemini e notifiche di sistema.
Inizializza Firebase da variabili d'ambiente Vite. La config e pubblica per natura (finisce nel bundle): la sicurezza sta nelle Security Rules, non nel nasconderla.
Registrazione, login, logout e observeAuth. Alla registrazione crea anche il documento utente su Firestore.
CRUD generico + onSnapshot per il realtime. I campi del documento utente si scrivono con setDoc + merge: updateDoc fallirebbe se users/{uid} non esistesse ancora.
Documento utente: profile, dailyReport, dailyQuote, preferenze.
-
Un documento per giorno, ID = 'YYYY-MM-DD', campo habits[] con gli id completati.
Obiettivi misurabili, opzionalmente collegati a un'abitudine.
-
Chiamata REST all'API Google Gemini: POST con body JSON e controllo di response.ok. Costruisce uno snapshot compatto dello stato utente da passare al modello.
Notifiche locali PWA via Notification API + service worker. Il permesso si chiede in modo contestuale dal Profilo, non all'avvio.
Security Rules: ogni utente legge e scrive solo sotto users/{uid} corrispondente al proprio token. E qui che vive davvero l'isolamento dei dati.
Componenti riusabili con CSS Modules: ogni cartella accoppia il .jsx al suo .module.css, evitando collisioni di classi.
-
-
-
-
Build, hosting e configurazione dell'ambiente.
Dipendenze e script npm (dev, build, preview, deploy).
Configurazione Vite e plugin PWA (service worker, manifest, precache).
Configurazione Hosting: rewrite di tutte le rotte su index.html, necessario per una SPA con routing lato client.
-
Modello delle variabili d'ambiente: chiavi Firebase e Gemini, da copiare in .env locale.
Esclude node_modules, build e soprattutto il file .env con le chiavi reali.
Istruzioni di avvio, credenziali dell'account demo e note di progetto.
Asset serviti cosi come sono, senza passare dal bundler.
-
-
-
-