207 Tech Blog

テクノロジーで物流を変える 207 (ニーマルナナ) 株式会社のテックブログ

Renovate の PR が作成されたらビルド結果を比較して auto merge する

こんにちは。207でソフトウェアエンジニアをやっている原口 (id:nagamejun)です。 今回はDependabotからRenovateに移行した内容について話します。

207にjoinした当初からDependabotは導入されていたのですが、多くのPRをレビュー出来ずにスタックしてしまう問題が起きてました。 1つ1つ動作確認してマージしていっては切りがないので、ビルド結果に差分がない場合は本番に影響がないと考えビルド結果を比較する仕組みを導入しました。

207では配送員の方向けのアプリ TODOCUサポーター をReact Nativeで、物流会社向け配達業務管システムのWEBアプリTODOCUクラウドをNext.jsで開発しています。 React Nativeの場合、metro bundlerでのビルド結果を、Next.jsの場合、webpackでのビルド結果を比較することになります。

かなり参考にさせていただいた記事*1に詳細は譲りますが、ビルド結果の比較について触れていきたいと思います。

React Nativeの場合

出力ファイル名は変わらないので最新のmainブランチのビルド結果と比較するだけです。

Next.jsの場合

ブラウザキャッシュ対策でコードの変更があればファイル名が変わります。そのためmainブランチでのビルドでA.jsだったファイル名がRenovateのPRのビルドでA.jsとは限らないことがあります。比較対象の名前が分からないと機械的に比較は難しいのでmainブランチがmergeされたタイミングでCI上でoutputのfilenameをcontenthashせずにビルドしartifactsに保存しておきます。RenovateのPRのビルドでも同じ名前で比較できるようにoutputのfilenameをcontenthashせずにビルドしdiffを取ります。 こんなワンライナーで比較できると思います。

cd .next/
find . -name "*.js" | sed 's!^\./!!' | xargs -n 1 -I{}  diff -u {} ../.main_build/{}

自動でbaseブランチを最新にする

Branch protection rulesでRequire branches to be up to date before mergingを有効にしているのでmainブランチに他のPRがマージされた場合update branchをする必要があります。GitHub Actions のWorkflowを実行し自動でupdate branchするといいでしょう。

Require approvals

approveが必須な設定もRenovate approveというGitHub Appを使うことで自動化出来ます。

まとめ

上記の仕組みを入れることで溜まっていたDependabotのPRは解消することが出来ました。 Renovateのscheduleを使って月曜日にPRを出し、自動マージ出来なかったものは都度チェックする体制に変わりました。

最後に

207株式会社では、レガシーな物流業界の変革に挑む配達員向け効率化アプリ「TODOCUサポーター」を開発しています。 フロントエンドの開発をしたいメンバーを大絶賛募集中です!

もし少しでもご興味がありましたら以下のnotionをご覧ください!

207-inc.super.site