firebaseまとめ
2021-3-9
mekoこの記事は4分で読めます
- 必要なもの
- Firebase-toolsのインストール
- プロジェクトの作成
- リソースの場所を指定する
- 場所一覧
- 設定する
- プロジェクトIDを確認する
- テストプレビュー
- テストを消す
- 再度デプロイする
- テストのリンクを開く
- Firestoreを追加する
- Firebaseを移行する
- Firebaseの設定を書き出す
- Firebaseの設定を読み込む
Hostingまでの流れです。
必要なもの
Firebase-toolsのインストール
npm install -g firebase-tools
これでfirebase -vとターミナル(or cmd)で入力してfirebaseのバージョンが出力されれば成功です。
プロジェクトの作成
firebase init
○Hosting // ここでスペース & エンター
Create a new project // エンター
project-name // プロジェクト名がすでに存在していると失敗します。firebase init からやり直し
What do you want to use as your public directory? (public) //ここはdistにしておくと便利
Configure as a single-page app (rewrite all urls to /index.html)? (y/N) //Vue,React,AngularなどSPAならy
Set up automatic builds and deploys with GitHub? // Githubにプッシュするとデプロイしてくれる→連帯画面に飛ぶので今回はn
project-name ここにはアドレスに入れたいidを入れてください。
https://project-name.web.appというアドレスになります。
firebase projects:list
このコマンドで作成できたかどうか確認できます Project Display Nameに今作成したIDがあるか確認してみてください。
リソースの場所を指定する
firebase projects:list
結果で出てくるResource Location IDが設定されていなければ設定できます。
一度設定すると修正できません。
設定ファイルなどをexportして新たにプロジェクトを作成するしかないです。
場所一覧
| 国 | リージョン名 | 都市名 |
|---|---|---|
| 北アメリカ | us-west2 | ロサンゼルス |
| us-west3 | ソルトレイクシティ | |
| us-west4 | ラスベガス | |
| northamerica-northeast1 | モントリオール | |
| us-east1 | サウスカロライナ | |
| us-east4 | 北バージニア | |
| 南アメリカ | southamerica-east1 | サンパウロ |
| ヨーロッパ | europe-west2 | ロンドン |
| europe-west3 | フランクフルト | |
| europe-west6 | チューリッヒ | |
| アジア | asia-south1 | ムンバイ |
| asia-southeast2 | ジャカルタ | |
| asia-south2 | 香港 | |
| asia-northeast1 | 東京 | |
| asia-northeast2 | 大阪 | |
| asia-northeast3 | ソウル | |
| オーストラリア | australia-southeast1 | シドニー |
設定する
Firebaseのコンソール
プロジェクトの設定、デフォルトのGCPリソースロケーションから設定できます。
プロジェクトIDを確認する
firebase projects:list
テストプレビュー
すでにfirebaseのデプロイ前までの処理が完了していれば、
本番環境にアップロードする前にテストできます。
firebase hosting:channel:deploy preview_name
preview_nameはv1やversion1などなんでも大丈夫です。
firebase hosting:channel:list
このコマンドで作成したテストのIDやリンクが確認できます。
テストを消す
firebase hosting:channel:delete channel-id
再度デプロイする
firebase hosting:channel:deploy channel-id
テストのリンクを開く
firebase hosting:channel:open channel-id
Firestoreを追加する
firebase projects:addfirebase project-id
project-idはプロジェクトIDを確認するで確認できます。
Firebaseを移行する
firebase use project-id
project-idはプロジェクトIDを確認するで確認できます。
Firebaseの設定を書き出す
firebase auth:export users.json --format json --project project-id
users.jsonファイルに設定が書き出されます。
Firebaseの設定を読み込む
firebase auth:import users.json --project project-id
users.jsonファイルをfirebaseの設定として読み込みます。
