↑ ↓ navigate↵ selectesc close

The Firebase plugin is now available in Codex: Web Architecture & Implementation Guide

CodingCat.dev tutorial cover image
Alex Patterson
Alex Patterson

If you have ever watched an AI coding agent hallucinate deprecated Firebase v8 syntax or deploy wide-open Firestore rules, you know that raw LLM prompts are not enough for production backends. Following the announcement of The Firebase plugin is now available in Codex by Sumit Chandel on the Official Firebase Blog (2026-09-28), 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. As agentic coding and collaboration matures, the Firebase team's goal is to ensure Firebase is available in all the new places you build. Earlier, the Firebase team integrated Firebase directly into Google AI Studio and in Antigravity 2.0. With this release, the Firebase team announced that the Firebase agent plugin is available in the Codex plugin directory.

The Mental Model: Why The Firebase plugin is now available in Codex 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? Instead of relying on stale training weights, wiring up the Model Context Protocol (MCP) and structured Firebase agent skills gives your IDE or CLI direct, schema-aware tools to provision resources, inspect security rules, and run deterministic CLI deployments.

AJ Pro-Tip from Alex: Never let an autonomous coding agent push Firestore or Data Connect rules straight to production without a gate. Always require the agent to run your test suite against the Firebase Local Emulator Suite first, and audit every generated rule for strict request.auth.uid ownership checks.

How It Works: Technical Breakdown & Implementation

When you build with Codex and have the Firebase plugin installed, Codex will be able to use:

Each of these tools and capabilities are available simply by installing the Firebase agent plugin for Codex.

What Codex can do with the Firebase plugin

Equipped with the Firebase plugin, Codex gets new abilities to help in your app development workflows with Firebase. For example, Codex is now able to:

  • Automatically provision a Firebase project and a database instance and schema through simple prompt-based instructions
  • Add Firebase Authentication to your app (usually by default) as Codex implements the best practices defined in Firebase agent skills
  • Secure your database by having Codex write starter Firebase Security Rules to define data access rules
  • Audit and validate your security rules once you’re ready to move to production and want to harden your security profile before deployment

In addition to the above, Codex gains access to many other capabilities through the combination of agent skills and tools available through the plugin.

Coding agents are often combined with agent skills and MCP servers to connect to external tools and services. The problem is that managing individual skills and tools, especially when you have many you’d like to use together, becomes cumbersome as coding agent platforms handle these integrations differently.

The agent plugin solves this by bundling skills and tools into a single place, making it seamless to use Firebase across coding agents like Codex.

Take it for a spin

Getting started with the Firebase plugin and building new features with it is easy. After installing the plugin from the Plugins directory in Codex, ask Codex to build your next great app idea and tell it to set up Firebase for that application.

Let’s go through the whole process step-by-step.

Open up a new or existing Codex project for creating your new app. Navigate to the Plugins section, search for “Firebase” and install the “Firebase” plugin.

Click the “Try now” button to preload a base prompt you can use to work with Firebase, “Set up Firebase in this app”. If you like, you can proceed with just this basic prompt, but you can make it more interesting by both building an app and setting up Firebase for that app at the same time.

For example, you can build a fitness app tracker that uses Firebase as its backend.

Because Codex has access to the Firebase plugin, Codex can use the Firebase agent skills and tools to help it build an app that uses Firebase in an efficient and Firebase-recommended way. Since Firebase will be the backend for this app, Codex will likely decide to load up the following skills to help it set up Firebase services and add the code to your app:

  • Firebase Basics, set up a Firebase project and configure your app to use Firebase
  • Firebase Auth Basics, set up Firebase Authentication for security and sign-in flows
  • Firebase Firestore, set up Firestore database for your app’s data

Codex can approach building your app in a few different ways. While it can wire up the frontend and backend all at once, it usually starts with the UI. It will scaffold the codebase with placeholder Firebase configurations and use in-memory state for local testing, letting you iterate on the design and user flow before provisioning a live Firebase project.

Codex will display a preview for your web application that you can play with in the local environment.

At some point in the app building process, Codex will ask you if you’d like to set up a functional backend for your app, that is, set up Firebase. And because you’ve installed the Firebase plugin, Codex can set up Firebase for you!

It may ask for a few pieces of information from you first, like if you have an existing Firebase project and which location you want your database created. But other than that, agent skills provide all the info and steps that Codex needs to set up everything for your app to use Firebase. And by following the guidance in the agent skills and using the Firebase CLI and Firebase MCP tools, Codex will configure Firebase using best practices, standard usage patterns, and security by default.

