趣旨

angularとdjangoで作ったブログアプリのangularの方をFirebaseでデプロイします。
メモ程度にまとめるつもりです。

アカウントとプロジェクトの作成

Firebase公式サイトで行います。
アカウントは、なぜか作ってありました。まず『プロジェクトの追加』を押して、プロジェクトを作成します。なんとかに同意みたいなことがいっぱい出てきますが、かたっぱしから同意します。

今回は『Hosting』という機能を使うので、『開発』→『Hosting』を選択します。
始めたいので、『始める』を選択します。

『Firebase CLI』を使うので、指示に従ってターミナルに移動してインストールします。

ターミナル

$ cd アプリのディレクトリ
$ npm install -g firebase-tools

# ターミナルでログイン
以下のコマンドを打って、FirebaseCLIにログインします。

ターミナル

$ firebase login

そしたらいろいろ出てきて指示に従ってぽちぽちしていけばいつの間にかターミナルでログインできています。

ターミナル

$ ng build --prod

このコマンドを打って、ファイルの中にエラーが残っていた場合はエラーを吐かれます。

※次のプロジェクトの初期化の前にビルドをしてdistディレクトリを作成する必要があります。

ターミナル

$ firebase init

そしたらめっちゃ質問されるので、全部英語を読んで頑張って答えます。

『What do you want to use as your public directory?』
と聞かれたら、
『dist/アプリのディレクトリ名』と答えます。

デプロイする前にローカルサーバーで動作を確認します。

ターミナル

$ firebase serve

想定通りにアプリが動いたらいよいよデプロイです。

ターミナル

$ firebase deploy

完了したらURLが出てきます。そのURLに飛んだら自分の作成したアプリが表示されます。
表示されずに『Welcomeなんとか』って表示される場合は、『⌘+シフトキー+R』でキャッシュを消してみると現れると思います。