Skip to main content

第03章:Consoleの歩き方:迷子にならない最低ルート🔧🚦

この章のゴールはシンプルです👇 「ここだけ覚えれば、とりあえず迷子にならない!」っていう“最低ルート”を身体に入れます🧠✨ (Firebaseは機能が多いので、最初は道順だけ覚えるのが勝ちです🏁)


読む:Consoleは「3つの場所」さえ押さえればOK🙂🧭

Console Map

Firebase Consoleで、初心者がまず触るべき場所はこの3つです👇

  1. **Project Overview(プロジェクトの玄関)**🏠
  • いま見てるプロジェクトが正しいか、まずここで確認✅
  • “Webアプリ追加”もここから入ることが多いです (Firebase)
  1. Project settings(設定の本丸)⚙️
  • **WebアプリのSDK設定(firebaseConfig)**を探す場所がここ🎯
  • 具体的には Project settings → General → Your apps →(対象のWebアプリ)→ Config です (Firebase)
  1. Usage & billing(お金と使用量の交通整理)💸🚧
  • Firebase/Google Cloud側の利用状況がまとまって見えるダッシュボードです👀
  • “いつの間にか課金”の芽を早めに見つける場所🌱 (Googleヘルプ)

ついでに超重要な現実として👇 Cloud Storageは条件によってBlaze(従量課金)必須になるケースがあるので、こういう告知を“見に行ける導線”を持つのが大事です🧯(今後の章で触る時に効きます) (Firebase)


手を動かす:迷子ゼロの“最低ルート”を実際に歩く🚶‍♂️🗺️

0) まず「いまどのプロジェクト?」を毎回チェック✅

Project Selector

  • Firebase Consoleを開いたら、左上のプロジェクト名を見る👀
  • もし違ったらプロジェクト切り替え🔁 👉 これだけで事故率が激減します💥

1) Project Overviewに戻れるようになる🏠🔙

やることは1つ👇

  • 左メニュー(または上部)から Project Overview に戻る

コツ

  • 迷ったら「玄関に戻る」🏠
  • 玄関に戻れば、だいたい“やりたい導線”が見つかります😄

2) Project settings(⚙️)に最短で行く⚙️🚀

Gear Icon Navigation

次に覚えるのはこれ👇

  • Project Overviewの近くにある⚙️(歯車) → Project settings (Firebase)

ここに辿り着ければ、今後ほぼ勝ちです🏆


3) 「WebアプリのSDK設定(firebaseConfig)」を見つける🏷️🌐

Firebase Config Snippet

やること👇

  • Project settings → General を開く
  • 下の方へスクロールして Your apps を見つける
  • 自分の Webアプリ を選ぶ
  • Firebase SDK snippet 的なところで Config を選んでコピー📋 (Firebase)

ここでの注意(初心者あるある)⚠️

  • 「SDKのコードどこ!?」→ Generalタブの下の方にあります(だいたい“下の方”)🧻
  • Webアプリをまだ作ってないと出ません → その場合はProject OverviewからWeb追加の導線へ (Firebase)

4) Usage & billing に行って“見る場所”だけ覚える💸👀

Usage & Billing

  • Console内の Usage and billing(使用量と請求) を開いて、 「こんな画面があるんだな〜」って眺めるだけでOKです🙂 (Googleヘルプ)

ここで見るポイント3つ👀✨

  • 料金プラン(Spark / Blaze)っぽい情報はどこにある?
  • どのサービスが使われてる?(Auth/Firestore/Hosting…)
  • “急に増えたらヤバい”のは何っぽい?(回数・通信量・ストレージなど)📈

5) (おまけ)Google Cloud側の「Budgets & alerts」入口だけ見ておく🔔💳

Firebaseだけだと「止める」系のコントロールが弱いので、 Google Cloud Billingの予算アラートは導線だけ知っておくと安心です🧯

※この章では設定しなくてOK!「入口の場所」だけで十分です🙆‍♂️


🤖AI(Gemini)を“Console迷子防止ナビ”にする💬🧭

AI Navigation Assistant

FirebaseはUIが更新されがちなので、迷ったらAIに「今の画面基準」で道案内させるのが強いです💪✨ (Firebase公式もAI支援の流れを強めてます) (Firebase)

そのための質問テンプレ(コピペOK)👇

Firebase Consoleで「WebアプリのfirebaseConfig」を取りたいです。
今いる画面は(Project Overview / Project settings / それ以外)で、見えてるメニューは(ここに列挙)です。
最短クリック手順を5ステップで教えて。見つからない場合の代替ルートも。
Firebase Consoleで「Usage & billing」を開いて、
課金事故を防ぐために最初に見るべき場所を3つ教えて。
それぞれ“何が増えると危険か”も一言で。

AIがズレたら、こう返すと復帰しやすいです👇😄

そのボタン名が見当たりません。近い名前の候補を3つ挙げて、見つけ方(どの位置にあるか)も教えて。

ミニ課題:「迷子ハント」3本勝負🎯🗺️

Console Treasure Hunt

制限時間は合計10分くらいでOK⌛✨

  1. Project Overviewに戻る🏠
  2. Project settingsへ行く(⚙️)⚙️
  3. General → Your apps → Webアプリ → Config まで行って、 firebaseConfig を見つける📋 (Firebase)

最後に、見つけた情報をこの形でメモ📝(※値は貼らなくてOK)👇

プロジェクト名:
プロジェクトID:
Webアプリ名:
firebaseConfigの場所:Project settings > General > Your apps > (Web app) > Config
Usage & billingの場所:(自分の言葉で)

よくある詰まりポイント😵‍💫➡️😄

  • 「⚙️が見つからない」 → まずProject Overviewに戻る🏠(玄関) → その近くに⚙️があることが多いです (Firebase)

  • 「Your appsがない」 → そもそもWebアプリ未登録の可能性大 → Project OverviewからWeb追加の導線へ (Firebase)

  • 「Usage & billingがどこ?」 → Console内にダッシュボードがある(名前が微妙に変わる時もある)ので、 画面内検索 or AIに“いま見えてるメニュー名”を渡して聞くのが早いです (Googleヘルプ)


チェック:これが言えたら合格✅🎉

  1. Project Overviewは何のための場所?🏠
  2. Project settingsは何ができる場所?⚙️
  3. firebaseConfigはどのルートで取れる?🏷️ (Firebase)
  4. Usage & billingは何を見る場所?💸 (Googleヘルプ)
  5. 困った時、AIに道案内させるなら何を伝える?(目的・現状・見えてるメニュー)🤖🧭

次の第4章(AIに聞く“型”)に入ると、ここで覚えた導線がさらに強化されて「詰まっても自力で復帰」しやすくなります💪✨