1
0

More than 3 years have passed since last update.

Firebase Hosting でのサイト公開手順メモ

Last updated at Posted at 2020-01-11

Firebaseで導入時に操作する手順を残しておきます。
firebase公式サイト

0. 事前準備

以下はすでに導入済みのものとして説明は省略します。

  • node.jsのインストール
  • ブラウザからfirebase公式サイトへログインしてプロジェクト作成

1. firebase tool(firebase CLI)のインストール

下記のコマンドでインストールします。

npm install -g firebase-tools

インストール終わったら以下のコマンドで、firebase CLIから使えるコマンド一覧が確認できます。

firebase

こちらはバージョン確認

firebase --version

2. firebaseへログイン(Googleアカウントへの紐付け)

インストール後Googleアカウントへと紐付けをおこないます。

$ firebase login

英語での質問が表示されますのでそのままEnterキーをクリックしてください。
するとブラウザでのログイン画面が立ち上がるので、Googleアカウントでログインします。

ログインできたら、以下でfirebase上のプロジェクト一覧が確認できます。

$ firebase projects:list

プロジェクトID確認できるやつ

$ firebase list

3. 初期化

事前にフォルダを作成して移動しておいてください。

$ mkdir フォルダ名
$ cd フォルダ名

下記のコマンドで対象フォルダを初期化します。

$ firebase init

プロジェクト指定まだの場合は指定するオプション

$ firebase init --project=プロジェクトID名

コマンドライン上にどのサービスを使うのかなど質問がでてきますのでスペースで選択して答えていきます。

選択質問後はyesかnoで答えるいくつか質問がでてきますので答えていきます。

▼質問項目(確かこんな内容)

  • 公開するファイルを格納したディレクトリ(初期設定はpublic)
  • SPAかどうか(yesだとどのアクセスでも/index.html参照になる)
  • 常にindex.html上書きかどうか など

上記完了すると2つのファイルが生成されます。

  • .firebaserc
  • firebase.json

4. デプロイ

下記のコマンドでローカルにあるpublicフォルダ配下のファイルがfirebaseサーバ上にアップロードされます。

$ firebase deploy

コンソール上に表示される、下記のようなURLで公開となります。
https://xxxx.firebaseapp.com

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0