Skills Learn Benchmarks Tools News
Skills · Firebase · DevOps & CI/CD · Back-end & APIs · Firebase App Hosting Basics

Firebase App Hosting Basics

Uses Firebase App Hosting for full-stack frameworks, handling build, deploy, and runtime configuration.

View on GitHub → Read SKILL.md
firebase/agent-skills 2026-06-01
323 GitHub stars
58 Forks
2026-05-29 Updated
Apache-2.0 License

The full SKILL.md

Synced June 1, 2026 — view latest on GitHub
SKILL.md
---
name: firebase-app-hosting-basics
description: Deploy and manage web apps with Firebase App Hosting. Use this skill when deploying Next.js/Angular apps with backends.
---

# App Hosting Basics

## Description
This skill enables the agent to deploy and manage modern, full-stack web applications (Next.js, Angular, etc.) using Firebase App Hosting. 

**Important**: In order to use App Hosting, your Firebase project must be on the Blaze pricing plan. Direct the user to https://console.firebase.google.com/project/_/overview?purchaseBillingPlan=metered to upgrade their plan.

## Hosting vs App Hosting

**Choose Firebase Hosting if:**
- You are deploying a static site (HTML/CSS/JS).
- You are deploying a simple SPA (React, Vue, etc. without SSR).
- You want full control over the build and deploy process via CLI.

**Choose Firebase App Hosting if:**
- You are using a supported full-stack framework like Next.js or Angular.
- You need Server-Side Rendering (SSR) or ISR.
- You want an automated "git push to deploy" workflow with zero configuration.

## Deploying to App Hosting

### Deploy from Source

This is the recommended flow for most users. 
1. Configure `firebase.json` with an `apphosting` block.
    ```json
    {
      "apphosting": {
        "backendId": "my-app-id",
        "rootDir": "/",
        "ignore": [
          "node_modules",
          ".git",
          "firebase-debug.log",
          "firebase-debug.*.log",
          "functions"
        ]
      }
    }
    ```
2. Create or edit `apphosting.yaml`- see [Configuration](references/configuration.md) for more information on how to do so.
3. If the app needs safe access to sensitive keys, use `npx -y firebase-tools@latest apphosting:secrets` commands to set and grant access to secrets.
4. Run `npx -y firebase-tools@latest deploy` when you are ready to deploy.

### Automated deployment via GitHub (CI/CD)

Alternatively, set up a backend connected to a GitHub repository for automated deployments "git push" deployments.
This is only recommended for more advanced users, and is not required to use App Hosting.
See [CLI Commands](references/cli_commands.md) for more information on how to set this up using CLI commands.

## Emulation

See [Emulation](references/emulation.md) for more information on how to test your app locally using the Firebase Local Emulator Suite.
Install

Add Firebase App Hosting Basics to your agent

Pick your tool, then drop the file in or run the one-line fetch command.

1Drop this in

Project: .cursor/skills/firebase-app-hosting-basics.md

2Or fetch it from the repo
curl -fsSL https://raw.githubusercontent.com/firebase/agent-skills/main/skills/firebase-app-hosting-basics/SKILL.md -o .cursor/skills/firebase-app-hosting-basics.md

Restart Cursor. The agent now follows this skill on every relevant task.

1Drop this in

User-level: ~/.claude/skills/firebase-app-hosting-basics/SKILL.md

2Or fetch it from the repo
mkdir -p ~/.claude/skills/firebase-app-hosting-basics && curl -fsSL https://raw.githubusercontent.com/firebase/agent-skills/main/skills/firebase-app-hosting-basics/SKILL.md -o ~/.claude/skills/firebase-app-hosting-basics/SKILL.md

Claude Code auto-discovers skills in ~/.claude/skills/.

1Drop this in

Project: AGENTS.md (append the SKILL contents)

2Or fetch it from the repo
curl -fsSL https://raw.githubusercontent.com/firebase/agent-skills/main/skills/firebase-app-hosting-basics/SKILL.md >> AGENTS.md

Codex CLI reads AGENTS.md automatically from the project root.

1Drop this in

Project: .windsurf/rules/firebase-app-hosting-basics.md

2Or fetch it from the repo
mkdir -p .windsurf/rules && curl -fsSL https://raw.githubusercontent.com/firebase/agent-skills/main/skills/firebase-app-hosting-basics/SKILL.md -o .windsurf/rules/firebase-app-hosting-basics.md

Windsurf loads project rules on every Cascade run.

1Drop this in

Project: .github/copilot-instructions.md (append)

2Or fetch it from the repo
mkdir -p .github && curl -fsSL https://raw.githubusercontent.com/firebase/agent-skills/main/skills/firebase-app-hosting-basics/SKILL.md >> .github/copilot-instructions.md

Copilot reads .github/copilot-instructions.md as project-wide context.

1Drop this in

Project: .gemini/skills/firebase-app-hosting-basics.md

2Or fetch it from the repo
mkdir -p .gemini/skills && curl -fsSL https://raw.githubusercontent.com/firebase/agent-skills/main/skills/firebase-app-hosting-basics/SKILL.md -o .gemini/skills/firebase-app-hosting-basics.md

Gemini CLI auto-loads project skills on the next run.

This is third-party code your agent will execute. Web Developer is independent and not affiliated with Firebase. Review the SKILL.md above and the source repository before installing.

Pair it

Related skills.

DevOps & CI/CD01 Turborepo

Sets up and optimizes Turborepo monorepos with fast task pipelines, caching, and clean workspace organization.

↗
DevOps & CI/CD02 Deploy to Vercel

Guides agents through configuring and deploying projects to Vercel, including build settings and environment setup.

↗
DevOps & CI/CD03 Vercel CLI with Tokens

Automates the Vercel CLI using access tokens for non-interactive, CI-friendly deployments and project management.

↗
STATUS ● BUILDING THE FUTURE
MISSION MAKE AI SHIP BETTER CODE.
VERSION BETA 3.0

MAKE AI SHIP BETTER CODE.

@WEBDEVELOPERHQ ↗
TERMS / PRIVACY
FRIENDS
Authentic Jobs
Authentic Jobs ↗
Web Reference
Web Reference ↗
Ready.dev
Ready.dev ↗
Design.dev
Design.dev ↗
© 2026 WEB DEVELOPER / ALL RIGHTS RESERVED