Google FireBaseのセッティング
プロジェクトの作成が完了したら以下のページに入る
アプリケーションの作成
ダッシュボード内のアプリを追加を選択し、アプリの登録を行う。
周辺データのインストール
Firebase SDKのインストールを行う。これはFirebase内のサービスへのアクセスを単一のライブラリにまとめたもの。
いったん画面の手順通り進める。
まず以下のコマンドを実行してfirebaseを自分のプロジェクトにインストール
npm install firebase
次に、画面に出ているJavaScriptのコードを、プロジェクトのルードディレクトリに新しくfirebase.config.jsというファイルを作成してコピペ。
最後の行に以下を追加しておく。
export default app
これをsrcフォルダ内のindex.jsの中でimportする。
import app from '../../firebase.config';
いったんローカルの自分がデプロイしたいファイルに行き、CLIをインストールする。コードは以下を実行する。
npm install -g firebase-tools
CLIのインストールが終了したら以下で起動。
firebase login
googleの認証を経て、login successfull!となればOK。
サンプルファイルのデプロイ
まずfirebaseを初期化する。
firebase init
firebaseの確認に入る。
いったん今回はwebページをデプロイしたいので、hostingのみ設定を行う。
事前にfirebase上にプロジェクトを作成しておくと、以下のように選択が可能。
後は色々と聞かれるけどええ感じに答えて、
と出れば終了。
firebaseのコンソールから割り当てられたURLに進むと、
というページが出てくる。
これはデプロイしたフォルダ内にあるpublicファイルに生成されたindex.htmlの内容をアップしており、指定したhtmlファイルをちゃんとサーバ上で読み込めていることが分かる。
これで任意のアプリケーションをデプロイするまでの環境が整ったので、ここから実際に以下の記事で作ったものをデプロイしていく。
Discussion