difit-review スキルでエージェント自身に変更点をコメントしてもらおう
difit はローカルの git 差分を GitHub スタイルのインターフェースで確認できる CLI ツールです。difit-review スキルを使用することでエージェントがコードの変更点にコメントを残した状態で difit を起動できます。この記事では、difit-review スキルを使用してエージェント自身にコードの変更点をコメントしてもらう方法を紹介します。
difit は GitHub スタイルのビューワーでローカルの git 差分を確認・レビューできる CLI ツールです。コードを自分で書くよりもレビューすることが多くなった AI エージェント時代に、リモートに変更をプッシュすることなく見慣れたインターフェースでコードの差分を確認できるという点が魅力的です。npx difit <target> コマンドで特定のコミットを指定して差分を確認できるほか、staged や working といったキーワードでステージングエリアやワーキングツリーの差分を確認できます。
# 特定のコミットの差分を確認
npx difit abcd1234
# ステージングエリアの差分を確認
npx difit staged
# mainブランチとの差分を確認
npx difit @ mainコマンドを実行すると http://localhost:4966 で差分を確認できるようになります。行単位でコメントを残し、プロンプトとしてエージェントにフィードバックできます。
difit は CLI ツールとして提供されていますが、公式から提供されている Skills として利用することでエージェントから呼び出すこともできます。現時点では difit に関連するスキルは以下の 2 つが提供されています。
- difit: ユーザーにコードレビューを依頼する
- difit-review: エージェントがコメントを残した状態で difit を起動する
スキルの呼び出し方法はエージェントごとに異なります。例えば Claude Code では /difit-review のようにスラッシュコマンドで呼び出せますが、Codex ではスキル参照から明示的に呼び出します。この記事では主に Claude Code での実行例を紹介しつつ、Codex での利用例もあわせて紹介します。
スキルから difit を起動することにより人間が細かいコマンドの引数の指定方法を覚える必要がなくなるほか、コードレビューの結果やエージェントが書いたコードの説明を残してもらうといった使い方が可能になります。実際に difit-review スキルを使用してエージェントによるコードの説明を試してみましょう。
difit-review スキルをインストール
特定のスキルをインストールするには npx skills コマンドが便利です。以下のコマンドで対話形式で利用中のエージェントを選び、difit-review スキルをインストールします。
npx skills add https://github.com/yoshiko-pg/difit --skill difit-reviewAgent Skills はプロンプトにユーザーの機密事項を窃取するプロンプトを含める「プロンプトインジェクション」のリスクや、任意のスクリプトを実行できる仕組みが悪用されるリスクなど、セキュリティ上のリスクを伴う可能性があります。Agent Skills を第三者からインストールする際には、スキルの内容を十分に確認することを推奨します。
スキルのインストールが完了したら、エージェントから difit-review スキルを使用できるようになっているか確認してみましょう。例えば Claude Code では /difit-review と入力したときに候補として表示されれば、スキルが正しく認識されています。
difit-review スキルを使用してエージェントにコードの説明をしてもらう
それでは実際に difit-review スキルを使用してエージェントにコードの説明をしてもらった状態で difit を起動してもらいましょう。まずは架空の家計簿アプリの UI を実装してもらいます。
プロンプト
# 取引入力フォーム UI
## 概要
収入・支出を登録するための入力フォームを実装する。新規作成と編集の両方に使える共通コンポーネントとして設計する。
## ページ構成
- 新規作成: `/transactions/new`（または一覧ページ内のモーダル）
## フォームフィールド
| フィールド | 入力方式 | バリデーション |
|-----------|---------|--------------|
| タイプ | 収入 / 支出 のトグルスイッチ | 必須 |
| 日付 | 日付ピッカー（デフォルト: 今日） | 必須、未来日は警告のみ |
| 金額 | 数値入力（円マーク表示） | 必須、1以上の整数 |
| カテゴリ | セレクトボックス（type に応じてフィルタ） | 必須 |
| メモ | テキストエリア（1行） | 任意、200文字以内 |
## UI の振る舞い
- タイプ（収入/支出）を切り替えると、カテゴリの選択肢が連動して切り替わる
- 金額入力時に3桁カンマ区切りで表示（例: ¥1,500）
- 送信後は一覧ページに遷移（またはモーダルを閉じてリスト更新）
- 送信中はボタンをローディング状態にして二重送信を防止
## 追加の要件
- `/api/transactions` エンドポイントに POST リクエストを送る形で実装する
- Vitest + Testing Library を使用してコンポーネントのテストを実装する
- アクセシビリティに配慮した実装を心がける
- 既存の UI コンポーネントライブラリを活用して実装する実装が完了したら、Claude Code では /difit-review コマンドを使用して difit を起動してもらいます。SKILL.md で定義されているルールの通り、difit コマンドを --comment オプション付きで起動する点がポイントです。difit-review スキル自体は difit の起動方法とコメントの受け渡しを定義するもので、どのようなコメントが付くかはエージェントが差分をどう調査したかに依存します。
/difit-reviewここではなぜ <Select> コンポーネントをテストでモックしているのか、コードを見ただけでは分かりづらい変更点についてエージェントがコメントを残しています。例えば「テスト環境では複雑な UI コンポーネントの内部実装よりもフォームの振る舞いを検証したいため、<Select> を単純なモックに置き換えている」といった補足があれば、差分の意図をすばやく把握できます。
エージェントにコードレビューを依頼するときも同様に difit-review スキルを活用できます。Claude Code の実装を Codex にレビューしてもらいましょう。Codex ではスキル参照を通じて difit-review を明示的に呼び出します。
主要ファイルの差分とその周辺コードを調査したうえで、エージェントが重要な問題や変更意図をコメントとして残した状態で difit を起動できます。レビュー結果の品質そのものはエージェントの調査内容に依存しますが、実際のコードレビューの体験をローカルで完結させられるのは便利です。
まとめ
difitはローカルの git 差分を GitHub スタイルのインターフェースで確認できる CLI ツールdifit-reviewスキルを使用することでエージェントがコードの変更点にコメントを残した状態でdifitを起動できる- Claude Code では
/difit-reviewのように呼び出すことで、エージェントがコードの変更点にコメントを残した状態でdifitを起動できる - エージェントにコードレビューを依頼するときも
difit-reviewスキルを活用できる
