Skip to main content
skill Claude Code CX Codex Cursor GitHub Copilot

firebase-hosting-basics — Claude Code skill: deploy static sites

Deploys static sites and SPAs to Firebase Hosting CDN with SSL, preview channels, and custom domains.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add firebase/agent-skills --skill firebase-hosting-basics -a claude-code
Open on GitHub

What firebase-hosting-basics does

The skill teaches the agent to work with classic Firebase Hosting: deploy built static sites and single-page apps, configure redirects, rewrites, and headers in firebase.json, create preview channels to test changes before release, connect custom domains. Inside — instructions on configuration (configuration.md) and deployment (deploying.md), local emulator command. Files are cached on CDN SSD servers, SSL works out of the box.

Does not cover Firebase App Hosting for Next.js and server-side rendering, does not touch Firestore rules, Auth, or Data Connect. If the project requires SSR or automated git deployment, look at App Hosting instead. Works well for simple SPAs built with React, Vue, or plain HTML.

What it helps with

  • deploy a static site to Firebase Hosting CDN
  • configure redirects and headers in firebase.json
  • create a preview channel to test changes
  • connect a custom domain to Firebase Hosting
  • test hosting configuration locally with emulator

Example prompts for the agent

  • Deploy this React project to Firebase Hosting
  • Set up a redirect from www to the main domain in firebase.json
  • Start the local Firebase Hosting emulator for this site

How to install firebase-hosting-basics

1Skills CLI (Vercel)

npx skills add firebase/agent-skills --skill firebase-hosting-basics -a claude-code

2Manually: put the files in place

~/.claude/skills/firebase-hosting-basics/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/firebase-hosting-basics/

From the same set10

The whole set →
firebase-app-hosting-basics Google LLC Deploy and manage SSR web apps built with Next.js or Angular on Firebase App Hosting. Use it for configuration, secrets, and deployment workflows. Claude Code CX Codex Cursor +1 169,200installs firebase-data-connect Google LLC Builds and configures Firebase SQL Connect backends on PostgreSQL with GraphQL schemas and generated SDKs. Useful when adding relational data to Firebase projects. Claude Code CX Codex Cursor +1 168,300installs firebase-security-rules-auditor Google LLC Audits Firebase rules for data leaks, privilege escalation, and validation gaps. Use it when reviewing Firestore or Cloud Storage access. Claude Code CX Codex Cursor +1 138,200installs firebase-ai-logic-basics Google LLC Integrates Firebase AI Logic into Android, iOS, Web, and Flutter client apps. Helps configure direct Gemini API calls, streaming, and multimodal inputs. Claude Code CX Codex Cursor +1 135,300installs firebase-firestore Google LLC This skill helps configure Cloud Firestore, plan data models, and write SDK queries. Use it when creating a database or adding Firestore to an app. Claude Code CX Codex Cursor +1 134,900installs firebase-crashlytics Google LLC A skill for Firebase Crashlytics in Claude Code, Cursor, and other AI coding platforms. Collects crash reports from Android and iOS apps, lets you read data through the Firebase CLI MCP server. Claude Code CX Codex Cursor +1 131,200installs xcode-project-setup Google LLC This skill adds Swift Packages and links files in Xcode projects. Use it when an iOS app needs dependencies such as Firebase or Alamofire. Claude Code CX Codex Cursor +1 130,300installs firebase-remote-config-basics Google LLC Manages Firebase Remote Config templates, loading strategies, and feature flags for Android and iOS. Helps tweak app behavior without pushing a release to app stores. Claude Code CX Codex Cursor +1 120,800installs

Similar

