はじめに
制作したサイトをfirebaseで公開しようと利用したので、その手順や注意を忘れないよう自分なりにまとめた記事です。
準備
・ Googleアカウント
・ デプロイするサイト
・ firebaseのプロジェクト作成(公開するサイト1つにつき1つ作る。)
・ node.jsをインストール(推奨版)
ターミナルでnode.jsがインストールされているか確かめる。
$ node -v
続いてnpmも一緒にインストールされているか確認してみる。
$ npm -v
firebase-toolsのセットアップ
firebaseのコマンドラインツールのインストール
$ sudo npm install -g firebase-tools
インストールされているか確認する。
$ firebase -V
インストールが終わったら、firebaseにログイン
$ firebase login
? Allow Firebase to collect anonymous CLI usage and error reporting information?(Y/n)
↓Yを選択後
✔ Success! Logged in as <mail address>
Success! が出たらログイン完了。
プロジェクトの初期化
アップしたいファイルに移動し、初期化する。
$ cd <アップしたいファイルまで移動>
<ファイル名>$ firebase init
矢印キーで移動、スペースキーで選択、リターンで決定。
Hostingを選択。
? Which Firebase CLI features do you want to setup for this folder?
❯◉ Hosting: Configure and deploy Firebase Hosting sites
どのフォルダを公開用のフォルダにしますか?
publicディレクトリを使用するので、Enter。
? What do you want to use as your public directory? (public)
publicフォルダの中のHTMLを上書きしますか?
Nを選択。絶対No。注意!!!!
complete!と出たら、初期化ができました。
? File public/index.html already exists. Overwrite? (y/N)
↓Nを選択
✔︎ Firebase initialization complete!
続いてファイルの中身を確認。
・ firebase.jsonが作成されている。
・ publicフォルダの中に404.htmlが作成されている。
サイトを公開(デプロイ)
デプロイするときに、初期化したファイルに移動しているか確認してから行う。
<ファイル名>$ firebase deploy
Hosting URL: <公開したかったサイトのURL>
URLをコピーしてブラウザに貼り付けると、https:で表示される。
ログアウト
firebaseにログインしている状態なので、ログアウトして終了。
<ファイル名>$ firebase logout
デプロイしているサイトを更新したい。
編集したファイルに移動し、firebaseにログインした後、そのままデプロイすればOK!
$ cd <アップしたいファイルまで移動>
$ firebase login
<ファイル名>$ firebase deploy
メモ
プロジェクトの一覧を確認
<ファイル名>$ firebase projects:list
ターミナルのクリア
control + l
firebaseサイトの自分のダッシュボードに行くと現在公開しているサイトと履歴を確認できる。ロールバックもダッシュボードでできる。
※ロールバック:以前公開したサイトに戻す事。