Skip to main content

第2章　インストール＆初期セットアップ⚙️🧪（ここで“爆速の土台”を作る）

この章のゴールはシンプル👇 **「Emulator Suite を動かすための必須ツールを入れて、firebase init まで到達する」**です🔥

この章で出てくる“3点セット”🧰✨​

_three_tools

  • Node.js：Firebase CLI を動かす中心エンジン（CLIは Node 18 以上が要件）(Firebase)
  • Java（JDK）：エミュレータが内部で使う（昔より条件が上がって、Java 21 未満は非対応になりました）(Firebase)
  • Firebase CLI：firebase init / firebase emulators:* の司令塔（npm で入れるのが定番）(Firebase)

ちなみに、エミュレータのインストール手順として「firebase init emulators」が案内されています(Firebase) （最初は必要なバイナリをダウンロードするので、初回だけ少し時間がかかりがち💿）

2-0　まず“入ってるか”を秒速チェック⚡👀​

_version_check

ターミナル（PowerShellでもOK）でこれ👇

node -v
npm -v
java -version
firebase --version
  • node と npm が出れば Node はOK👌
  • java -version が出れば Java はOK👌
  • firebase --version が出れば CLI はOK👌

ここで firebase が無いなら、次へ進もう🏃‍♂️💨

2-1　Node.js を入れる📦🟢（LTSでOK）​

Node は “安定板（LTS）” を選ぶのが一番ラクです🙂 今のLTSラインは v24 系が「Active LTS」として案内されています(Node.js)

インストール後に、もう一回チェック👇

node -v
npm -v

✅ ここで Node 18+ が満たせていれば CLI 要件クリアです(Firebase)

2-2　Java（JDK）を入れる☕🧱（“21以上”が安全）​

_java_gate

エミュレータ周りは Java が必要です（Firestore Emulator などが裏で使うイメージ）📌 古い資料だと「JDK 11+」と書かれていることがあるんですが、CLIの変更で Java 21 未満はエミュ起動非対応になっています(Firebase) なのでここは迷わず JDK 21 以上でいきましょう✅

入れたら確認👇

java -version

2-3　Firebase CLI を入れる🧰🔥（npmで一発）​

公式の案内はこれ👇（グローバルインストール）(Firebase)

npm install -g firebase-tools
firebase --version

💡もし「更新したい」なら、同じコマンドをもう一回やるだけでOK（だいたい最新版になります）🆙

2-4　ログインする🔑🌐（ブラウザが開けない時のワザも）​

_login_key

普通はこれ👇

firebase login

でも、リモート環境等で「ローカルでブラウザが開けない」ケースがあります。 そのときは公式でも --no-localhost が案内されています(Firebase)

firebase login --no-localhost

2-5　プロジェクト用フォルダを作る📁✨（ここから“教材の本体”）​

好きな場所に作ってOK。例👇

mkdir memo-ai-local
cd memo-ai-local

2-6　firebase init をやる🎛️🧪（ここがこの章のメイン！）​

_init_blocks

まずは初期化👇

firebase init

すると「何を使う？」って聞かれます（チェックボックス式）✅ この教材のミニ題材（ログイン→メモ→整形→ローカルテスト）に寄せるなら、まずはこのへんを選ぶとスムーズ👇

  • Firestore
  • Functions
  • Emulators
  • （余裕があれば）Hosting

👀ポイント：Emulators は firebase init emulators でも初期化できる、というのが公式の流れです(Firebase) （firebase init から入っても、結局やることは同じ感じ👍）

Functions の選び方（超初心者向けの安全ルート）🧯​

  • 言語は TypeScript を選ぶ（この教材の本線）
  • Lint は「後で整える」でもOKだけど、迷うなら有効でOK🙂
  • dependencies のインストールは “Yes” でOK（勝手に揃う）

※ 最近の CLI では Cloud Functions の Node.js 24 ランタイム対応なども追加されてます(Firebase) （ローカルの Node と “本番ランタイム” は別物なので、ここは後の章で整理するよ🧠）

Emulators の選び方🧪​

この教材で使う候補はだいたい👇

  • Authentication Emulator
  • Firestore Emulator
  • Functions Emulator

ポートはデフォルトで進めてOK（あとで変えられる）🔧 （エミュレータは初回にダウンロードが走るので、ここで「何か落としてるな〜」ってなります💿）

2-7　できあがりの“目印ファイル”を確認👀✅​

_file_structure

firebase init が成功してると、だいたいこんな子たちができます👇

  • firebase.json（エミュ設定の中心）
  • .firebaserc（プロジェクトIDのひも付け）
  • functions/（関数のコード置き場）
  • firestore.rules / firestore.indexes.json（Firestore選んでれば）

ここまで来たら、第3章で「起動してUIを見る🚀」に進める状態です👏

🤖AIを“第2章から”混ぜるコツ（つまずき即死回避🧯）​

_ai_debug

ここ超大事。初心者が詰まりやすいのは「エラー文が怖い」問題😱 でも今は Gemini にエラーを貼るだけでほぼ進めます✨

使えるテンプレ（コピペ用）📋💨​

  • 「このエラーを“文系向け”に説明して」
  • 「原因を3つに絞って、確認コマンドも出して」
  • 「直す手順を、最短ルート→安全ルートの順で」

さらに、Firebase には MCP サーバーが用意されていて、Gemini CLI / エージェントから Firebase 操作を補助できる流れが公式で案内されています。しかも Antigravity がサポート対象に入っています(Firebase) 加えて Gemini CLI 側の Firebase 拡張は、/firebase:init みたいな“初期化系のショートカット”も提供しています(Firebase)

つまり第2章は「AIに初期化の叩き台を作らせて、人間が確認して進める」がめちゃ強い💪🤖

ミニ課題🎯🧩（5分）​

次の3つを満たして、スクショ or メモを残そう📸📝

  1. node -v と java -version の結果が出る
  2. firebase --version の結果が出る
  3. firebase init が終わって、フォルダに firebase.json ができてる

チェック✅（声に出して言えたら勝ち🏆）​

  • 「Firebase CLI は npm で入れる」って言える(Firebase)
  • 「エミュは Java 21+ じゃないと詰む可能性がある」って言える(Firebase)
  • 「firebase init と firebase init emulators の役割の違いがなんとなく分かる」(Firebase)
  • 「詰まったら Gemini にエラー貼って“原因3つ＋確認コマンド”で切り分けできる」🤖(Firebase)

よくある詰まりポイント集🧯（ここだけ見れば復活できる）​

  • firebase が見つからない → 新しいターミナルを開き直す（PATH反映）→ダメなら npm install -g firebase-tools を再実行(Firebase)
  • java が見つからない → JDK入れ直し＋ java -version が通るか確認
  • エミュ起動で Java 関連のエラー → Java 21 未満の可能性が高い（まずここを疑う）(Firebase)
  • ログインでブラウザが開けない → firebase login --no-localhost を試す(Firebase)

次の章（第3章）は、いよいよ firebase emulators:start で起動して、Emulator UI を見に行く🚀👀 だよ！