Streamline your Firebase setup for web apps by using AI-powered development tools such as Antigravity, Claude Code, Codex, and Cursor. By using **Firebase agent skills** together with the **Firebase CLI** and **Firebase MCP server** , you can transform your AI coding agent into a specialized Firebase expert that can write code, configure Firebase Security Rules, and manage live resources. This guide covers using an AI coding agent to help set up Cloud Firestore, Firebase Authentication, and Firebase Hosting for a **web app**. Check back soon for information about iOS, Android, and Flutter apps! ## Why use Firebase agent skills and tools? AI coding agents often struggle with specific project configurations or outdated information. This toolkit bridges that gap by combining specialized instructions (agent skills) with two complementary types of agent execution tools (CLI and MCP server): - [**Firebase agent skills**](https://firebase.google.com/docs/ai-assistance/agent-skills.md.txt): Provide the coding agent with **domain expertise and workflows** . As the instruction layer, skills guide the agent on best practices for working with Firebase, including writing code. Skills also teach the agent *when* and *how* to use the Firebase CLI and the Firebase MCP server. - **Agent execution tools** : - **[Firebase CLI](https://firebase.google.com/docs/cli.md.txt) (command-line tools)** : Provides tools for **project lifecycle and environment tasks**. The agent can run CLI commands in a terminal environment to set up services in a Firebase project, deploy full sites or backend resources, start local emulators, and more. - **[Firebase MCP server](https://firebase.google.com/docs/ai-assistance/mcp-server.md.txt) (programmatic tools and resources)** : Provides tools for **real-time inspection and data operations** . Through structured tool calls, the agent can programmatically query and update Cloud Firestore documents, manage Firebase Authentication users, validate Security Rules, pull live logs or documentation directly into context, and more. Using Firebase agent skills alongside the Firebase CLI and the Firebase MCP server gives your AI coding agent additional abilities: - **Take action** : Do more than just write code. Your agent can initialize services, manage Firebase Authentication users, deploy new Firebase Security Rules, and work directly with your Cloud Firestore data. - **Stay up-to-date**: Use official, version-aware prompts to guide your agent through setup tasks. - **Improve accuracy**: Access your project's environment and schemas to provide more relevant and accurate help. - **Reduce token costs**: Agent skills load detailed documentation only when a specific task requires it, which minimizes session overhead. ## Applicable Firebase services This guide focuses primarily on how agent skills, the Firebase CLI, and the Firebase MCP server work together to help you quickly set up these services and features: - **Cloud Firestore**: Provision a NoSQL database. - **Firebase Authentication**: Set up secure user sign-in. - **Firebase Security Rules** : Generate and refine Security Rules for your app. - **Firebase Hosting**: Set up your project for static web app deployment. For a complete list of what's available, browse the [complete list of Firebase agent skills](https://firebase.google.com/docs/ai-assistance/agent-skills.md.txt#available-skills). ## General workflow The following steps describe a *generalized* workflow for how to use Firebase agent skills to set up and use Firebase services in a **web app** . Behind the scenes, agent skills are using the Firebase CLI and the Firebase MCP server to complete these tasks. ### **Step 1**: Install Firebase agent skills In most cases, you can install Firebase agent skills in your preferred editor with a single prompt: ### Antigravity - **Option 1: Global-level access** Firebase agent skills are included in the **Firebase** plugin in the [Antigravity Marketplace](https://antigravity.google/docs/marketplace) (and as a **Build with Google** integration bundle). Install the plugin using any of the following options: - From the Antigravity Marketplace: Click **Customizations** , select the **Marketplace** tab, and then click **+** on the **Firebase** plugin card. - In Antigravity CLI: Run `/plugin install firebase@agent-marketplace` (or run `/plugin` and install **Firebase** from the **Discover** tab). Plugins installed in Antigravity also sync automatically to Antigravity CLI. - During onboarding: Select the checkbox for the Firebase stack. - **Option 2: Project-level access** Run the following command in your project's directory: ```bash npx skills add firebase/agent-skills --agent=antigravity ``` ### Claude Code Run the following commands in your terminal: ```bash claude plugin marketplace add firebase/agent-skills claude plugin install firebase@firebase ``` ### Codex - **Option 1: Codex terminal** Run the following commands in your terminal: ```bash codex plugin marketplace add firebase/agent-skills codex plugin add firebase@firebase ``` - **Option 2: Codex app** 1. Complete the following tasks one time: 1. Register through the terminal: ```bash codex plugin marketplace add firebase/agent-skills ``` 2. Fully restart the Codex app. 3. Open **Plugins**. 4. Select the Firebase marketplace/source. 5. Open **Firebase** and click **+ Install**. 2. Start a new task. 3. Type `@Firebase` to select the plugin, or ask Codex to perform a Firebase task. ### Cursor - **Option 1:** Install the plugin directly from the [Cursor Marketplace](https://cursor.com/marketplace/firebase). - **Option 2:** Run the following command in your terminal: ```bash npx skills add firebase/agent-skills --agent=cursor ``` ### Other agents Run the following command in your terminal: ```bash npx skills add firebase/agent-skills ``` ### **Step 2**: Connect to the Firebase MCP server While many Firebase agent skills use the Firebase CLI for tasks, connecting your AI coding agent to the Firebase MCP server is also recommended. This connection enhances your agent's ability to interact with your Firebase environment, providing deeper integration and access. #### AI-assisted method In most cases, you can ask your AI coding agent to set up the Firebase MCP server. However, if it struggles or you don't see the Firebase MCP server listed, switch to the [Manual method](https://firebase.google.com/docs/ai-assistance/build-with-ai.md.txt#connect-mcp-server-manual-method). #### Manual method ### Antigravity To configure Antigravity to use the Firebase MCP server: 1. In Antigravity, click the menu in the Agent pane \> **MCP Servers**. 2. Select **Firebase** \> **Install**. This automatically updates your `mcp_config.json` file, which you can view by clicking **Manage MCP Servers** at the top of the MCP Store pane \> **View raw config**, with the following content: ```json { "mcpServers": { "firebase-mcp-server": { "command": "npx", "args": ["-y", "firebase-tools@latest", "mcp"] } } } ``` ### Claude #### Claude Code - **Option 1**: Install via plugin (Recommended) The easiest way to set up the Firebase MCP server in Claude Code is to install the official Firebase plugin: 1. Add the Firebase marketplace for Claude plugins: ```bash claude plugin marketplace add firebase/firebase-tools ``` 2. Install the Claude plugin for Firebase: ```bash claude plugin install firebase@firebase ``` 3. Verify the installation: ```bash claude plugin marketplace list ``` - **Option 2**: Configure MCP server manually Alternatively, you can manually configure the Firebase MCP server: 1. Run the following command under your app folder: ```bash claude mcp add firebase npx -- -y firebase-tools@latest mcp ``` 2. Verify the installation: ```bash claude mcp list ``` It should show: firebase: npx -y firebase-tools@latest mcp - ✓ Connected #### Claude Desktop To configure Claude Desktop to use the Firebase MCP server, edit the `claude_desktop_config.json` file. You can open or create this file from the **Claude \> Settings** menu. Select the **Developer** tab, then click **Edit Config**. ```json { "mcpServers": { "firebase": { "command": "npx", "args": ["-y", "firebase-tools@latest", "mcp"] } } } ``` ### Cursor **Option 1: Marketplace plugin *(recommended)*** Install the [Firebase plugin from the Cursor Marketplace](https://cursor.com/marketplace/firebase). This automatically configures the MCP server and provides access to [Firebase agent skills](https://firebase.google.com/docs/ai-assistance/agent-skills.md.txt). **Option 2: One-click MCP setup** If you only want to add the MCP server to your global configuration, click the following button: [![Install MCP Server](https://cursor.com/deeplink/mcp-install-dark.svg)](https://cursor.com/en/install-mcp?name=firebase&config=eyJjb21tYW5kIjoibnB4IiwiYXJncyI6WyIteSIsImZpcmViYXNlLXRvb2xzQGxhdGVzdCIsIm1jcCJdfQ%3D%3D) **Option 3: Manual configuration** If you prefer to configure the server for a specific project or want to edit your settings manually, update your `mcp.json` file: - For a specific project, edit `.cursor/mcp.json` - For all projects (global), edit `~/.cursor/mcp.json` ```json "mcpServers": { "firebase": { "command": "npx", "args": ["-y", "firebase-tools@latest", "mcp"] } } ``` ### Cline To configure Cline to use the Firebase MCP server, edit the `cline_mcp_settings.json` file. You can open or create this file by clicking the MCP Servers icon at the top of the Cline pane, then clicking the **Configure MCP Servers** button. ```json { "mcpServers": { "firebase": { "command": "npx", "args": ["-y", "firebase-tools@latest", "mcp"], "disabled": false } } } ``` ### VS Code Copilot To configure a single project, edit the `.vscode/mcp.json` file in your workspace: ```json "servers": { "firebase": { "type": "stdio", "command": "npx", "args": ["-y", "firebase-tools@latest", "mcp"] } } ``` To make the server available in every project you open, edit your user settings, for example: ```json "mcp": { "servers": { "firebase": { "type": "stdio", "command": "npx", "args": ["-y", "firebase-tools@latest", "mcp"] } } } ``` ### Windsurf To configure Windsurf Editor, edit the file `~/.codeium/windsurf/mcp_config.json`: ```json "mcpServers": { "firebase": { "command": "npx", "args": ["-y", "firebase-tools@latest", "mcp"] } } ``` ### **Step 3**: Initialize Firebase services With the agent skills and tools set up, you can now use natural language to have your AI coding agent set up Cloud Firestore, Firebase Authentication, and Firebase Hosting. 1. Request that your agent set up a service. For example, you can use prompts like these: - *Set up Cloud Firestore as the database for this app.* - *Build a login page using Authentication and update Security Rules to ensure only authorized users can read and write their own data.* - *Set up Firebase Hosting and deploy the app to production.* - *Look up the current Cloud Firestore documentation for paginating query results, and then add paginated loading to the posts list.* 2. Review any information and follow any guided steps that your agent might provide, such as: 1. **Plans**: Your agent proposes a strategy based on your existing codebase. 2. **Connects**: Your agent links your local code to an existing Firebase project or helps you create a new Firebase project. 3. **Initializes resources**: Your agent adds the required Firebase libraries and configuration to your codebase. 4. **Updates files** : Your agent creates and updates any necessary files, such as `firestore.rules` (to define who can read, write, or query data within your database) or `firebase.json` (to inform the Firebase CLI which services to deploy and how to configure them). 5. **Executes**: Your agent guides you through additional configuration or deployment steps. ## Ground your agent in official Firebase documentation The Firebase MCP server includes tools that let your agent search live, official Google developer documentation (including `firebase.google.com`) as it writes code and works with your Firebase project. This means your agent can use current SDKs and APIs, new features, proper Security Rules syntax, etc. rather than relying only on its training data. These tools come from the [Developer Knowledge MCP server](https://developers.google.com/knowledge/mcp). If your agent doesn't support MCP servers, or if you want to reference specific documentation in your prompts or project instruction files (such as `AGENTS.md` or `CLAUDE.md`), then you can point your agent to Firebase's machine-readable documentation: - **Documentation indexes (`llms.txt`)** : Provide your agent with the full Firebase documentation index at , or use a product-specific index (such as for Cloud Firestore or for Authentication). - **Markdown pages (`.md.txt`)** : Append `.md.txt` to any Firebase documentation page URL (for example, `https://firebase.google.com/docs/firestore/quickstart.md.txt`) to fetch clean Markdown that's formatted for language models. Also, at the top of any Firebase documentation page, you can click **Copy page as markdown** or open its menu and select **View as Markdown**. ## General tips for prompting an AI coding agent To get the most out of your AI coding agent, especially when working with multi-faceted integrations like Firebase, treat the interaction as a collaboration rather than a single-shot command. ### Be specific and provide context While the Firebase MCP server provides the agent with significant context about your project, clear and specific natural language prompts yield the best results. Avoid vague requests. - **Vague**: "Fix the database error." - **Specific** : "I'm getting a 'permission denied' error when trying to write to the 'users' collection in Cloud Firestore. Review my `firestore.rules` and suggest a fix that allows authenticated users to write to their own document." ### Iterate and refine AI coding agents rarely generate perfect code on the first try for complex tasks. If an answer isn't quite right, keep the conversation going: - **Provide error messages**: Paste any terminal errors or console logs back into the chat. - **Ask for adjustments**: "That code uses the older v8 SDK. Rewrite it using the Firebase v9 modular SDK." - **Request explanations** : "Explain how those Firebase Security Rules protect user data." ### Verify before you execute AI coding agents are powerful, but they can make mistakes or "hallucinate" (invent incorrectly named functions or services). - **Review code** : Always read through generated code, especially Firebase Security Rules and configuration files (like `firebase.json`), before deploying to production. - **Test locally**: Whenever possible, ask the agent to help you test changes locally before pushing them live. ### Use the MCP connection Because the Firebase MCP server gives your agent direct visibility into your project structure, you can reference specific files to get tailored implementation advice. - **Example** : "Look at my `src/web/index.html` file and show me where to add the standard Firebase initialization script." ## Next steps - [Browse a complete list of all available Firebase agent skills](https://firebase.google.com/docs/ai-assistance/agent-skills.md.txt). - [Browse a complete list of all available prompts, tools, and resources the Firebase MCP server provides](https://firebase.google.com/docs/ai-assistance/mcp-server). - [Learn more about the tools provided by the Firebase CLI](https://firebase.google.com/docs/cli.md.txt). - [Learn how to connect any AI coding assistant to official Google developer documentation with the Developer Knowledge MCP server](https://developers.google.com/knowledge/mcp).