GitHubでAIレビューを組み込む 〜Claude Code Actionデモ&AIエージェントの設計方針〜 / Claude Code Action for beginners

Transcript

1. GitHubでAIレビューを組み込む Claude Code Actionデモ&AIエージェントの設計方針 グロービス 大沼和也 ©GLOBIS. ALL Rights Reserved.
2. GitHub Actionsの基礎 Claude Code Actionとは何か セットアップの手順 実際の使い方と活用事例 今日お話しすること Claude Code Actionを使って、GitHub上でAIと協働開発する方法 » ©GLOBIS. ALL Rights Reserved. 2│
3. これからAIレビュワーを導入しようと考えている方 導入したが「欲しいレビューが来ない」と感じている方 どこまでAIレビュワーを頼れるのか分からないと思っている方 以下の方向けにお話します ©GLOBIS. ALL Rights Reserved. 3│
4. 0. 前提知識 ©GLOBIS. ALL Rights Reserved. 4│
5. CI/CD: 継続的インテグレーション/継続的デリバリー コードのプッシュやPR作成などのイベントをトリガーに、自動でタスクを実行 テスト、ビルド、デプロイなどを自動化できる GitHub Actionsとは GitHubが提供するCI/CD自動化プラットフォーム » ©GLOBIS. ALL Rights Reserved. 5│
6. ワークフロー: 自動化されたプロセス全体（YAMLファイルで定義） ジョブ: ワークフロー内の実行単位 ステップ: ジョブ内の個別タスク アクション: 再利用可能な処理の単位 GitHub Actionsの基本構成 ワークフロー、ジョブ、ステップ » ©GLOBIS. ALL Rights Reserved. 6│
7. name: テストの実行 on: [push, pull_request] # トリガー jobs: test: # ジョブ runs-on: ubuntu-latest steps: # ステップ - uses: actions/checkout@v2 # アクション - run: npm test # コマンド実行 GitHub Actionsの構文例 » ©GLOBIS. ALL Rights Reserved. 7│
8. テストの自動実行: PR作成時に自動でテストを実行 コードレビュー: 静的解析ツールを自動実行 デプロイ: mainブランチへのマージで本番環境へデプロイ 通知: Slackなどへの自動通知 そしてAIとの協働: Claude Code Actionのテンプレートがすでに公式から用意され ている GitHub Actionsでできること 開発フローの自動化 » ©GLOBIS. ALL Rights Reserved. 8│
9. AIの出力は実行ごとに微妙に変わる可能性がある ブレを最小限にする設計が重要 不用意にコンテキストを渡しすぎない AIをワークフローに組み込む際の注意点 AIは確率的挙動をする » ©GLOBIS. ALL Rights Reserved. 9│
10. 悪い設計 1. AI がPR を一括取得 2. AI がPRs をループして切り出し 3. AI が各PR をレビュー 問題点 AIが処理フロー全体を担当 コンテキストが大きくなり、挙動が不安定に デバッグが困難 悪い例：AIに複雑な処理を任せる » ©GLOBIS. ALL Rights Reserved. 10│
11. 良い設計 1. スクリプトでPR を一括取得 2. スクリプトでループ処理 3. PR 単位でAI を発火（レビューのみ） メリット AIは単一のタスク（レビュー）に専念 コンテキストが小さく、挙動が安定 デバッグしやすい 良い例：AIは単一タスクに集中 » ©GLOBIS. ALL Rights Reserved. 11│
12. 単一責任の原則: AIには1つのタスクだけを任せる 確定的な処理はスクリプトで: ループ、条件分岐、データ取得など AIは判断や生成に集中: コードレビュー、テスト生成、ドキュメント作成など 小さなコンテキスト: 必要最小限の情報だけをAIに渡す AIワークフローの設計原則 シンプルに、確実に » ©GLOBIS. ALL Rights Reserved. 12│
13. 1. Claude Code Actionとは ©GLOBIS. ALL Rights Reserved. 13│
14. PRやIssueで @claude とメンションするだけでAIがコードレビュー・実装を支援 コード変更、質問への回答、実装タスクの自動化が可能 複数の認証方法に対応（Anthropic API、Amazon Bedrock、Google Vertex AI等） Claude Code Actionとは GitHub PR/IssueでClaudeを活用できるGitHub Actions » ©GLOBIS. ALL Rights Reserved. 14│
15. コードレビュー: PRで気になる箇所を質問できる 実装支援: Issueで実装方針を相談・コード生成 自動化: CI/CDパイプラインに組み込める チーム開発: メンバー全員がAIの恩恵を受けられる なぜClaude Code Actionが便利なのか 開発フローに自然に統合 » ©GLOBIS. ALL Rights Reserved. 15│
16. 1. クイックセットアップ（推奨） ターミナルで /install-github-app を実行 ガイドに従うだけで数分で完了 2. 手動セットアップ より細かい制御が必要な場合 3ステップで完了 セットアップは簡単 2つの方法から選べる » ©GLOBIS. ALL Rights Reserved. 16│
17. 2. セットアップ手順 ©GLOBIS. ALL Rights Reserved. 17│
18. # Claude Code を起動 claude # GitHub アプリをインストール /install-github-app GitHubアプリの設定とシークレットの構成を自動でガイド リポジトリの管理者権限が必要 Anthropic API直接利用者のみ クイックセットアップ（推奨） ターミナルで簡単セットアップ » ©GLOBIS. ALL Rights Reserved. 18│
19. 1. https://github.com/apps/claude にアクセス 2. Claude GitHub アプリをインストール 3. 必要な権限を付与 Contents: 読み取り・書き込み Issues: 読み取り・書き込み Pull Requests: 読み取り・書き込み 手動セットアップ: ステップ1 GitHubアプリのインストール » ©GLOBIS. ALL Rights Reserved. 19│
20. リポジトリの Settings > Secrets and variables > Actions 2つの認証方法から選択 APIキー認証: ANTHROPIC_API_KEY https://console.anthropic.com でAPIキーを取得 OAuthトークン: CLAUDE_CODE_OAUTH_TOKEN Pro/Maxユーザー向け claude setup-token コマンドで生成 手動セットアップ: ステップ2 APIキーの設定 » ©GLOBIS. ALL Rights Reserved. 20│
21. .github/workflows/claude.yml を作成 name: Claude Code Action on: issues: types: [opened, edited] issue_comment: types: [created, edited] pull_request: types: [opened, edited, synchronize] pull_request_review_comment: types: [created, edited] 手動セットアップ: ステップ3-1 ワークフローファイルの作成 » ©GLOBIS. ALL Rights Reserved. 21│
22. jobs: claude: runs-on: ubuntu-latest steps: - uses: anthropics/claude-code-action@v1 with: anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }} claude_args: "--max-turns 5" ワークフローファイルの作成（続き） » ©GLOBIS. ALL Rights Reserved. 22│
23. APIキーを直接コミットしない 必ずGitHub Secretsを使用 定期的なトークンローテーション 組織レベルのシークレット管理 PRやIssue内でAPIキーを共有しない セキュリティのベストプラクティス 絶対に守るべきこと » ©GLOBIS. ALL Rights Reserved. 23│
24. # 正しい anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }} # 絶対にやってはいけない anthropic_api_key: "sk-ant-api03-xxxxx" 正しい設定方法 » ©GLOBIS. ALL Rights Reserved. 24│
25. 3. 使い方 ©GLOBIS. ALL Rights Reserved. 25│
26. 例1: コードレビュー依頼 @claude このPR のセキュリティ面をレビューしてください 例2: 実装依頼 @claude ユーザー認証機能を実装してください テストコードも含めてお願いします 基本的な使い方 PRやIssueで@claude とメンション » ©GLOBIS. ALL Rights Reserved. 26│
27. 例3: 質問 @claude この変更が既存の機能に影響しないか確認してください 基本的な使い方（続き） » ©GLOBIS. ALL Rights Reserved. 27│
28. - uses: anthropics/claude-code-action@v1 with: anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }} claude_args: | --max-turns 10 --model claude-sonnet-4-5 主なオプション --max-turns : 最大ターン数（デフォルト: 5） --model : 使用するモデル --budget : トークン予算の制限 高度な設定 claude_argsでカスタマイズ » ©GLOBIS. ALL Rights Reserved. 28│
29. 4. 活用事例 ©GLOBIS. ALL Rights Reserved. 29│
30. Before: レビュアーが全てのPRをチェック After: Claudeが初期レビュー → 人間が最終確認 @claude 以下の観点でレビューしてください: - セキュリティ脆弱性 - パフォーマンスの問題 - コーディング規約の遵守 活用事例1: コードレビューの自動化 PRの初期レビューをClaudeに任せる » ©GLOBIS. ALL Rights Reserved. 30│
31. @claude このコンポーネントのテストコードを生成してください。 以下のケースをカバーしてください: - 正常系 - 異常系（バリデーションエラー） - エッジケース 効果 テストカバレッジの向上 開発者がビジネスロジックに集中できる 活用事例2: テストコードの生成 テストコードを自動生成して品質向上 » ©GLOBIS. ALL Rights Reserved. 31│
32. @claude このAPI のREADME を生成してください。 以下を含めてください: - エンドポイント一覧 - リクエスト/ レスポンス例 - エラーハンドリング 効果 ドキュメントの鮮度を保てる 開発者の負担軽減 活用事例3: ドキュメント生成 コードから自動でドキュメント生成 » ©GLOBIS. ALL Rights Reserved. 32│
33. @claude この関数をリファクタリングしてください: - 関数を小さく分割 - TypeScript の型安全性を向上 - テストコードも更新 効果 コード品質の継続的改善 チーム全体のコード理解度向上 活用事例4: リファクタリング支援 技術的負債の解消を効率化 » ©GLOBIS. ALL Rights Reserved. 33│
34. 5. より効果的な使い方 ©GLOBIS. ALL Rights Reserved. 34│
35. ADR（Architecture Decision Records）: アーキテクチャの意思決定記録 ポストモーテム: 過去の障害や問題の振り返り DevExチームの知見: flaky tests など繰り返し発生した作業の自動化ノウハウ レビューガイドライン: チーム固有のレビュー観点 AIレビュアーの元ネタを用意する 機械的に判断できないものの、チームで共通認識となっているもの » ©GLOBIS. ALL Rights Reserved. 35│
36. これらの情報をAIに渡すことで、より質の高いレビューが可能に RailsにおいてServiceクラスは非推奨 fatモデルは問題なし（リッチドメインモデル） カウンターキャッシュの更新漏れ 追加と削除が対になっているか テストにおいてidが衝突して落ちる 時間軸ベースのテストがflaky testsにつながる これらを観点ごとにagent化 » ADRに基づくレビュー観点 » 過去の障害から学んだ教訓 » 繰り返し指摘される項目 » ©GLOBIS. ALL Rights Reserved. 36│
37. レビューで見つかった問題は一度きりの問題ではない 同じ種類の問題が今後も発生する可能性が高い 具体的な指摘を抽象化して、AIの観点として追加する チューニング：問題を繰り返さないために 具体例から観点を抽象化する » ©GLOBIS. ALL Rights Reserved. 37│
38. 問題: ユーザーがグループから削除された時はカウンターキャッシュ更新処理が入 っていたものの、追加されたときにはカウンターキャッシュが更新されていなか った（少しぼかしてます） 今回の修正としては group.add_learners! の中で learning_path.recalculate_completed_users_count という メソッドを呼ぶ形で修正した チューニング：実際に抽象化を考えてみる例 ©GLOBIS. ALL Rights Reserved. 38│
39. Most Specific（カンニングレベル）: add_learners! / recalculate_completed_users_count 問題: テスト固有の名前で、AIが答えを覚えてしまう 汎用性が低い Medium（汎用的な英語）: create_item / update_total バランスが良い 同種の問題に適用可能 Most Abstract（日本語プレースホルダー）: メソッドA / 再計算処理 抽象度が高いので、文脈による意味付けができるのであればOK 抽象化レベルの選択 » ©GLOBIS. ALL Rights Reserved. 39│
40. 1. レビューで問題発見 → AIが見逃した問題をメモ 2. 観点の抽象化 → 具体例から汎用的なルールを作成 3. CLAUDE.mdに追加 → AIの知識ベースを更新 4. 次のレビューで検証 → AIが同種の問題を検出できるか確認 結果: チーム全体のコード品質が継続的に向上 継続的な改善サイクル AIレビュアーを育てる » ©GLOBIS. ALL Rights Reserved. 40│
41. まとめ ©GLOBIS. ALL Rights Reserved. 41│
42. 1. 簡単セットアップ: /install-github-app で数分 2. 安全な運用: GitHub Secretsでセキュアに 3. 柔軟な活用: レビュー、実装、ドキュメント生成など 4. チーム開発: メンバー全員がAIを活用可能 claude /install-github-app まとめ Claude Code Actionで開発効率を向上 » 今日から始められる！ » ©GLOBIS. ALL Rights Reserved. 42│
43. 公式ドキュメント: https://code.claude.com/docs GitHubリポジトリ: https://github.com/anthropics/claude-code-action Claude Console: https://console.anthropic.com ベストプラクティス: https://www.anthropic.com/engineering/claude-code- best-practices 参考リソース ©GLOBIS. ALL Rights Reserved. 43│
44. ご清聴ありがとうございました ©GLOBIS. ALL Rights Reserved.