quickstart-js

Data Connect is now generally available! in Firebase: Web Architecture & Implementation Guide Original: codingcat.dev For years, choosing Firebase meant trading away relational SQL joins, strict foreign keys, and pgvector similarity search in favor of NoSQL document denormalization. Following the announcement of Data Connect is now generally available! by Andrea Wu on the Official Firebase Blog (2025-04-09), here is our hands-on CodingCat.dev breakdown of what actually shipped, how it works under the hood, and how we wire it into production TypeScript, Next.js, Astro, SvelteKit, React, and Angular applications. Note: Firebase Data Connect has been renamed to SQL Connect. Learn more in the SQL Connect announcement. The Mental Model: Why Data Connect is now generally available! Matters for Web Devs As a Google Developer Expert (GDE) for Firebase and Senior Solutions Engineer at CodingCat.dev, I evaluate every Firebase update through one lens: does it reduce boilerplate while keeping our runtime security and cloud bills predictable? Firebase Data Connect bridges that gap by pairing a managed Google Cloud SQL for PostgreSQL instance with a declarative GraphQL schema compiler that automatically generates type-safe TypeScript, React, and Angular SDKs alongside server-enforced @auth directives. > AJ Pro-Tip from Alex: Keep your authorization logic inside your Data Connect GraphQL operations using @auth(level: USER) and server-evaluated expressions like auth.uid and request.time rather than trusting client-supplied user IDs in query variables. How It Works: Technical Breakdown & Implementation Data Connect is a backend-as-a-service powered by a Cloud SQL Postgres database that’s high performance, scalable, and secure. You provide your app’s data model through a GraphQL-based schema, and Data Connect creates secure endpoints and typesafe SDKs to access your data. You’ll also define how to access and update data, and Data Connect does the rest for you - no need to define your own resolvers which is necessary in GraphQL services. You can build rich queries with relational joins, complex conditions, and even semantic vector search that are as secure as hand-coded server endpoints. Vector search and an integration with Vertex AI enables out-of-the-box RAG (retrieval augmented generation) flows. Also, just like the rest of the Firebase ecosystem, Data Connect is well-integrated with other Firebase services like Firebase Auth. the team has been hard at work creating additional features and in this blog post, we’ll cover a few of those below: - Gemini in Firebase for schema design in the Firebase console - Support for connecting to existing Cloud SQL databases - Newly supported web frameworks: Angular and React Gemini code assist Before, you could already use Gemini in Firebase to write queries and mutations for your app. Now, you can use it to write your schemas! Tell Gemini what you would like to build, and it writes the schemas for you. You can use this new feature in the Firebase console. More Query and Mutation Features When you have a lot of data, you might need to perform calculations on a list of results. Aggregate fields let you do so, and for each field in your type, Data Connect generates corresponding aggregate fields depending on the field type. Data Connect supports the following aggregations: - _count: returns the number of rows that match your query - All fields have a <field>_count field, which counts how many rows have a non-null value in that field - Numeric fields (int, float, int64) have <field>_min, <field>_max, <field>_sum, and <field>_avg - Date and timestamp fields have <field>_min and <field>_max. - distinct argument: get all unique values for a field (or combo of fields). You can also use distinct on aggregate fields to instead aggregate the distinct values. - Grouped aggregates: selecting a mix of aggregate and non-aggregate fields results in aggregate results grouped by the non-aggregate fields. where and having arguments return only groups that meet the provided criteria. where lets you filter rows based on non-aggregate fields and having lets you filter groups by aggregate fields. To learn more about aggregate fields and see examples, check out the documentation. To ensure data consistency and prevent race conditions - especially in collaborative or high-traffic applications, Data Connect now has atomic operations that let you manage counters, lists, and other data structures: - inc increments the field by the specified amount. - dec decrements the field by the specified amount. - prepend adds to the start of a list. To learn more about atomic data modifications and see examples, check out the documentation. Connect to Existing Cloud SQL Databases We know that you might already be using Cloud SQL databases. Now through the Firebase CLI, you can connect existing Cloud SQL databases to Data Connect. - give Data Connect control over the database to run migrations - connect in brownfield mode, in which you need to apply SQL changes yourself, then use the CLI to deploy the connector In both cases, you write the corresponding GraphQL schema and implement the operations for your connector. In other words, Data Connect doesn’t create GraphQL from your existing database. To learn more, check out the documentation. Angular and React Support As you design the schemas, queries, and mutations and deploy them to the Data Connect service, Data Connect automatically generates custom SDKs for you to use in your client logic. These SDKs let you call server-side queries and mutations directly from a Firebase app. Back in February, we announced support for React, letting you generate React SDKs for your projects with bindings powered by TanStack Query to integrate your GraphQL operations into your React-based apps. Now, The Firebase team announced support for Angular as well! You first need to install the dependencies, and then Data Connect will automatically generate Angular SDKs. You can then use these SDKs for queries and mutations in your Angular app. To learn more and see examples, check out the documentation. Try the new Android and iOS Codelabs With the Data Connect web codelab out there for web users, we definitely didn’t want to leave the fun out for our Android and iOS users! The Firebase team announced the new Android and iOS codelabs, designed to help you walk through implementation of a fully functioning mobile app using Data Connect. Pricing Updates With Data Connect now generally available, it will transition to its GA pricing structure. At a high level, Data Connect consists of two billable components: the Data Connect service itself and the PostgreSQL instance on Cloud SQL that contains your project data. The cost for the Data Connect service is: - no cost for network egress up to 10 GiB/month, and then it will follow Google Cloud Internet Data Transfer Rate Premium Tier pricing. There may be potential additional costs that you can read about in the documentation - but the good news is network egress is only charged once for data going out of your database - no cost for operations (queries and mutations) up to 250k operations per month, and then the cost is $4.00 per 1M operations The cost for the PostgreSQL instance on Cloud SQL is a no-cost trial for 3 months, then permanent costs as low as $9.37 per month that follows Google Cloud pricing. Additionally, if you use Data Connect for vector similarity search, you need to integrate Vertex AI’s Embeddings API. As such, there will be associated costs for embedding generation. To learn more, check out the documentation. Try out Data Connect! To learn more about Data Connect, here are some resources: - documentation (along with one-liner setup) - web, Android, iOS, Dart quickstarts to get a sample app up and running - web, Android, iOS codelabs with step-by-step walkthroughs and explanations to create a movie app - blog post series deep-diving into various Data Connect topics Show Me the Code: TypeScript & Web SDK Setup Here is the production baseline pattern we use at CodingCat.dev when wiring Data Connect is now generally available! into a modern TypeScript web application: # Firebase Data Connect Schema & Type-Safe Web Query type Project @table { id: UUID! @default(expr: "uuidV4()") title: String! ownerUid: String! @default(expr: "auth.uid") createdAt: Timestamp! @default(expr: "request.time") } query ListUserProjects @auth(level: USER) { projects(where: { ownerUid: { eq_expr: "auth.uid" } }, orderBy: [{ createdAt: DESC }]) { id title createdAt } } Production Web Architecture & Security Checklist Whether we are deploying on Firebase App Hosting, Cloudflare Workers, or Vercel, shipping AI features to production requires defense-in-depth across three layers: - Enforce Firebase App Check & Attestation: **Protect your web endpoints, Cloud Functions, Data Connect GraphQL resolvers, and Firebase AI Logic calls against unauthorized replay or billing abuse using Firebase App Check with reCAPTCHA Enterprise**. - **Validate Locally with the Firebase Emulator Suite: **Run deterministic integration tests against local Firestore, Auth, Functions, and Data Connect PostgreSQL emulators before promoting schema or rule changes to production. - **Keep Server & Client Boundaries Type-Safe: **Use the modular Firebase Web SDK and generated TypeScript bindings so SSR frameworks like Next.js, Astro, SvelteKit, and Angular serialize state cleanly without hydration flickers. Conclusion Accelerate your full-stack web and AI development by pairing Data Connect is now generally available! with strict Security Rules, Firebase App Check, and local emulator testing. Come tell us on X (@CodingCatDev) and LinkedIn (CodingCat.dev) how you are using Firebase in your stack, and subscribe to the CodingCat.dev YouTube Channel so you don't miss what we build next! Watch Our Related Firebase Video Tutorial on YouTube Want to see how we architect and debug Firebase web applications live? Watch our related CodingCat.dev session Firebase SQL with Data Connect below, and make sure to Subscribe to CodingCat.dev on YouTube for weekly full-stack web and AI deep dives: {% youtube N25khadfUag %} Resources, Official Docs & Related CodingCat.dev Guides - Primary Release Source: **Data Connect is now generally available! on the Official Firebase Blog (published 2025-04-09 by Andrea Wu) - **Official Firebase Documentation: **Firebase Developer Docs & Web SDK Reference - **Related on CodingCat.dev: What's new in Firebase at Cloud Next 2025 - Related on CodingCat.dev: Announcing Genkit for Python and Go - Related on CodingCat.dev: Firebase SQL with Data Connect - Related on CodingCat.dev: Build a Custom No-Code App in 90 Minutes Frequently Asked Questions (FAQ) What are the key capabilities introduced in Data Connect is now generally available!? Data Connect is now generally available! (announced 2025-04-09 by the Firebase team) enhances the platform for Firebase, Google Cloud, Web Dev, AI, SQL, React, Angular, TypeScript, Security workloads. Note: Firebase Data Connect has been renamed to SQL Connect. Learn more in the SQL Connect announcement. Developers can review the primary announcement on the Firebase Blog alongside our implementation patterns and production checklist above. How do web developers use Data Connect is now generally available! with Next.js, SvelteKit, React, or Angular? Web developers can integrate these features using the modular Firebase JavaScript/TypeScript SDK, Firebase Data Connect web bindings, and Firebase App Hosting. Always pair client-side SDK initialization with Firebase App Check and strict Security Rules, and test locally with the Firebase Local Emulator Suite before deploying. Where can I watch video tutorials on Firebase Web and AI development? You can watch our hands-on Firebase video walkthroughs on the CodingCat.dev YouTube Channel, including Firebase SQL with Data Connect, and follow us on X (@CodingCatDev) for weekly full-stack tutorials.