ui-ux-pro-max nexu-io A discovery catalog entry for the UI/UX Pro Max skill in OpenDesign. It registers design system triggers so agents recognize interface usability requests. Claude Code CX Codex Cursor +1 5,400installs flutter-build-responsive-layout flutter This skill guides coding agents to build adaptive Flutter UIs across mobile and desktop screens using LayoutBuilder and BoxConstraints. Claude Code CX Codex Cursor +1 42,300installs scroll-world oso95 This skill builds a landing page where scrolling drives a camera that dives into each scene and moves to the next with no cuts. Claude Code CX Codex Cursor +1 4,800installs opentui anomalyco Gives your agent OpenTUI reference documentation: Core, React and Solid bindings, components, application APIs, testing and deployment. Claude Code CX Codex Cursor +1 3,700installs pinia Anthony Fu Pinia skill adds reference documentation to Claude Code for the official Vue state management library. Use it when defining stores, managing state, getters, and actions in Vue apps. Claude Code CX Codex Cursor +1 19,700installs flutter-add-widget-test flutter A skill that teaches AI coders to write component-level Flutter tests using WidgetTester. Verifies how widgets render and respond to taps, scrolling, and text input. Claude Code CX Codex Cursor +1 39,000installs frontend-design official anthropics This skill guides intentional visual design for new interfaces and redesigns. Use it when a generic generated UI is not enough. Claude Code Claude.ai 1,025,790installs design-taste-frontend Leonxlnx This skill directs the design of public pages and work screens, then checks the result in a browser through screenshots. Use it when an interface feels generic or unfinished. Claude Code CX Codex Cursor +1 673,100installs

Questions about firebase-hosting-basics

How to install firebase-hosting-basics in Claude Code?

Run npx skills add firebase/agent-skills --skill firebase-hosting-basics -a claude-code. The skill will appear in ~/.claude/skills/firebase-hosting-basics/SKILL.md.

What does firebase-hosting-basics do?

Deploys static sites and SPAs to Firebase Hosting, configures redirects, rewrites, and headers in firebase.json, manages preview channels and custom domains. Does not work with Firebase App Hosting for Next.js and SSR.

When to use Firebase Hosting vs App Hosting?

Firebase Hosting is for static sites and simple SPAs without server-side rendering. App Hosting is for Next.js, Angular, and other frameworks with SSR that need automated git deployment.

Source text

SKILL.md · Apache-2.0
---
name: firebase-hosting-basics
description: >-
  Deploys and configures classic Firebase Hosting for static websites, single-page apps (SPAs), and microservices. Use when deploying static sites/SPAs, setting up custom domains, configuring firebase.json hosting settings (redirects, rewrites, headers, multi-site), or managing preview channels. Don't use for Firebase App Hosting (Next.js/SSR), Auth, Firestore queries/rules, Data Connect, or Crashlytics.
metadata:
  author: Google LLC
  category: Serverless
---

# hosting-basics

This skill provides instructions and references for working with Firebase
Hosting, a fast and secure hosting service for your web app, static and dynamic
content, and microservices.

## Overview

Firebase Hosting provides production-grade web content hosting for developers.
With a single command, you can deploy web apps and serve both static and dynamic
content to a global CDN (content delivery network).

**Key Features:**

- **Fast Content Delivery:** Files are cached on SSDs at CDN edges around the
  world.
- **Secure by Default:** Zero-configuration SSL is built-in.
- **Preview Channels:** View and test changes on temporary preview URLs before
  deploying live.
- **GitHub Integration:** Automate previews and deploys with GitHub Actions.
- **Dynamic Content:** Serve dynamic content and microservices using Cloud
  Functions or Cloud Run.

## 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.

## Instructions

### 1. Configuration (`firebase.json`)

For details on configuring Hosting behavior, including public directories,
redirects, rewrites, and headers, see
[configuration.md](references/configuration.md).

### 2. Deploying

For instructions on deploying your site, using preview channels, and managing
releases, see [deploying.md](references/deploying.md).

### 3. Emulation

To test your app locally:

```bash
npx -y firebase-tools@latest emulators:start --only hosting
```

This serves your app at `http://localhost:5000` by default.

© Google LLC · Apache-2.0 · firebase/agent-skills

See also

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor