🤖
GitHubでFirebase Hostingを自動デプロイした
GitHub Actionsを使って、master
ブランチにpushされたら、自動的にFirebase Hostingのデプロイコマンドが発火させる手順について記載します。
Firebase tokenの発行
まず、事前にデプロイ用のFirebaseトークンを発行します。
$ firebase login:ci
...
Example: firebase deploy --token 1//...
作成したトークンを控えておきます。
GitHub Actionsのworkflow作成
続いて、GitHubのActionsにworkflowを作成します。
初めて作成する場合は以下のような画面になっているので、「set up a workflow yourself→
」をクリックして新規作成画面に遷移します。
開かれたエディタ内に以下の内容を貼り付けてください。
name: deploy_firebase_hosting
on:
push:
branches:
- master
jobs:
deploy_firebase_hosting:
runs-on: macos-latest
steps:
- name: Checkout the repository
uses: actions/checkout@master
# ポイント1
# ↓↓↓ node_modulesはgit管理していないと思いますので、ここで、nodeモジュールを取得するコマンドをjobとして設定します。
- name: Install Dependencies # ← コマンド識別名
run: yarn install # ← 実際のコマンド
# ポイント2
# ↓↓↓ ビルドファイルを作成するためのコマンド
- name: Build
run: yarn run build
# ポイント3
# ↓↓↓ Firebaseのデプロイコマンドここに先ほど控えたトークンを貼り付けます
- name: Deploy to Firebase
run: yarn deploy --token=${{先ほど控えたトークン}}
ポイントは3つです。
git管理されていない、node_modules
ファイル、build
ファイル関連はgit上には上がっていないので、ここで生成してあげる必要があります。
ymlファイル内でjobとしてコマンドを設定してあげます。
firebaseデプロイコマンドに先程生成したトークンを貼るのを忘れないように!
Firebase Deployコマンドの追加
最後に設定したyarn deploy --token=...
をpackage.json
にエイリアスコマンドの設定として追加してあげましょう。
...
},
"scripts": {
...
"deploy": "firebase deploy"
},
...
以上です!
これらの変更をmaster
ブランチに反映すると、自動的にGitHub上のActionsにてジョブが稼働していきます!
さいごに
今回初めてGitHubでデプロイなどの自動化を行いました。
機械的に実行できるところはなるべく自動化して、他に時間を使っていきたいものですね。
これで、ymlファイルの用法なんかもついでに学べたので、今度じっくり公式のワークフローのドキュメント読んでみようかなぁと思います。
Discussion