jpskill.com
🛠️ 開発・MCP コミュニティ

firebase-development

Firebaseプロジェクトの初期化、Cloud FunctionsやFirestoreの追加、エミュレータのデバッグ、コードレビューなど、Firebase関連の作業を支援するSkill。

📜 元の英語説明(参考)

This skill should be used when working with Firebase projects, including initializing projects, adding Cloud Functions or Firestore collections, debugging emulator issues, or reviewing Firebase code. Triggers on "firebase", "firestore", "cloud functions", "emulator", "firebase auth", "deploy to firebase", "firestore rules".

🇯🇵 日本人クリエイター向け解説

一言でいうと

Firebaseプロジェクトの初期化、Cloud FunctionsやFirestoreの追加、エミュレータのデバッグ、コードレビューなど、Firebase関連の作業を支援するSkill。

※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

  1. 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
  2. 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
  3. 3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
    • · macOS / Linux: ~/.claude/skills/
    • · Windows: %USERPROFILE%\.claude\skills\

Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。

詳しい使い方ガイドを見る →
最終更新
2026-05-17
取得日時
2026-05-17
同梱ファイル
1

📖 Skill本文(日本語訳)

※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。

Firebase 開発

概要

このスキルシステムは、本番プロジェクトで実績のあるパターンを使用して Firebase 開発をガイドします。検出された意図に基づいて、専門のサブスキルにルーティングします。

サブスキル:

  • firebase-development:project-setup - 新しい Firebase プロジェクトを初期化します
  • firebase-development:add-feature - 関数/コレクション/エンドポイントを追加します
  • firebase-development:debug - エミュレーターとランタイムの問題をトラブルシューティングします
  • firebase-development:validate - セキュリティ/パターンについて Firebase コードをレビューします

このスキルが適用される場合

  • 新しい Firebase プロジェクトを開始する場合
  • Cloud Functions または Firestore コレクションを追加する場合
  • エミュレーターの問題やルール違反をデバッグする場合
  • セキュリティとパターンについて Firebase コードをレビューする場合
  • マルチホスティング構成を設定する場合
  • 認証を実装する場合 (API キーまたは Firebase Auth)

ルーティングロジック

サブスキルごとのキーワード

project-setup:

  • "new firebase project", "initialize firebase", "firebase init"
  • "set up firebase", "create firebase app", "start firebase project"

add-feature:

  • "add function", "create endpoint", "new tool", "add api"
  • "new collection", "add feature", "build", "implement"

debug:

  • "error", "not working", "debug", "emulator issue"
  • "rules failing", "permission denied", "troubleshoot", "deployment failed"

validate:

  • "review firebase", "check firebase", "validate", "audit firebase"
  • "look at firebase code", "security review"

ルーティングプロセス

  1. リクエストを分析: ルーティングキーワードを確認します
  2. サブスキルを照合: キーワード密度に基づいて最適な一致を特定します
  3. アナウンス: 「firebase-development:[sub-skill] スキルを使用して [アクション] を実行しています」
  4. ルーティング: サブスキルをロードして実行します
  5. フォールバック: 曖昧な場合は、4つのオプションで AskUserQuestion を使用します

フォールバックの例

意図が不明確な場合は、次のように尋ねます。

Question: "What Firebase task are you working on?"
Options:
  - "Project Setup" (Initialize new Firebase project)
  - "Add Feature" (Add functions, collections, endpoints)
  - "Debug Issue" (Troubleshoot errors or problems)
  - "Validate Code" (Review against patterns)

参照プロジェクト

パターンは、3つの本番 Firebase プロジェクトから抽出されています。

プロジェクト パス 主要パターン
oneonone /Users/dylanr/work/2389/oneonone Express API、カスタム API キー、サーバー書き込み専用
bot-socialmedia /Users/dylanr/work/2389/bot-socialmedia-server ドメイングループ化された関数、Firebase Auth + ロール
meme-rodeo /Users/dylanr/work/2389/meme-rodeo 個別関数ファイル、エンタイトルメント

パターンの概要

マルチホスティングのセットアップ

ニーズに基づいて3つのオプションがあります。

