ゼロから始めるFirestoreその２~ローカルのテスト環境を整える~

こんにちは、ワニかず@40歳 出戻りエンジニアです。
今回はCloud Firestoreデータベースのローカルのテスト環境を構築する手順についてです。

前提

1. FirebaseのコンソールでFirestoreデータベースの設定が終わっていること
   設定方法はこちらをご覧ください。
   https://zenn.dev/40_comeback_eng/articles/58b70f749f56e9
2. Firebase CLIの設定が終わっていること
   設定方法はこちらをご覧ください。
   https://zenn.dev/40_comeback_eng/articles/f326b704f8823e

手順

Firestoreを初期化

1. ターミナルを起動し、cdコマンドで環境を構築したいディレクトリに移動
2. ターミナルで以下のコマンドを実行

firebase init firestore 

3. プロジェクトの選択に関して以下のような選択肢が出ますが、コンソールでFirestoreデータベースの設定が終わっているため、Use an existing projectを選択

• Use an existing project (既存のプロジェクトを使用)
• Create a new project (新しいプロジェクトを作成)
• Add Firebase to an existing Google Cloud Platform project(既存のGCPプロジェクトにFirebaseを追加)
• Don't set up a default project (デフォルトプロジェクトを設定しない)
  ※プロジェクトを後で設定したい場合に選択します

Use an existing projectを選択すると、選ぶことのできるプロジェクトが表示されるので、
Firestoreを追加するプロジェクトを選択

4. Firestore のセキュリティルールを定義するファイル名の入力を以下のように促されるので、

? What file should be used for Firestore Rules?

デフォルトのfirestore.rulesでEnterを押して次に進む

5. Firestoreのインデックス設定を定義するファイル名の入力を以下のように促されるので、

? What file should be used for Firestore indexes? 

デフォルトのfirestore.indexes.jsonでEnterを押して次に進む

6.ターミナルに、以下のように表示されれば、設定が完了

Firebase initialization complete!

Emulatorを初期化

1. ターミナルを起動し、Firestoreを初期化したディレクトリと同じ場所で

firebase init

を実行

2. 選択肢がいくつか出てくるのですが、その中から

Emulators: Set up local emulators for Firebase products

を選択

3. セットアップするEmulatorの一覧が表示されるので、

 ◯ Authentication Emulator
 ◯ Firestore Emulator

を選んでEnterで次に進む

4. 以下のように、エミュレーターのポート番号などを聞かれますが、特に何も無ければそのままEnterで次に進む

? Which port do you want to use for the auth emulator? 9099
? Which port do you want to use for the functions emulator? 5001
? Which port do you want to use for the firestore emulator? 8080
? Would you like to enable the Emulator UI? Yes
? Which port do you want to use for the Emulator UI (leave empty to use any 
available port)? 
? Would you like to download the emulators now? Yes

5. ターミナルに、以下のように表示されれば、設定が完了

✔  Firebase initialization complete!