Codex will wire up your app’s codebase to use the Firebase SDKs, update your Firebase configurations, and even set up all the Firebase services in your Firebase project, too. It will configure Firebase Authentication so that your app can sign-in users. It will create a Firestore database to store and sync your app’s data. And most importantly, it will automatically write a starter set of Firebase Security Rules to keep your data secure.

If this is your first time using Firebase, Codex may need you to accept the Firebase terms & conditions. If this happens, just visit the Firebase console to accept the terms. Use a browser signed into your Google Account (like a Gmail account) and make sure it’s the same account Codex knows about. After accepting the terms, Codex will then continue with setting up Firebase for your app.

At any point, Codex lets you inspect the actual codebase of your app. For example, you can see the Firebase configuration for your app in the firebase.ts file.

You can also see your Firebase setup in the Firebase console. For example, you can check out your Firebase Authentication setup or your Firestore database structure and stored data.

Getting ready for production

Getting your app ready for production is the final step to getting your app idea out into the world. It’s also the step where having correct app security and app configurations can make all the difference between celebrating your launch versus dreading the negative customer impact.

To help with this, I strongly recommend following all of the steps in the Firebase launch checklist. This will help ensure you’re ready to launch your Firebase-powered app confidently into the world.

Fortunately, the Firebase agent plugin for Codex can also help you with a part of getting your app ready for production, auditing and hardening your Firebase Security Rules to protect data access.

Codex will likely have generated a sensible starter set of Firebase Security Rules for your application. You can view the security rules that Codex generated by navigating to your Firebase project in the Firebase console and going to Databases & Storage > Firestore > Rules.

For the example app above, Codex generated the following security rules:

rules_version 
service cloud.firestore {
  match 
    function
      return
    }
    function
      return
        &&
        &&
        &&
        &&
        &&
        &&
        &&
        &&
        &&
    }
    match 
      match 
        allow read: 
        allow create: 
        allow update: 
          &&
        allow delete: 
      }
    }
  }
}

At first glance, these security rules seem sensible and complete. There’s a function to ensure users are authenticated and have a valid user ID, and then Firestore collections rooted in that user ID and a matching check on that user ID to ensure access should be granted. There’s even some validation checks for workout data entered into Firestore.

You need to make sure nothing is missing though. Here is where Codex working with the Firebase agent plugin can help.

Here’s an example of what Codex may display as it’s utilizing the agent skills and tools in the plugin to audit your app’s security:

In this example, the Firebase plugin helped Codex find multiple issues and opportunities for improvement. Here’s a summary:

  • Storage abuse: There is no limit to how many documents a workout listener can read nor how many workouts a user can store, leading to potential storage, read, and write costs.
  • Authority source: The app correctly used user IDs to secure and authenticate access to data. However, this is currently based on anonymous authentication in Firebase Authentication, leading to the potential for orphaned data and loss of access.

The last one is actually a bigger issue than it might seem at first glance. The app is indeed storing and protecting access to workout data on a per-user basis; however, since the app is currently using anonymous authentication, users might inadvertently lose access to their data after the first time using the app.

The Firebase agent skills and tools in the plugin can even help Codex resolve these issues for you!

Codex should then offer an alternative. In this case, it implemented Google Sign-In and included a new flow in the app that requires users to convert from anonymous authentication to Google Sign-In authentication to ensure their workouts can be preserved.

If you check your Firebase project in the console and navigate to Security > Authentication, you should also now see that Google Sign-In has now been enabled as a sign-in method for authentication.

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 The Firebase plugin is now available in Codex 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 Security Rules: Effortless control over your app's data. below, and make sure to Subscribe to CodingCat.dev on YouTube for weekly full-stack web and AI deep dives:

Resources, Official Docs & Related CodingCat.dev Guides

Frequently Asked Questions (FAQ)

What are the key capabilities introduced in The Firebase plugin is now available in Codex?

The Firebase plugin is now available in Codex (announced 2026-09-28 by the Firebase team) enhances the platform for Firebase, Google Cloud, Web Dev, AI, MCP, Security workloads. As agentic coding and collaboration matures, the Firebase team's goal is to ensure Firebase is available in all the new places you build. Earlier, the Firebase team integrated Firebase directly into Google AI Studio and in Antigravity 2.0. With this release, the Firebase team announced that the Firebase agent plugin is available in the Codex plugin directory. Developers can review the primary announcement on the Firebase Blog alongside our implementation patterns and production checklist above.

How do web developers use The Firebase plugin is now available in Codex 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 Security Rules: Effortless control over your app's data., and follow us on X (@CodingCatDev) for weekly full-stack tutorials.