byfirebase· 35 skills
Deploys and manages full-stack web applications (Next.js, Angular) with Server-Side Rendering (SSR) using Firebase App Hosting. Use when deploying Next.js/Angular apps, configuring apphosting.yaml or firebase.json apphosting blocks, managing secrets, setting up GitHub CI/CD, or configuring Blaze billing requirements. Don't use for classic static web hosting, Auth, Firestore, Crashlytics, or Xcode.
$npx -y skills add firebase/agent-skills --skill firebase-app-hosting-basicsInstalls into the current project.
Run `npx skills use "https://github.com/firebase/agent-skills" --skill "firebase/agent-skills/firebase-app-hosting-basics"` and follow the generated skill instructions now. Read its complete output, redirecting it to a temporary file first if necessary. Resolve relative paths from the supporting-files directory it provides.
Use the skills in "https://github.com/firebase/agent-skills" that are relevant to the current task. Run `npx skills add "https://github.com/firebase/agent-skills"` and select the relevant skills, then follow their instructions.
| 1 | # App Hosting Basics |
| 2 | |
| 3 | ## Description |
| 4 | |
| 5 | This skill enables the agent to deploy and manage modern, full-stack web |
| 6 | applications (Next.js, Angular, etc.) using Firebase App Hosting. |
| 7 | |
| 8 | **Important**: In order to use App Hosting, your Firebase project must be on the |
| 9 | Blaze pricing plan. Direct the user to |
| 10 | https://console.firebase.google.com/project/_/overview?purchaseBillingPlan=metered |
| 11 | to upgrade their plan. |
| 12 | |
| 13 | ## Hosting vs App Hosting |
| 14 | |
| 15 | **Choose Firebase Hosting if:** |
| 16 | |
| 17 | - You are deploying a static site (HTML/CSS/JS). |
| 18 | - You are deploying a simple SPA (React, Vue, etc. without SSR). |
| 19 | - You want full control over the build and deploy process via CLI. |
| 20 | |
| 21 | **Choose Firebase App Hosting if:** |
| 22 | |
| 23 | - You are using a supported full-stack framework like Next.js or Angular. |
| 24 | - You need Server-Side Rendering (SSR) or ISR. |
| 25 | - You want an automated "git push to deploy" workflow with zero configuration. |
| 26 | |
| 27 | ## Deploying to App Hosting |
| 28 | |
| 29 | ### Deploy from Source |
| 30 | |
| 31 | This is the recommended flow for most users. |
| 32 | |
| 33 | 1. Configure `firebase.json` with an `apphosting` block. |
| 34 | |
| 35 | ```json |
| 36 | { |
| 37 | "apphosting": { |
| 38 | "backendId": "my-app-id", |
| 39 | "rootDir": "/", |
| 40 | "ignore": [ |
| 41 | "node_modules", |
| 42 | ".git", |
| 43 | "firebase-debug.log", |
| 44 | "firebase-debug.*.log", |
| 45 | "functions" |
| 46 | ] |
| 47 | } |
| 48 | } |
| 49 | ``` |
| 50 | 1. Create or edit `apphosting.yaml`- see |
| 51 | [Configuration](references/configuration.md) for more information on how to |
| 52 | do so. |
| 53 | 1. If the app needs safe access to sensitive keys, use |
| 54 | `npx -y firebase-tools@latest apphosting:secrets` commands to set and grant |
| 55 | access to secrets. |
| 56 | 1. Run `npx -y firebase-tools@latest deploy` when you are ready to deploy. |
| 57 | |
| 58 | ### Automated deployment via GitHub (CI/CD) |
| 59 | |
| 60 | Alternatively, set up a backend connected to a GitHub repository for automated |
| 61 | deployments "git push" deployments. This is only recommended for more advanced |
| 62 | users, and is not required to use App Hosting. See |
| 63 | [CLI Commands](references/cli_commands.md) for more information on how to set |
| 64 | this up using CLI commands. |
| 65 | |
| 66 | ## Emulation |
| 67 | |
| 68 | See [Emulation](references/emulation.md) for more information on how to test |
| 69 | your app locally using the Firebase Local Emulator Suite. |