Zenn
🎃

Firebase: PRを上げるだけで、レビュー環境を作成する方法(2/2) - ローカル

2020/11/03に公開
Firebase
Firestore
Next.js
Firebase Hosting
tech

追記

Github Action x プライベートリポジトリ での実現方法を以下に記載しました
https://zenn.dev/yuuyamiyamae/articles/c4be0c1c700b5423ea99

Introduction

Firebase x Next.js x Typescriptで開発し始めて２ヶ月。
画面追加や変更時のレビュー時に、挙動確認までできたらなと思ったのがきっかけ。
探していたら、Firebase Preview Channels というのが、リリースされていたので導入してみました。

前提

firebase hosting で構築中の方

これからの方は、Next.js * Firebase Hosting でこちらを参考に
https://github.com/vercel/next.js/tree/canary/examples/with-firebase-hosting

レビュー環境の作成

firebase hosting では, preview channelsと呼ばれていますね。

  1. firebase tools のインストール
npm i firebase-tools -g

firebase -V # v8.12.0 以上なら使用可能
  1. プレビューチャンネルの作成
firebase hosting:channel:deploy firebase-for-zenn # {firebase-for-zenn}は任意

Project Console: https://console.firebase.google.com/project/yuyamiyamae/overview
Hosting URL: https://yuyamiyamae.web.app

✔  hosting:channel: Channel URL (yuyamiyamae): https://yuyamiyamae--firebase-for-zenn-kzjf414m.web.app [expires 2020-11-09 19:10:39]

まとめ

Preview Channelsによって、レビュー体制がより一層よくなりました。
Github Action でも実現できるみたいなので、導入次第またアウトプットしようと思います。

Discussion