Firebase in produzione
Patterns, ottimizzazioni e lezioni imparate costruendo applicazioni reali su Firebase — dal Realtime Database a Firestore.
Articoli tecnici su sviluppo web, Firebase, PWA e intelligenza artificiale applicata al mondo reale.
Come ho collegato le conversazioni di un CRM esterno a Firestore per la ricerca AI: vector search, webhook in tempo reale, un cursore che non avanzava, e un "Cannot find package firebase-admin" tornato tre volte prima di arrendersi.
Cosa ho imparato integrando tre API pubbliche gratuite in una pagina: un blocco CORS silenzioso, un dataset NASA ufficialmente abbandonato, e un proxy Netlify Function che da solo non bastava.
Come ho costruito un tool di rimozione sfondo che gira interamente nel browser: la trappola della licenza AGPL, la scelta di un modello IA con licenza commercial-safe, la pulizia della matte alpha, i limiti reali di un modello specializzato e un bug che bloccava l'intera pagina durante il calcolo.
Come ho aggiunto un tool di riassunto PDF con IA al sito: estrazione testo lato client con PDF.js, Gemini Flash-Lite via Netlify Function, rate limiting su Firestore, e il problema reale delle nuove Auth Key di Google che rompono l'autenticazione via query param.
Come ho progettato e mantengo da solo PanelControl, un gestionale aziendale multi-ruolo in JavaScript vanilla su Firebase: un rendering engine fatto in casa con guardia sull'interazione utente, la migrazione dai listener on('value') a listener realtime granulari per tagliare 40-60 MB/giorno di banda, autenticazione con Custom Token e un pattern di permessi non distruttivo.
Come ho costruito un burraco online gratuito giocabile subito contro il computer, senza registrazione: validazione di tris e scale con i jolly, gestione del pozzetto come regola dipendente dalla storia delle calate, e un'intelligenza artificiale a tre livelli di difficoltà governata da euristiche, senza machine learning. Tutto in JavaScript vanilla, senza framework né build step.
Editor PDF completo lato browser — riordino pagine, annotazioni, firma, filigrana — con un occhio di riguardo alla redazione: perché un blackout visivo lascia il testo estraibile sotto, e come l'ho risolto rasterizzando solo le pagine toccate con PDF.js, tenendo vettoriali tutte le altre e ricomponendo il documento con pdf-lib. Zero upload, tutto in memoria del browser.
Un pannello interno Firebase autenticava automaticamente chiunque aprisse il sito con una credenziale condivisa hardcoded, a prescindere dal login mostrato in interfaccia. Come l'ho sostituita con identità reali per operatore via Netlify Function, Custom Token con claim per ruolo e Regole RTDB deny-by-default, in 5 fasi senza mai disconnettere il team — con due bug veri lungo il percorso.
Come ho costruito un gioco Breakout installabile come PWA partendo da zero: canvas API vanilla, manifest e service worker, 15 livelli disegnati a mano, effetti sonori generati via Web Audio API senza file esterni, particelle, screen shake e 4 power-up bilanciati per probabilità di drop.
Come ho ricreato dentro un pannello interno la stessa esperienza di Tidio — leggere e rispondere a una casella email condivisa senza dare agli operatori la password reale — con Gmail API, OAuth2 lato server, Netlify Functions, RTDB e FCM. Con i bug veri: un import mancante, un commento che si chiude da solo, e un secret sbagliato di un carattere.
Spark vs Blaze spiegato senza il gergo di marketing: cosa include davvero il piano gratuito, come funziona il pay-as-you-go di Blaze, tabella prezzi per Firestore/Hosting/Storage/Auth, e la novità 2026 su Cloud Storage che richiede sempre Blaze.
Come ho costruito, per un sito WordPress esterno, un sistema di presenza live e storico visitatori senza usare Tidio: Firebase Realtime Database con onDisconnect, storico su Firestore con geolocalizzazione IP, e un bug CORS che in realtà era un crash sulla risposta 204.
Come ho integrato myPOS IPC v1.4 in un checkout Netlify/Firebase: chiave RSA 1024-bit rifiutata da OpenSSL 3, mutual TLS incompatibile, l'algoritmo di firma corretto e l'Error Code 25 causato da un dominio .netlify.app non whitelistato.
Come ho rimosso tre superfici di attacco da un gestionale Firebase vanilla JS: XSS via innerHTML risolto con escapeHtml ed escapeJsAttr, password Firebase in chiaro sostituita da signInWithCustomToken via Cloud Function, chiave HMAC ruotata e migrata su Secret Manager.
Come ho automatizzato la generazione etichette MBE da un pannello ordini Netlify/Firebase: limite 4KB sulle env var di AWS Lambda, blocco WAF su tutti gli IP cloud mascherato da documentazione SOAP obsoleta, e la soluzione finale con un proxy Node.js su VPS dedicato.
Come ho costruito un sistema di conferma presa visione documenti con OTP email, hash SHA-256 del PDF via crypto.subtle, audit trail su Firestore e certificato generato con pdf-lib. Con i problemi reali: CORS su Firebase Storage, limite 4KB env var Netlify e popup blocker su window.open().
Come ho integrato un pannello di chat AI in un gestionale vanilla JS: fetch alla Gemini API, system prompt costruito dai dati live Firebase (ordini, operatori, bonus), base di conoscenza aziendale statica e gestione del versioning rapido dei modelli Gemini.
Varianti tariffarie per prodotto, admin panel protetto da PBKDF2 con Web Crypto API senza password nel codice, ordini numerati con transazione atomica anti-race-condition e CSP su Netlify con sottodomini dinamici Firebase.
Come ho sostituito un catalogo hardcoded con Firebase Realtime DB e Cloud Storage — modal di gestione visibile solo ad alcuni utenti, race condition asincrona risolta e Service Worker cache versioning.
Come ho passato l'identità dell'utente da PanelControl a un sito di onboarding su un Firebase separato — senza backend, usando HMAC-SHA256 con la Web Crypto API nativa del browser e un URL firmato con scadenza a 5 minuti.
Come ho integrato una tabella lead PayPOS nel pannello Admin leggendo Firebase RTDB — tre bug in sequenza: nodo sbagliato, chiavi di mapping errate e un ID dinamico con setTimeout che mostrava silenziosamente solo metà dei record.
Come ho costruito uno storico notifiche personale per ogni operatore — sei categorie filtrabili, 90 giorni di storico, Firestore per ferie/permessi e RTDB per chat e calendario. Con il problema del bootstrap al restore sessione.
Come ho costruito un calendario condiviso con notifiche push FCM e suono affidabile — e il bug nascosto nel flusso di auto-login che impediva a metà del team di ricevere qualsiasi avviso.
Come ho costruito una guida interna per navigare gli screenshot di un'app come se fosse il telefono reale — editor visuale di hotspot, macchina a stati, Firebase Storage auth-aware e glow blu pulsante.
Come ho aggiunto il supporto PDF, Word ed Excel in una chat web già funzionante con immagini e vocali — upload raw, bubble personalizzata e preview in lista.
// Snippet & Guide // Snippets & Guides
// Prossimamente
Patterns, ottimizzazioni e lezioni imparate costruendo applicazioni reali su Firebase — dal Realtime Database a Firestore.
Come trasformare un sito web in una Progressive Web App, con Service Worker, manifest e offline-first strategy.
Integrare Gemini AI e altri LLM nelle applicazioni web: chatbot, generazione contenuti e automazioni pratiche.
Serverless senza server: come usare le Netlify Functions per backend leggeri, webhook e integrazioni API sicure.
Costruire piattaforme e-commerce senza framework pesanti: pagamenti, gestione ordini e spedizioni con API esterne.
Schema.org, sitemap, Core Web Vitals e tutto quello che uno sviluppatore deve sapere per posizionarsi su Google.