オプション 使用するタイミング 主要機能
site: ベース 複数の独立した URL シンプル、ビルド調整不要
target: ベース デプロイ前フックが必要な場合 ビルドスクリプトが自動的に実行されます
シングル + リライト 小規模プロジェクト すべて1つのドメイン下

詳細: docs/examples/multi-hosting-setup.md を参照してください。

認証

パターン 使用するタイミング
カスタム API キー MCP ツール、サーバー間 oneonone
Firebase Auth + ロール ユーザー向けアプリ bot-socialmedia
ハイブリッド 両方のパターンが必要な場合 Web UI + API アクセス

詳細: docs/examples/api-key-authentication.md を参照してください。

Cloud Functions アーキテクチャ

パターン 使用するタイミング 構造
Express アプリ ミドルウェア、ルーティングを備えた API app.post('/mcp', handler)
ドメイングループ化 機能豊富なアプリ posts.ts, journal.ts
個別ファイル 最大限のモジュール性 ファイルごとに1つの関数

詳細: docs/examples/express-function-architecture.md を参照してください。

セキュリティモデル

モデル 使用するタイミング 複雑さ
サーバー書き込み専用 ライトライトアプリ、高セキュリティ シンプルなルール
クライアント書き込み + 検証 大量の書き込み、リアルタイム 複雑なルール

ライトライトアプリケーションにはサーバー書き込み専用を強く推奨します

詳細: docs/examples/firestore-rules-patterns.md を参照してください。

エミュレーターファースト開発

常にエミュレーターを使用してローカルで開発してください。

firebase emulators:start
# UI にアクセスするには http://127.0.0.1:4000

firebase.json の主要な設定:

  • singleProjectMode: true - エミュレーターが連携するために不可欠です
  • ui.enabled: true - デバッグ UI にアクセスします

詳細: docs/examples/emulator-workflow.md を参照してください。

最新のツール標準

すべての Firebase プロジェクトは以下の標準に従います。

ツール 目的 設定ファイル
TypeScript 型安全性 tsconfig.json
vitest テスト vitest.config.ts
biome リンティング + フォーマット biome.json

ABOUTME コメントパターン

すべての TypeScript ファイルは2行の ABOUTME コメントで始まります。

// ABOUTME: このファイルが何をするかの簡単な説明
// ABOUTME: 追加のコンテキストを含む2行目

テスト要件

  • 単体テスト: ハンドラー/ユーティリティを単独でテストします
  • 統合テスト: エミュレーターを実行してテストします
  • どちらもすべての機能に必要です

よくある落とし穴

問題 解決策
エミュレーターポートが使用中 lsof -i :5001、プロセスを強制終了
Admin SDK vs Client SDK Admin はルールをバイパスし、Client はルールを尊重します
コールドスタートの遅延 最初の呼び出しは5〜10秒かかりますが、正常です
データ永続性 データのエクスポートには Ctrl+C (kill ではない) を使用します
関数での CORS app.use(cors({ origin: true }))

まとめ

このオーケストレーターは、専門のサブスキルにルーティングします。

  1. キーワードによって意図を検出します
  2. 適切なサブスキルにルーティングします
  3. サブスキルは TodoWrite チェックリストを使用します
  4. すべて docs/examples/ の共有パターンを参照します

サブスキル:

  • firebase-development:project-setup - 新しいプロジェクトを初期化します
  • firebase-development:add-feature - 関数/コレクションを追加します
  • firebase-development:debug - 問題をトラブルシューティングします
  • firebase-development:validate - コードをレビューします
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開

Firebase Development

Overview

This skill system guides Firebase development using proven patterns from production projects. It routes to specialized sub-skills based on detected intent.

Sub-skills:

  • firebase-development:project-setup - Initialize new Firebase projects
  • firebase-development:add-feature - Add functions/collections/endpoints
  • firebase-development:debug - Troubleshoot emulator and runtime issues
  • firebase-development:validate - Review Firebase code for security/patterns

When This Skill Applies

  • Starting new Firebase projects
  • Adding Cloud Functions or Firestore collections
  • Debugging emulator issues or rule violations
  • Reviewing Firebase code for security and patterns
  • Setting up multi-hosting configurations
  • Implementing authentication (API keys or Firebase Auth)

Routing Logic

Keywords by Sub-Skill

project-setup:

  • "new firebase project", "initialize firebase", "firebase init"
  • "set up firebase", "create firebase app", "start firebase project"

