Firebaseでアプリをホスティングする（Hosting Service）

先日 Firebase のチュートリアルをやってみた。

このときはまだ、Firebase はリアルタイムアプリケーションデータベース（すなわち DBaaS ）としか認識してなかったんだけど、ホスティングサービスもやっていたということに後から気づいた。

Firebase Hosting | Firebase Documentation

このサービス使えば作成したアプリの運用も全部 Firebase でできる...！

ということで、せっかくなのでクイックスタートを試してみた。
なお、Firebase のアカウント作成＆アプリケーション登録の手順は上記記事を参照。

ホスティングまでの手順

CLI のインストール（Setup the firebase command line tool）

まずはローカルから firebase にデプロイするために必要な CLI をインストール。
インストールには npm を使う。

$ npm install -g firebase-tools

アプリのセットアップ（Initialize your app）

アプリを作成したいディレクトリで、以下のコマンドを実行する。

$ firebase init

すると Email, Password を聞かれるので、Firebase のアカウント情報を入力する。

$ firebase init
Please sign into your Firebase account to continue...
Email: **********@*******
Password:

無事ログインできると Firebase のアプリケーション一覧が表示されるので、
ホスティングに利用するアプリケーションを1つ選ぶ。

----------------------------------------------------
Your Firebase Apps ************@*********
----------------------------------------------------
my-firebase-app
----------------------------------------------------
Enter the name of the Firebase app you would like to use for hosting
Firebase app: my-firebase-app

Site URL にアプリの公開 URL が表示される。
この後、ディレクトリ内でアプリのトップページすなわち index.html を置く場所を指定する。

たとえば、public/index.html というように public ディレクトリ下に配置したい場合は public を入力する。

----------------------------------------------------
Site URL: https://my-firebase-app.firebaseapp.com
----------------------------------------------------
Enter the name of your app's public directory.
(usually where you store your index.html file)
Public Directory: (current directory) public

これでセットアップは完了し、ディレクトリに firebase.json というファイルが作成される。

Initializing app into current directory...
Writing firebase.json settings file...
Successfully initialized app
To deploy: firebase deploy

firebase.json

{
  "firebase": "my-firebase-app",
  "public": "public",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ]
}

デプロイする

デプロイはアプリのルートディレクトリで以下のコマンドを実行する。

$ firebase deploy
Preparing to deploy Public Directory...
progress: 100%
Successfully deployed
Site URL: https://my-firebase-app.firebaseapp.com, or use firebase open
Hosting Dashboard: https://firebase.com/account then view the hosting section of your app

ブラウザで http://my-firebase-app.firebaseapp.com にアクセスするか、ターミナルで

$ firebase open

とするとアプリがデプロイされ、稼働しているのを確認できる。

かんたん！

TODO

現時点で気になることいくつか。

カスタムドメインの設定方法
- このあたり。Free Plan でできるのか https://www.firebase.com/docs/hosting/guide/custom-domain.html
Free Plan の制限
セキュリティに対する考え方
- xxx.firebaseapp.com という URL からデータベースの URL （xxx.firebaseio.com）が簡単にわかるんじゃ？
- xxx.firebaseio.com っていう URL がばれると勝手にデータベースに書き込まれたりするんじゃ？
- そうでなくともあてずっぽうで xxx の部分が見つかったら（特に制限しない限り）第三者に利用されちゃうんじゃ？
- → というわけで、なんらかのユーザー認証が前提になってる？