Edited at

Heroku Review Appsを使ってPRごとに環境をポコポコ立てて動作確認+レビューをしやすくしよう

More than 1 year has passed since last update.

久しぶりの投稿です。G-awaです。

今日は久しぶりにRailsとかアプリの話をしようと思います。


0. レビューと一緒に動作確認もしたい!

みなさんはGithubでPullRequest(以下PR)をレビューしていて、他の人のソースコードを読んでいるとき

「あー少し動かして見たいなぁ」とか「画面のイメージはどんな感じなのかな?」とか思ったりすることはありませんか?

実は自分もこんなことを思っていまして

GithubのPRが上がるごとにそれをwookしてきて、jenkinsがdocker立ち上げて…ビルドして…みたいな構成を描いていました。よし作ってみよう!と思って、ちょっとググっていたら実はサービスとしてもうすでにあるんですね、みんな同じことを考えているものですね:sweat_smile:

そのサービスというのがHeroku Review Appsです。HerokuはRailsチュートリアルをやったことある人なら必ず知っていると思いますが、あれです。

Heroku Review AppsはHerokuの機能として提供されていて、GithubのPRごとに自動的に環境を立ててくれます。

僕も実はRailsチュートリアルでHerokuは使ったことがあるのですが、この機能は知らなかった。。。

というわけで、すこしご紹介していきます。


1. Herokuとは

heroku-og-cad174838a49b266550809e29026ec9bc18e056dae8f9cf523ea4237379691f9-640x336.png

Heroku自体は、PaaS(Platform as a Service)と呼ばれるサービスで、アプリケーションを実行するためのプラットフォームのことです。

まぁ、サーバとかOSとかM/Wまでよろしく作ってくれている環境を貸し出してくれるサービスですね。Railsの環境とか3分くらいですぐ使えちゃいます。

無料枠が多いので、ちょっとお試しでアプリ作ってみようなんて人にはとっておきですね。


2. HerokuにRailsアプリをデプロイする

Herokuのアカウントを作成すると、はじめにこの画面が表示されます。

早速アプリをデプロイしてきたいので、[Create New App]を選択します。

image.png

次に[App name]に適当な名前を入れて、[Create app]を選択します。

ここで[App name]欄にはHerokuでそのアプリケーションを識別するための名称を入力します。

※必ずしもGithubのリポジトリ名と同じにする必要はありません。

image.png

色々聞かれますので進めていきましょう。

まず、Deployment methodでは[Github]を選択します。

次に、Connect to GitHubにはリポジトリ名を入れてください。

最終的に以下のようになればとりあえずはOKです。

画像右下の[Deploy Branch]を押してmasterブランチをデプロイしましょう。

image.png

デプロイが正常に終了すれば以下のようになるはずです。

[View]ボタンを押してアプリケーションが正常にデプロイされているか確認しましょう。アプリケーションが表示されればOKです。

image.png


3. Review Appsの設定をする

さて、いよいよReview Appsの設定をしていきましょう。

画面一番上の[New Pipeline]ボタンを押すと、次のようにパイプラインの名前を入力してくださいと言われます。

今回は「heroku-review-app-pipeline」として見ました。

[Create pipeline]を押します。

image.png

次に、画面左の[Enable Review apps]を選択しましょう。

image.png

app.jsonというものを作れと言われます。(Githubのリポジトリにapp.jsonがない場合はこのダイヤログが表示されます)

これはReview app用の環境をHerokuが立てる際に読む設定ファイルです。

image.png

Scriptsの欄にはbundle exec rails db:migrateだけ書いておきましょう。これで環境が立ち上がる際にdatabaseの最新化をしてくれるはずです。

image.png

設定をしたら[Commit to Repo]で完了です。

image.png

次に出てくるモーダルでは、以下のようしてみてください。

Create new review apps for new pull requests automaticallyはチェックを入れておきましょう。これでPRが立つごとに自動的に動作確認できる環境が立ち上がるようになります。

Destroy stale review appsはAfter 5 daysくらいに、これで立ち上がった環境は自動的に5日で消えるようになります。

image.png

これで完成!

あとはPRを立てればそれごとに環境がポコポコ立ち上がります!!

image.png

これでレビューが捗りますね:eyes:

みなさんも良いGithubレビュー環境を手に入れてみてください。

※覚書程度にさっと書いてしまいましたが、随時編集してわかりやすくしていきます。