こんにちは！kossyです！
さて、今回はfirebaseへの静的サイトのデプロイ手順をブログに残したいと思います。
ドットインストールのレッスンを参考にデプロイをしたのですが、驚くほど簡単にできました。
環境
MacOS
Node.js推奨版
firebaseを使ってのデプロイには、Node.jsをインストールする必要があるので、
インストールをしていない方は、
https://nodejs.org/ja/
上記のサイトから推奨版をインストールしてください。
確認方法は、ターミナルで
$ node -v => v 10.7.0
バージョンが表示されればインストールされています。
Firebaseは、Googleが提供しているサービスで、いわゆるMBaas / BaaSと呼ばれているものです。
Webアプリに用いられることが多いですが、静的サイトのデプロイもできます。
firebase デプロイ手順
アカウント作成
firebase.google.com
上記サイトからconsoleへのログインができます。
まずは左上のログインをクリックしてログインします。
Googleアカウントをお持ちの方はそのアカウントでログインできます。
ログインができたら、コンソールにアクセスします。
コンソールの新しいプロジェクトを作成をクリックし、
プロジェクトを作成します。
プロジェクト名を入力する欄があるので、プロジェクト名を入力します。
その後、アナリティクスの地域がデフォルトではアメリカ合衆国になっているので、
日本に変更します。ロケーションはus-centralを選択します。
一番下のチェックボックスにチェックをし、プロジェクトを作成をクリックします。
その後、次へというボタンが表示されるので、そちらをクリックします。
上記のような画面が表示されれば成功です。
ローカル側での準備
作ったプロジェクトと同じ名前のフォルダを任意のディレクトリに作成し、
デプロイしたいフォルダをコピー＆ペーストします。
中のフォルダはpublicに名前を変更します。
publicフォルダの中身は全てデプロイされます。
firebase-toolsのインストール
ターミナルからfirebaseの機能を利用できるようにするfirebase-toolsをインストールします。
$ sudo npm install -g firebase-tools PASSWORD: (PCのPASSWORDを入力)
firebase-toolsがインストールできたか確認
$ firebase -V
ログイン
$ firebase login => Allow Firebase... (Y/n) Y又はenterキーを押す。
$firebase init 上から4番目のホスティングを選択→エンターキーを押し、 前に作ったプロジェクトを選択しエンターキー。 さらにエンターキーを押す。 SPAにするのはNo。 ファイルの上書きはだめなのでNで対応。
デプロイしたいアプリのディレクトリ $sudo firebase deploy
これで静的サイトのデプロイは終了です。