What the F*ck is Firebase Now? Original: codingcat.dev {% youtube xA3J_Q4cdYY %} ▶ Watch on YouTube & Subscribe to CodingCat.dev What is Firebase {% youtube xA3J_Q4cdYY %} How has it changed? The Firebase platform is currently shaped by three significant macro-trends that are critical for developers to understand. First, there is an aggressive pivot to generative AI, with Firebase rapidly reorienting its platform to become a premier environment for building, deploying, and managing AI-powered applications using Google's Gemini models. Second, the integration between Firebase and Google Cloud Platform (GCP) continues to deepen, positioning Firebase not as a standalone Backend-as-a-Service (BaaS) but as a sophisticated application development layer on top of GCP's powerful infrastructure. Finally, the Firebase web development stack has grown increasingly specialized, offering distinct solutions for simple static sites versus complex, full-stack modern frameworks, which requires developers to make important architectural decisions early in the development process. So that I can explain this craziness better I have organized this post according to Firebase's official product taxonomy: AI, Build, and Run. Each product entry includes a concise summary of its function and a detailed table of documentation links categorized by resource type and platform, providing a clear path to the most relevant information. AI The products in this section represent Firebase's primary strategic direction, comprising an emergent ecosystem of tools designed for building, deploying, and integrating AI-powered features. The collection of these tools include Firebase Studio for prototyping, AI Logic for client-side integration, and Genkit for backend workflows. This indicates a deliberate strategy by Google to create a fully integrated, end-to-end AI application development environment under the Firebase brand. This ecosystem is designed to abstract away the complexity of underlying models like Gemini and the associated infrastructure, creating a guided path for developers to build production-ready AI applications entirely within the Firebase and Google Cloud ecosystem. On this one, they are not f*cking around!! Firebase AI Logic client SDKs Firebase AI Logic, formerly known as "Vertex AI in Firebase" which Vertex is now an API that is enterprise grade (yeah stick with me here), provides client-side SDKs in JavaScript, Kotlin, Swift, and Dart for directly calling Google's Gemini and Imagen models from a web or mobile application. A key component is a proxy service that enhances security by preventing API keys from being exposed on the client. This service also integrates with Firebase App Check for robust abuse prevention, ensuring that API access is restricted to legitimate app instances. { "_key": "326bd5bc3723", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazHDy", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazHHi", "_type": "row", "cells": [ "Product Overview", "Official product page detailing key capabilities and use cases.", "[firebase.google.com/docs/ai-logic](https://firebase.google.com/docs/ai-logic)" ] }, { "_key": "wABm3EtmLeHn8SOsyazHLS", "_type": "row", "cells": [ "Get Started Guide", "Step-by-step instructions for setting up the SDK on all supported platforms.", "[firebase.google.com/docs/ai-logic/get-started](https://firebase.google.com/docs/ai-logic/get-started)" ] }, { "_key": "wABm3EtmLeHn8SOsyazHPC", "_type": "row", "cells": [ "Web SDK Generation", "Guide on generating type-safe web SDKs for Data Connect, relevant for AI data management.", "[firebase.google.com/docs/data-connect/web-sdk](https://firebase.google.com/docs/data-connect/web-sdk)" ] }, { "_key": "wABm3EtmLeHn8SOsyazHSw", "_type": "row", "cells": [ "App Check Integration", "Documentation for securing AI Logic APIs using App Check on the web.", "[firebase.google.com/docs/app-check/web/recaptcha-enterprise-provider](https://firebase.google.com/docs/app-check/web/recaptcha-enterprise-provider)" ] } ] } Genkit Genkit is an open-source, full-stack framework for building production grade, AI powered applications. It offers a unified interface for a variety of AI models, not limited to Google's, and features composable workflows for creating complex, agentic logic. It includes production ready tools, such as a developer UI for debugging and tracing. Genkit flows can be deployed to multiple environments, including Firebase, Cloud Run, or custom infrastructure. The primary documentation for Genkit has moved to its own dedicated website. { "_key": "e30b9a22e4b7", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazHWg", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazHaQ", "_type": "row", "cells": [ "Official Website", "The new home for Genkit, with overviews, examples, and getting-started guides.", "[genkit.dev](https://genkit.dev/)" ] }, { "_key": "wABm3EtmLeHn8SOsyazHeA", "_type": "row", "cells": [ "Firebase Overview", "The Firebase documentation page for Genkit, linking to the new official site.", "[firebase.google.com/docs/genkit/overview](https://firebase.google.com/docs/genkit/overview)" ] } ] } Firebase ML Firebase ML is a service focused on deploying custom TensorFlow Lite models for on-device inference. This enables machine learning capabilities that are fast and can function offline, directly on a user's device. It is distinct from the newer AI Logic SDKs, which are designed for calling cloud-hosted generative AI models. Many of the original ready-to-use APIs for common mobile use cases (like text recognition and image labeling) are now part of the standalone ML Kit SDK but remain accessible through Firebase. Something I didn't add here, but probably should is there is now the ability to run models using on device inference. { "_key": "69a2d2bc3020", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazHhu", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazHle", "_type": "row", "cells": [ "Product Overview", "Official product page detailing on-device model deployment and capabilities.", "[firebase.google.com/docs/ml](https://firebase.google.com/docs/ml)" ] } ] } Firebase Studio Firebase Studio is a browser-based, full-stack AI workspace designed to accelerate the entire development lifecycle. It provides an AI-powered collaborative environment with Gemini integrated for assistance in coding, debugging, and testing. The studio includes built-in web previews and Android emulators for end-to-end testing and facilitates one-click deployment to Firebase App Hosting or Cloud Run, enabling rapid prototyping and shipping of AI-infused applications. I can't seem to jump fully on board with this yet. I find the VM is too slow and only allowing Next.js and not Flutter seems like a real drag to me. Cool for a quick vibe coding app, but not for prime time yet. { "_key": "be2efff7acdf", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazHpO", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazHt8", "_type": "row", "cells": [ "Product Homepage", "The main product page with an overview of features and access to the workspace.", "[firebase.studio](https://firebase.studio/)" ] } ] } Build This section covers the foundational services for application development, data management, security, and deployment. The evolution of these products illustrates a clear and accelerating trend of migrating from Firebase specific, proprietary backends to standardized, powerful Google Cloud services. This progression is evident in the database offerings, moving from the original Realtime Database to the GCP-native Cloud Firestore, and now to Data Connect, which provides direct access to Cloud SQL (PostgreSQL). A similar pattern is seen in hosting, where the original static hosting is now complemented by App Hosting, a managed layer over Google Cloud Build and Cloud Run. This "Cloudification" offers developers immense scalability and power but also introduces the complexities of GCP, such as its billing, IAM, and console, into the Firebase ecosystem which can be a real drag when comparing with Vercel. However I do like the idea of being able to get super granular when I need more power across the apps. At some point I think the AWS Amplify version of these things will arise where you can add to the builds and have true IaC power. Databases and Data Synchronization Cloud Firestore Cloud Firestore is a highly scalable NoSQL document database designed for mobile, web, and server development. It features real-time data synchronization via listeners, comprehensive offline support for building resilient applications, and an expressive querying API. Recent enhancements have introduced vector search capabilities to support generative AI use cases and MongoDB API compatibility, allowing developers to leverage existing MongoDB tools and drivers with Firestore's serverless architecture. {% youtube hxL2YOxzP9M %} { "_key": "ece640ceec62", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazHws", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazI0c", "_type": "row", "cells": [ "Product Overview", "Official product page for Cloud Firestore.", "[cloud.google.com/products/firestore](https://cloud.google.com/products/firestore)" ] }, { "_key": "wABm3EtmLeHn8SOsyazI4M", "_type": "row", "cells": [ "Native Mode Docs", "Detailed documentation for using Firestore in its native mode.", "[cloud.google.com/firestore/native/docs](https://cloud.google.com/firestore/native/docs)" ] }, { "_key": "wABm3EtmLeHn8SOsyazI86", "_type": "row", "cells": [ "Get Started (Web)", "A guide for integrating Cloud Firestore into a web application.", "[firebase.google.com/docs/firestore/quickstart](https://firebase.google.com/docs/firestore/quickstart)" ] }, { "_key": "wABm3EtmLeHn8SOsyazIBq", "_type": "row", "cells": [ "Gen AI Features", "Documentation on using Firestore's vector search for generative AI applications.", "[firebase.google.com/docs/firestore/solutions/generative-ai-index](https://firebase.google.com/docs/firestore/solutions/generative-ai-index)" ] }, { "_key": "wABm3EtmLeHn8SOsyazIFa", "_type": "row", "cells": [ "MongoDB Compatibility", "Information on using the MongoDB API with Firestore.", "[cloud.google.com/firestore/mongodb-compatibility/docs/overview](https://cloud.google.com/firestore/mongodb-compatibility/docs/overview)" ] } ] } Realtime Database The original Firebase database, Realtime Database is a cloud-hosted NoSQL database that stores data as a single large JSON tree. Its primary strength is its ability to synchronize data in real-time to every connected client with extremely low latency, making it well-suited for applications that require shared state management, such as collaborative tools or simple multiplayer games. { "_key": "d384f89a4226", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazIJK", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazIN4", "_type": "row", "cells": [ "Product Overview", "Official product page detailing key capabilities.", "[firebase.google.com/docs/database](https://firebase.google.com/docs/database)" ] }, { "_key": "wABm3EtmLeHn8SOsyazIQo", "_type": "row", "cells": [ "Get Started (Web)", "Guide for integrating the Realtime Database into a web application.", "[firebase.google.com/docs/database/web/start](https://firebase.google.com/docs/database/web/start)" ] }, { "_key": "wABm3EtmLeHn8SOsyazIUY", "_type": "row", "cells": [ "Android Guide", "Unofficial but detailed guide for Android implementation.", "[android-app-development-documentation.readthedocs.io/en/latest/firebase.html](https://android-app-development-documentation.readthedocs.io/en/latest/firebase.html)" ] } ] } Data Connect Data Connect is a modern service that bridges Firebase applications with a PostgreSQL database hosted in Cloud SQL, managed via GraphQL technology. A key feature is its ability to automatically generate type-safe client SDKs from a defined schema, which simplifies the process of interacting with relational data structures and provides AI assistance for generating queries and mutations. I sat down with Tyler Crowe from Google to cover this in much greater detail in the below video. {% youtube N25khadfUag %} { "_key": "5dfb6f0fc7db", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazIYI", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazIc2", "_type": "row", "cells": [ "Product Overview", "Official product page for Data Connect.", "[firebase.google.com/docs/data-connect](https://firebase.google.com/docs/data-connect)" ] }, { "_key": "wABm3EtmLeHn8SOsyazIfm", "_type": "row", "cells": [ "Web Codelab", "A hands-on tutorial for using Data Connect in a web application.", "[firebase.google.com/codelabs/firebase-dataconnect-web](https://firebase.google.com/codelabs/firebase-dataconnect-web)" ] } ] } Hosting and Deployment App Hosting App Hosting is a full-stack web hosting solution specifically designed for modern web frameworks like Next.js and Angular. It integrates directly with GitHub for automated, continuous deployment triggered by git commits. The service is built on Google Cloud's scalable infrastructure, leveraging Cloud Build and Cloud Run to provide a managed, production-grade environment. { "_key": "60a4f7da62d9", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazIjW", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazInG", "_type": "row", "cells": [ "Product Overview", "Official product page detailing features and framework support.", "[firebase.google.com/docs/app-hosting](https://firebase.google.com/docs/app-hosting)" ] }, { "_key": "wABm3EtmLeHn8SOsyazIr0", "_type": "row", "cells": [ "Get Started Guide", "Step-by-step instructions for deploying an app with App Hosting.", "[firebase.google.com/docs/app-hosting/get-started](https://firebase.google.com/docs/app-hosting/get-started)" ] }, { "_key": "wABm3EtmLeHn8SOsyazIuk", "_type": "row", "cells": [ "Emulator Guide", "Documentation on using the App Hosting emulator for local development.", "[firebase.google.com/docs/emulator-suite/use_app_hosting](https://firebase.google.com/docs/emulator-suite/use_app_hosting)" ] } ] } Hosting Firebase Hosting provides production-grade hosting for static web content, single-page applications, and through integrations with Cloud Functions or Cloud Run for dynamic content. Key features include a global Content Delivery Network (CDN) for fast content delivery, zero-configuration SSL for security, and simple one-click rollbacks for deployments. { "_key": "58026a850ee4", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazIyU", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazJ2E", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase Hosting.", "[firebase.google.com/docs/hosting](https://firebase.google.com/docs/hosting)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJ5y", "_type": "row", "cells": [ "Get Started Guide", "Instructions for setting up and deploying a site with the Firebase CLI.", "[firebase.google.com/docs/hosting/quickstart](https://firebase.google.com/docs/hosting/quickstart)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJ9i", "_type": "row", "cells": [ "Custom Domains", "Guide for connecting a custom domain to a hosted site.", "[firebase.google.com/docs/hosting/custom-domain](https://firebase.google.com/docs/hosting/custom-domain)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJDS", "_type": "row", "cells": [ "GitHub Integration", "Documentation on setting up continuous deployment with GitHub Actions.", "[firebase.google.com/docs/hosting/github-integration](https://firebase.google.com/docs/hosting/github-integration)" ] } ] } Authentication and Security Authentication Firebase Authentication provides a complete suite of backend services, easy-to-use SDKs, and ready-made UI libraries (FirebaseUI) to handle user authentication. Just a little update I have confirmation that v7 will fix all the problems that we have with it today! It supports a wide array of providers, including traditional email/password and phone number sign-in, as well as federated identity providers like Google, Facebook, and Twitter. {% youtube i6sF3rNO85U %} { "_key": "88d9b4d406f9", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazJHC", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazJKw", "_type": "row", "cells": [ "Product Overview", "Official product page detailing supported providers and features.", "[firebase.google.com/docs/auth](https://firebase.google.com/docs/auth)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJOg", "_type": "row", "cells": [ "Get Started (Web)", "Guide for adding authentication to a web application.", "[firebase.google.com/docs/auth/web/start](https://firebase.google.com/docs/auth/web/start)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJSQ", "_type": "row", "cells": [ "FirebaseUI (Web)", "Documentation for the pre-built, customizable sign-in UI library.", "[firebase.google.com/docs/auth/web/firebaseui](https://firebase.google.com/docs/auth/web/firebaseui)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJWA", "_type": "row", "cells": [ "React Native Firebase", "Essential third-party documentation for using Firebase Auth with React Native.", "[rnfirebase.io/auth/usage](https://rnfirebase.io/auth/usage)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJZu", "_type": "row", "cells": [ "Expo Guide", "Official Expo documentation for using Firebase Auth (JS SDK and React Native Firebase).", "[docs.expo.dev/guides/using-firebase/#authentication](https://docs.expo.dev/guides/using-firebase/#authentication)" ] } ] } App Check Firebase App Check is a security service that protects backend resources from abuse, such as billing fraud or phishing, by attesting that incoming traffic originates from a legitimate, untampered instance of an application. For web applications, it leverages Google's reCAPTCHA Enterprise or reCAPTCHA v3 to validate requests. { "_key": "bab4aeb71602", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazJde", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazJhO", "_type": "row", "cells": [ "Product Overview", "Official product page explaining how App Check protects backend resources.", "[firebase.google.com/docs/app-check](https://firebase.google.com/docs/app-check)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJl8", "_type": "row", "cells": [ "Web (reCAPTCHA v3)", "Guide for setting up App Check on the web using the reCAPTCHA v3 provider.", "[firebase.google.com/docs/app-check/web/recaptcha-provider](https://firebase.google.com/docs/app-check/web/recaptcha-provider)" ] } ] } Backend Logic and Storage Cloud Functions Cloud Functions for Firebase is a serverless framework that enables developers to run backend code automatically in response to events triggered by Firebase features (like a new document in Firestore, new upload in Storage) and HTTPS requests. It completely abstracts away server management and scales computing resources automatically based on usage. { "_key": "fdb10de1c564", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazJos", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazJsc", "_type": "row", "cells": [ "Product Overview", "Official product page for Cloud Functions for Firebase.", "[firebase.google.com/docs/functions](https://firebase.google.com/docs/functions)" ] }, { "_key": "wABm3EtmLeHn8SOsyazJwM", "_type": "row", "cells": [ "Get Started Guide", "Instructions for writing and deploying your first function.", "[firebase.google.com/docs/functions/get-started](https://firebase.google.com/docs/functions/get-started)" ] } ] } Cloud Storage Cloud Storage for Firebase provides secure file uploads and downloads for user-generated content such as photos and videos. The client SDKs are designed for robustness, gracefully handling poor network conditions by automatically resuming interrupted operations, which saves user time and bandwidth. {% youtube x_tlNaV6JHU %} { "_key": "1523381615ee", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazK06", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazK3q", "_type": "row", "cells": [ "Product Overview", "Official product page detailing features for storing and serving user content.", "[firebase.google.com/docs/storage](https://firebase.google.com/docs/storage)" ] }, { "_key": "wABm3EtmLeHn8SOsyazK7a", "_type": "row", "cells": [ "Get Started (Web)", "Detailed guide for integrating Cloud Storage into a web application.", "[firebase.google.com/docs/storage/web/start](https://firebase.google.com/docs/storage/web/start)" ] }, { "_key": "wABm3EtmLeHn8SOsyazKBK", "_type": "row", "cells": [ "Web Quickstart", "A sample GitHub repository demonstrating file uploads on the web.", "[github.com/firebase/quickstart-js/tree/master/storage](https://github.com/firebase/quickstart-js/tree/master/storage)" ] } ] } Run Products This section details the suite of tools for monitoring application health, understanding user behavior, and driving engagement post-launch. Google Analytics is not merely another product in this category; it serves as the central nervous system for the entire "Run" suite. It provides the foundational data layer upon which nearly every other product depends for targeting, segmentation, and measurement. For instance, A/B Testing relies on Analytics audiences for targeting and events for goal measurement. Remote Config can serve different values to specific Analytics audiences. Cloud Messaging and In-App Messaging use Analytics for campaign reporting and audience targeting , while Crashlytics integrates with it to link crash data with user behavior. This deep dependency means that a robust Google Analytics implementation is a foundational requirement for effectively leveraging Firebase's growth and optimization tools. Stability and Performance Crashlytics I usually leave Crashlytics out of my my posts, but with a lot of React devs now using React Native often, I had to keep it here. Firebase Crashlytics is a real-time crash reporter that helps developers track, prioritize, and fix stability issues. It intelligently groups a high volume of crashes into a manageable list of issues, provides contextual insights to aid in debugging, and integrates with Google Analytics to correlate crash events with specific user behaviors or segments. { "_key": "cb682f4eecc8", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazKXm", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazKbW", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase Crashlytics.", "[firebase.google.com/docs/crashlytics](https://firebase.google.com/docs/crashlytics)" ] }, { "_key": "wABm3EtmLeHn8SOsyazKfG", "_type": "row", "cells": [ "Get Started Guide", "Instructions for adding Crashlytics to your application.", "[firebase.google.com/docs/crashlytics/get-started](https://firebase.google.com/docs/crashlytics/get-started)" ] }, { "_key": "ec4d4820-f064-432e-add2-6989d76dc33f", "_type": "tableRow", "cells": [ "React Native", "How to use React Native and Firebase", "[rnfirebase.io/crashlytics/usage](https://rnfirebase.io/crashlytics/usage)" ] } ] } Performance Monitoring Firebase Performance Monitoring gathers and presents data on the performance characteristics of an application. For web apps, it automatically measures critical metrics like first contentful paint and page load times, in addition to monitoring HTTP network requests. It also allows for the creation of custom traces to monitor the performance of specific code paths within an application. { "_key": "476c40a19859", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazKj0", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazKmk", "_type": "row", "cells": [ "Product Overview", "Official product page for Performance Monitoring.", "[firebase.google.com/docs/perf-mon](https://firebase.google.com/docs/perf-mon)" ] }, { "_key": "wABm3EtmLeHn8SOsyazKqU", "_type": "row", "cells": [ "Get Started (Web)", "Guide for integrating Performance Monitoring into a web application.", "[firebase.google.com/docs/perf-mon/get-started-web](https://firebase.google.com/docs/perf-mon/get-started-web)" ] } ] } Test Lab Firebase Test Lab is a cloud-based app testing infrastructure that allows developers to test their application on a wide range of physical and virtual devices and configurations, helping to identify issues before release. This has been a life saver when messing with React Native as well! { "_key": "96648ddae2a0", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazKuE", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazKxy", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase Test Lab.", "[firebase.google.com/docs/test-lab](https://firebase.google.com/docs/test-lab)" ] } ] } Analytics and User Insight Google Analytics Google Analytics for Firebase is an unlimited, free app measurement solution that provides deep insight into app usage and user engagement. It automatically captures a rich set of events and user properties and allows for the creation of custom audiences that can be used for targeting across other Firebase products like Remote Config and Cloud Messaging. { "_key": "1efded1dd5fe", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazL1i", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazL5S", "_type": "row", "cells": [ "Product Overview", "Official product page for Google Analytics for Firebase.", "[firebase.google.com/docs/analytics](https://firebase.google.com/docs/analytics)" ] }, { "_key": "wABm3EtmLeHn8SOsyazL9C", "_type": "row", "cells": [ "Get Started (Web)", "Detailed guide for adding Google Analytics to a web application.", "[firebase.google.com/docs/analytics/get-started?platform=web](https://firebase.google.com/docs/analytics/get-started?platform=web)" ] }, { "_key": "wABm3EtmLeHn8SOsyazLCw", "_type": "row", "cells": [ "BigQuery Export", "Instructions for linking Analytics data to BigQuery for advanced analysis.", "[support.google.com/firebase/answer/6318765](https://support.google.com/firebase/answer/6318765)" ] } ] } User Engagement and Growth A/B Testing Firebase A/B Testing is a tool for running experiments to test changes to an app's UI, features, or engagement campaigns. It integrates tightly with Remote Config, Cloud Messaging, and In-App Messaging to test different variants and measures their impact on a primary goal metric, which is typically a Google Analytics event. { "_key": "da3eda2152ef", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazLGg", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazLKQ", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase A/B Testing.", "[firebase.google.com/docs/ab-testing](https://firebase.google.com/docs/ab-testing)" ] }, { "_key": "wABm3EtmLeHn8SOsyazLOA", "_type": "row", "cells": [ "Remote Config Experiments", "Guide for creating experiments that test Remote Config parameter values.", "[firebase.google.com/docs/ab-testing/abtest-config](https://firebase.google.com/docs/ab-testing/abtest-config)" ] }, { "_key": "wABm3EtmLeHn8SOsyazLRu", "_type": "row", "cells": [ "Messaging Experiments", "Guide for creating experiments that test Cloud Messaging notifications.", "[firebase.google.com/docs/ab-testing/abtest-with-console](https://firebase.google.com/docs/ab-testing/abtest-with-console)" ] } ] } Cloud Messaging (FCM) Firebase Cloud Messaging (FCM) is a cross-platform messaging solution that enables the reliable sending of notifications and data messages to single devices, groups of devices, or users subscribed to specific topics. { "_key": "77a5106c83bc", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazLVe", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazLZO", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase Cloud Messaging.", "[firebase.google.com/docs/cloud-messaging](https://firebase.google.com/docs/cloud-messaging)" ] }, { "_key": "wABm3EtmLeHn8SOsyazLd8", "_type": "row", "cells": [ "Add Firebase to Web App", "The foundational setup guide for using any Firebase service, including FCM, on the web.", "[firebase.google.com/docs/web/setup](https://firebase.google.com/docs/web/setup)" ] } ] } In-App Messaging Firebase In-App Messaging engages active app users with targeted, contextual messages, such as cards, banners, and modals. It uses Google Analytics to trigger these messages based on specific user behaviors, demographics, or events, making them highly relevant. { "_key": "e776cf84a665", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazLgs", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazLkc", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase In-App Messaging.", "[firebase.google.com/docs/in-app-messaging](https://firebase.google.com/docs/in-app-messaging)" ] }, { "_key": "wABm3EtmLeHn8SOsyazLoM", "_type": "row", "cells": [ "Compose a Campaign", "Guide for creating and customizing an in-app messaging campaign.", "[firebase.google.com/docs/in-app-messaging/compose-campaign](https://firebase.google.com/docs/in-app-messaging/compose-campaign)" ] } ] } Remote Config Firebase Remote Config allows developers to change the behavior and appearance of their application remotely without requiring users to download an update. It uses parameters and conditions, which can be targeted to specific Google Analytics audiences, to serve different values to different user segments and supports gradual feature rollouts. You can also use server side remote config { "_key": "e0201dffeab1", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazLs6", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazLvq", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase Remote Config.", "[firebase.google.com/docs/remote-config](https://firebase.google.com/docs/remote-config)" ] }, { "_key": "wABm3EtmLeHn8SOsyazLza", "_type": "row", "cells": [ "Get Started (Web)", "Guide for integrating Remote Config into a web application.", "[firebase.google.com/docs/remote-config/get-started?platform=web](https://firebase.google.com/docs/remote-config/get-started?platform=web)" ] }, { "_key": "6050c4dd-e724-42fb-94d5-5ce4e84ae392", "_type": "tableRow", "cells": [ "AI", "Remote Config for AI", "[firebase.google.com/docs/remote-config/solution-server](https://firebase.google.com/docs/remote-config/solution-server)" ] } ] } App Distribution Firebase App Distribution is a tool for distributing pre-release versions of an application to trusted testers. It simplifies the beta testing process by providing tester management, feedback collection capabilities, and integrations with CI/CD workflows for automated builds. { "_key": "1d14566319f1", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazM3K", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazM74", "_type": "row", "cells": [ "Product Overview", "Official product page for Firebase App Distribution.", "[firebase.google.com/docs/app-distribution](https://firebase.google.com/docs/app-distribution)" ] }, { "_key": "wABm3EtmLeHn8SOsyazMAo", "_type": "row", "cells": [ "Distribute iOS (Console)", "Guide for distributing iOS apps to testers using the Firebase console.", "[firebase.google.com/docs/app-distribution/ios/distribute-console](https://firebase.google.com/docs/app-distribution/ios/distribute-console)" ] }, { "_key": "wABm3EtmLeHn8SOsyazMEY", "_type": "row", "cells": [ "Distribute Android (Console)", "Guide for distributing Android apps to testers using the Firebase console.", "[firebase.google.com/docs/app-distribution/android/distribute-console](https://firebase.google.com/docs/app-distribution/android/distribute-console)" ] }, { "_key": "a60104b3-8c5e-48b0-b40c-1514b664bba0", "_type": "tableRow", "cells": [ "React Native", "Guide for distributing React Native Firebase", "[rnfirebase.io/app-distribution/usage](https://rnfirebase.io/app-distribution/usage)" ] } ] } Monetization and Acquisition Google AdMob Google AdMob is a platform for monetizing mobile applications through in-app advertising. It integrates with Firebase and Google Analytics to provide rich user metrics that can inform a developer's monetization strategy and improve user experience. { "_key": "e10c40014229", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazMTW", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazMXG", "_type": "row", "cells": [ "Product Overview", "Official product page for using Google AdMob with Firebase.", "[firebase.google.com/docs/admob](https://firebase.google.com/docs/admob)" ] }, { "_key": "wABm3EtmLeHn8SOsyazMb0", "_type": "row", "cells": [ "Link AdMob to Firebase", "Support document on how to link an AdMob app to a Firebase project.", "[support.google.com/admob/answer/6383165](https://support.google.com/admob/answer/6383165)" ] } ] } Google Ads Google Ads allows developers to run targeted ad campaigns to drive app installs and conversions. The integration with Firebase is crucial, as it leverages Google Analytics audiences created in Firebase for precise ad targeting and campaign measurement. { "_key": "259ee3494b1a", "_type": "table", "rows": [ { "_key": "wABm3EtmLeHn8SOsyazMek", "_type": "row", "cells": [ "Resource Type", "Description", "Link" ] }, { "_key": "wABm3EtmLeHn8SOsyazMiU", "_type": "row", "cells": [ "Product Overview", "Official product page for using Google Ads with Firebase.", "[firebase.google.com/docs/ads](https://firebase.google.com/docs/ads)" ] } ] } What's Next I really think that Firebase is finally getting the attention it deserves again because of all the AI money flowing towards it. I would still like products like GenKit to sit fully within the Firebase docs as I know when these things move out they will be killed off or not maintained in the future. Firebase has a lot of old code and SDKs floating around that need updated and cleaned up to get on par with other services. They unfortunately don't have the team at Google that they deserve. I am happy that items for Authentication are being looked at, but the focus for the near future will remain on AI. I hope to see something similar to the OpenAI Apps SDK for Gemini, but at least we have Gems for now. Resources, Links & Official Documentation - Firebase Documentation: Firestore, Data Connect, Authentication, App Check, and Cloud Functions - Google Cloud Architecture & Docs: Cloud Run, Kubernetes Engine, BigQuery, and Vertex AI guides - Google AI for Developers Documentation: Multimodal models, structured outputs, tool calling, and agentic workflows Related CodingCat.dev Tutorials & Podcast Episodes - Data Connect is now generally available! in Firebase: Web Architecture & Implementation Guide: Hands-on web engineering breakdown of "Data Connect is now generally available!" (2025-04-09). Learn how to integrate Firebase, Google Cloud, Web Dev, AI in pro... - What’s new from Firebase at Cloud Next 2026: Web Architecture & Implementation Guide: Hands-on web engineering breakdown of "What’s new from Firebase at Cloud Next 2026" (2026-04-22). Learn how to integrate Firebase, Google Cloud, Web Dev, AI in ... - Fueld.AI's nutrition coach with Firebase and Google Cloud: Web Architecture & Implementation Guide: Hands-on web engineering breakdown of "Fueld.AI's nutrition coach with Firebase and Google Cloud" (2025-06-25). Learn how to integrate Firebase, Google Cloud, W... Frequently Asked Questions (FAQ) What are the main takeaways from What the F*ck is Firebase Now?? The Firebase platform is evolving with a focus on generative AI, deeper integration with Google Cloud, and enhanced web development capabilities, requiring developers to navigate a complex yet powerful ecosystem. What the F*ck is Firebase Now? explores practical patterns for Firebase, Google Cloud, AI in modern software engineering. Throughout this post, Alex Patterson breaks down real-world implementation details for Firebase, Google Cloud, AI so developers can apply these patterns directly in production. How do you implement Firebase best practices in production? When adopting Firebase and Google Cloud in a production stack, start by validating your configuration against the Firebase Documentation (Firestore, Data Connect, Authentication, App Check, and Cloud Functions). Focus on incremental adoption, automated testing, and observability so your team can measure performance and developer velocity improvements at each stage. Where can I watch the full What the F*ck is Firebase Now? walkthrough and find related code resources? You can explore the complete write-up and code examples right here on CodingCat.dev, and subscribe to the CodingCat.dev YouTube channel for weekly video tutorials. For a deeper dive into Firebase, check out our related guide: Data Connect is now generally available! in Firebase: Web Architecture & Implementation Guide.