概要

Open AIのプロンプトを活用して自前でコードレビューbotを用意してみたので、備忘のためやったことを書き残しておきます。

きっかけ: GitHub Actions のワークフローが動かない

GitHub で利用できる Code Review 用のワークフローが GitHub Actions のマーケットプレイスで提供されています。

ただし残念ながらうまく動作しませんでした。具体的にはワークフロー自体は動作するものの、コードレビューはされませんでした。特にログも出力されないので原因はよく分かっていませんが、以下の注意事項が関係しているのかなと予想しています。

Due to cost considerations, BOT is only used for testing purposes and is currently deployed on AWS Lambda with ratelimit restrictions. Therefore, unstable situations are completely normal. It is recommended to deploy an app by yourself.

GitHub - anc95/ChatGPT-CodeReview: 🐥 A code review bot powered by ChatGPT

ワークフローが動けば特にこの記事の作業をする必要はないと思いますし、他にもワークフローはいくつかありそうなので、探してみて使うのも良いと思います。

Marketplace · GitHub

この記事は、 anc95/ChatGPT-CodeReview を自前で動かすにはどうすればいいかを記載します。

ローカルで動かすまでの準備

Open AI トークンの準備

ワークフローを使うにせよローカルで動かすにせよオープンAIのAPIキーが必要です。

無料ではできないので注意が必要です。

以下から登録し、ペイメントを登録してキーを発行します。

OpenAI Platform

OpenAI Platform

※ 10ドル分登録しましたが、お試しで使うくらいならそんなに入れなくてよかったなと思いました。

ここで作成した API キーをアプリが使う環境変数として .env ファイルの OPENAI_API_KEY という名前であとで追加するため、保存しておきます。

ChatGPT - CodeReview

コードをクローンしたら README に書かれている通りにしてみます。

GitHub - anc95/ChatGPT-CodeReview: 🐥 A code review bot powered by ChatGPT

# Install dependencies
npm install

# Build code
npm run build

# Run the bot
npm run start

すると、 Probot が動き localhost:3000 で listen し始めてくれます。

> cr-bot@1.0.0 start
> node -r dotenv/config ./dist/index.js
INFO (probot): 
INFO (probot): Welcome to Probot!
INFO (probot): Probot is in setup mode, webhooks cannot be received and
INFO (probot): custom routes will not work until APP_ID and PRIVATE_KEY
INFO (probot): are configured in .env.
INFO (probot): Please follow the instructions at http://localhost:3000 to configure .env.
INFO (probot): Once you are done, restart the server.
INFO (probot): 
INFO (server): Running Probot v12.3.0 (Node.js: v20.11.1)
INFO (server): Listening on http://localhost:3000

さらに勝手に .env ファイルが作成されます。これだけでは動かないので GitHub Apps の登録と設定をします。

GitHub Apps の登録

GitHub Apps に自分専用のコードレビューボットアプリを登録します。

諸々の初期設定は Probot のアプリ経由で実行すると簡単にできます。

npm run start でアプリを実行してある状態で、 http://localhost:3000/ にアクセスします。

画面に沿って設定すると .env に、 APP_ID など必要な環境変数が自動的に追加されている状態になります。

bot への必要な権限追加

アプリケーションには必要となる権限を与えておきます。

例えば、以下のような設定を入れておくと PR や Issue が作られたときや、コードの変更時に発火できます。

Repository permissions > Pull requests
Repository permissions > Issues: read and write
Repository permissions > Contents: read only

https://github.com/settings/apps/(app-name)/permissions

Subscribe to events の方も忘れずに追加します。

権限の設定が終わったら、アプリが対象のレポジトリにインストールされていることを確認します。

https://github.com/(org)/(repo)/settings/installations

インストールしたら webhook イベントが飛ぶようになるので、アプリの履歴から飛んだWebフックが確認ができます。

https://github.com/settings/apps/(app-name)/advanced

※ 後述する smee の URL (https://smee.io/hogehoge) からも確認できます。

もしイベントが飛んでいないようであれば、追加したパーミッションに対してレポジトリ側の設定でアプリの再承認が必要かもしれません。

Repository → Settings → Installed GitHub Apps → Configure

bot の起動

まずは忘れないように .env ファイルに OPENAI_API_KEY を追加します。

ローカルに立ち上げたサーバーに対して webhook のエンドポイントを提供するサービスとして smee を使います。

smee.io

.env に追加されている WEBHOOK_PROXY_URL のページにアクセスするとインストール方法と利用方法が表示されます。

$ npm install --global smee-client

smee を起動します。

$ smee -u https://smee.io/hogehoge

アプリを起動します。

$ npm run start

動作確認

インストールしたレポジトリに対してコード編集してからプルリクを作ってみます。

これでコードレビューがされれば成功です。

プロンプトや言語も変更ができるので試してみると良いです。

LANGUAGE=Japanese
PROMPT='〜な観点でコードレビューをしてください。'

まとめ

コードレビューボットをローカルで実行して動くようにしました。自分が作業するときだけお試しで実行したかったので、これで一旦完了です。

実際にちゃんとセルフホストすることを考えると、どこかにデプロイするなりして動かす必要があるので、もし実施したらまた記事にします。

とろろこんぶろぐ

かけだしR&Dフロントエンジニアの小言

コードレビューbotをローカルでお試しする方法

概要