add-feature:

  • "add function", "create endpoint", "new tool", "add api"
  • "new collection", "add feature", "build", "implement"

debug:

  • "error", "not working", "debug", "emulator issue"
  • "rules failing", "permission denied", "troubleshoot", "deployment failed"

validate:

  • "review firebase", "check firebase", "validate", "audit firebase"
  • "look at firebase code", "security review"

Routing Process

  1. Analyze Request: Check for routing keywords
  2. Match Sub-Skill: Identify best match based on keyword density
  3. Announce: "I'm using the firebase-development:[sub-skill] skill to [action]"
  4. Route: Load and execute the sub-skill
  5. Fallback: If ambiguous, use AskUserQuestion with 4 options

Fallback Example

If intent is unclear, ask:

Question: "What Firebase task are you working on?"
Options:
  - "Project Setup" (Initialize new Firebase project)
  - "Add Feature" (Add functions, collections, endpoints)
  - "Debug Issue" (Troubleshoot errors or problems)
  - "Validate Code" (Review against patterns)

Reference Projects

Patterns are extracted from three production Firebase projects:

Project Path Key Patterns
oneonone /Users/dylanr/work/2389/oneonone Express API, custom API keys, server-write-only
bot-socialmedia /Users/dylanr/work/2389/bot-socialmedia-server Domain-grouped functions, Firebase Auth + roles
meme-rodeo /Users/dylanr/work/2389/meme-rodeo Individual function files, entitlements

Pattern Summaries

Multi-Hosting Setup

Three options based on needs:

Option When to Use Key Feature
site: based Multiple independent URLs Simple, no build coordination
target: based Need predeploy hooks Build scripts run automatically
Single + rewrites Smaller projects All under one domain

Details: See docs/examples/multi-hosting-setup.md

Authentication

Pattern When to Use Example
Custom API keys MCP tools, server-to-server oneonone
Firebase Auth + roles User-facing apps bot-socialmedia
Hybrid Both patterns needed Web UI + API access

Details: See docs/examples/api-key-authentication.md

Cloud Functions Architecture

Pattern When to Use Structure
Express app API with middleware, routing app.post('/mcp', handler)
Domain-grouped Feature-rich apps posts.ts, journal.ts
Individual files Maximum modularity One function per file

Details: See docs/examples/express-function-architecture.md

Security Model

Model When to Use Complexity
Server-write-only Light-write apps, high security Simple rules
Client-write + validation High-volume writes, real-time Complex rules

Strongly prefer server-write-only for light-write applications.

Details: See docs/examples/firestore-rules-patterns.md

Emulator-First Development

Always develop locally with emulators:

firebase emulators:start
# Access UI at http://127.0.0.1:4000

Key settings in firebase.json:

  • singleProjectMode: true - Essential for emulators to work together
  • ui.enabled: true - Access debug UI

Details: See docs/examples/emulator-workflow.md

Modern Tooling Standards

All Firebase projects follow these standards:

Tool Purpose Config File
TypeScript Type safety tsconfig.json
vitest Testing vitest.config.ts
biome Linting + formatting biome.json

ABOUTME Comment Pattern

Every TypeScript file starts with 2-line ABOUTME comment:

// ABOUTME: Brief description of what this file does
// ABOUTME: Second line with additional context

Testing Requirements

  • Unit tests: Test handlers/utilities in isolation
  • Integration tests: Test with emulators running
  • Both required for every feature

Common Gotchas

Issue Solution
Emulator ports in use lsof -i :5001, kill process
Admin SDK vs Client SDK Admin bypasses rules, client respects rules
Cold start delays First call takes 5-10s, normal
Data persistence Use Ctrl+C (not kill) to export data
CORS in functions app.use(cors({ origin: true }))

Summary

This orchestrator routes to specialized sub-skills:

  1. Detects intent via keywords
  2. Routes to appropriate sub-skill
  3. Sub-skills use TodoWrite checklists
  4. All reference shared patterns in docs/examples/

Sub-Skills:

  • firebase-development:project-setup - Initialize new projects
  • firebase-development:add-feature - Add functions/collections
  • firebase-development:debug - Troubleshoot issues
  • firebase-development:validate - Review code