はじめに
おはようございます。こんにちは。こんばんは。
今回はFirebaseのHostingについて見てきます。
では、早速行って見ましょう。
※今回もwebベース(Vue.js)の解説です。
Hostingとは
https://firebase.google.com/docs/hosting?hl=ja
Firebaseが提供してくれているサービスの１つです。
Firebase Hosting は、ウェブアプリ、静的コンテンツと動的コンテンツ、マイクロサービス向けの高速で安全性の高いホスティングを提供します。
Hostingの準備
①Firebase CLIのインストール
$npm install-g firebase-tools
※Firebase CLIのコマンドの詳細はこちらを参考にしてください。
②ログイン
firebase login
※①と②の工程を済ませている方は無視して下さい。
Hosting設定
③初期化
ここから実際にHosting(デプロイ)していきます。
Firebaseで公開する前に、いくつかファイルを作る必要があるので、その設定をします。
Vue.jsの作業ディレクトリに行って以下のコマンドを叩いてください。
$firebase init
はじめに、Database、Hosting どっちの設定にする？って聞いてくるので、Hostingを選択します。
④プロジェクト選択
次に、どのプロジェクトと紐付ける？って聞いてくるので、紐ずけたいプロジェクトを選びます。
ちなみに、create a new projectを選ぶと、上のプロジェクト作成と同じ事がここでできます。
この辺は、お好きなように。
⑤Database Security Ruleの設定
次に、Realtime Database のSecurity Ruleについて聞いてきます。
Realtime Databaseを使わない場合は、Enterをおします。
⑥公開ディレクトリ
あと、少しで設定は完了です。
次に、公開ディレクトリはどうする？って聞いてきます。
※デフォルトでは、publicになります。publicでいいなら、そのままエンターを押しましょう。
Vue.js/Nuxt.jsではビルドしたファイルが格納されたフォルダ(dist)なので、distと入力。
⑦Single Page Application
最後に、Single Page Applicationの設定をする？って聞いてきます。
こちらは、デフォルトはNoになっています。
Single Page Applicationにするならy、しないなら、Nを入力します。Single Page Applicationって、何？？という人は、Nにしましょう（笑）
Vue.js/Nuxt.jsはシングルページアプリケーションなのでyです。
⑧公開
deployコマンドで公開します。
$firebase deploy
以上。
ここまで6回に渡ってFirebaseが提供しているサービスの種類や使い方等を見てきました。
自分自身もまだ理解し切れていない機能や使い方がたくさんあると思うのでその都度勉強していきます。
最後まで読んでいただきありがとうございました。
Twitterやってます。良ければチェックして見てください。