Chapter 24: AI でコードを読む
既存コードベースの理解とドキュメント生成
24.1 知らないコードベースの理解
新しいプロジェクトに参加したとき、巨大なコードベースを短時間で理解するのは大変な作業です。 AI を使うと、コードの全体像や特定の機能を素早く把握できます。
AI を使ったコードリーディングの流れ
最初にすること:全体像を掴む
Claude Code を使う場合、まずプロジェクトディレクトリで Claude Code を起動します。
cd /path/to/unknown-project
claudeそして以下のように質問します。
このプロジェクトの概要を教えてください。
- 何をするシステムか
- 使われている技術スタック
- ディレクトリ構造の説明
- エントリーポイントはどこかClaude Code はプロジェクトのファイルを調査して、全体像をまとめてくれます。
TODO: あとで実際のスクリーンショットに置き換え - Claude Code がプロジェクト構造を調査して説明している様子
Copilot Chat を使う場合
VS Code で Copilot Chat を開き、ワークスペース全体を参照させます。
@workspace このプロジェクトはどのような構造になっていますか?
主要なモジュールとその役割を教えてください。@workspace をつけることで、Copilot がワークスペース全体を参照します。
24.2 関数・クラスの説明を求める
特定のコードが何をしているかわからないとき、AI に説明を求めます。
コード選択から説明を求める(Copilot)
- VS Code でコードを選択
Ctrl+Iでインラインチャットを開く- 「このコードを日本語で説明してください」と入力
// 例: 読んでいてよくわからない関数がある場合
function processTransactions(
transactions: Transaction[],
config: ProcessConfig
): ProcessResult {
const grouped = transactions.reduce((acc, tx) => {
const key = `${tx.userId}-${tx.type}`;
if (!acc[key]) acc[key] = [];
acc[key].push(tx);
return acc;
}, {} as Record<string, Transaction[]>);
// ... 複雑な処理が続く
}Copilot への質問例:
この processTransactions 関数が何をしているか、
ステップバイステップで日本語で説明してください。
特に grouped の作り方と、その後どう使われるかを中心に。Claude Code で詳細に調査する
Claude Code なら、関数が呼び出している他の関数や、どこから呼ばれているかも追跡できます。
processTransactions 関数について教えてください。
1. この関数が何をするか
2. 引数の型 ProcessConfig はどのように定義されているか
3. この関数はどこから呼ばれているか
4. 想定されるユースケースは何か24.3 依存関係の把握
複雑なシステムでは、モジュール間の依存関係を把握することが重要です。
依存関係の調査
# Claude Code への質問例
UserService クラスの依存関係を教えてください。
- このクラスが使っているサービス・リポジトリ
- このクラスを使っているファイル
- 循環依存はないかデータの流れを追う
特定のデータがどこで生成されてどこで消費されるかを追跡します。
ユーザーが注文を確定してから、注文データが
データベースに保存されるまでの処理の流れを
順番に説明してください。
関連するすべてのファイル・関数を含めてください。上記のような図を AI に生成してもらうことも可能です。
24.4 処理フローの可視化(Mermaid 図の生成)
AI はコードから Mermaid 形式のフロー図を生成できます。 複雑な処理の流れを視覚化するのに便利です。
Mermaid 図を生成してもらう
src/services/AuthService.ts のログインフローを
Mermaid のシーケンス図で表現してください。
正常系とエラー系(パスワード不一致、アカウントロックなど)
を含めてください。生成例(Claude の出力):
```mermaid
sequenceDiagram
participant User
participant AuthService
participant UserRepo
participant TokenService
User->>AuthService: login(email, password)
AuthService->>UserRepo: findByEmail(email)
alt ユーザーが存在しない
UserRepo-->>AuthService: null
AuthService-->>User: AuthError("ユーザーが見つかりません")
else ユーザーが存在する
UserRepo-->>AuthService: User
AuthService->>AuthService: verifyPassword(password, hash)
alt パスワード不一致
AuthService-->>User: AuthError("パスワードが違います")
else 認証成功
AuthService->>TokenService: generateTokens(user)
TokenService-->>AuthService: { access, refresh }
AuthService-->>User: { token, refreshToken }
end
end
```状態遷移図の生成
注文の状態管理(pending → confirmed → shipped → delivered)を
Mermaid の状態遷移図で表現してください。24.5 ドキュメントの自動生成
既存コードにドキュメントが不足している場合、AI で自動生成できます。
JSDoc コメントの生成(TypeScript/JavaScript)
// ドキュメントがない関数
function calculateShippingCost(
weight: number,
distance: number,
expedited: boolean
): number {
const base = weight * 0.5 + distance * 0.1;
return expedited ? base * 1.5 : base;
}Copilot Chat や Claude Code に以下を依頼します。
この calculateShippingCost 関数に JSDoc コメントを追加してください。
パラメータ・戻り値・使用例を含めてください。生成される結果の例:
/**
* 配送コストを計算する。
*
* 基本コストは重量と距離から計算され、
* 速達オプションが有効な場合は 1.5 倍になる。
*
* @param weight - 荷物の重量(kg)
* @param distance - 配送距離(km)
* @param expedited - 速達オプション(true の場合 1.5 倍)
* @returns 配送コスト(円)
*
* @example
* // 10kg の荷物を 100km 先に通常配送
* calculateShippingCost(10, 100, false); // → 15
*
* // 10kg の荷物を 100km 先に速達配送
* calculateShippingCost(10, 100, true); // → 22.5
*/
function calculateShippingCost(
weight: number,
distance: number,
expedited: boolean
): number {
const base = weight * 0.5 + distance * 0.1;
return expedited ? base * 1.5 : base;
}README の生成
プロジェクト全体の README を生成することもできます。
このプロジェクトの README.md を生成してください。
以下を含めてください:
- プロジェクトの概要
- セットアップ手順
- よく使うコマンド
- API の概要(主要なエンドポイント)ドキュメント生成のポイント
- 生成後は必ず確認: AI が生成するドキュメントが正確かを確認する
- 実際の動作で検証: 「使用例」が実際に動くか確認する
- 段階的に生成: 全ファイルを一度に依頼するより、重要なファイルから順番に進める
- 既存のスタイルを踏襲: 「既存のドキュメントスタイルに合わせて」と伝える
まとめ
AI を使ったコードリーディングの活用シーン:
| 場面 | AI への依頼 |
|---|---|
| プロジェクト参加初日 | 全体構造の説明、主要コンポーネントの役割 |
| 特定のバグを調査 | 処理フローの追跡、副作用の調査 |
| 複雑なロジックの理解 | ステップバイステップの説明 |
| レビュー準備 | 変更の影響範囲の調査 |
| ドキュメント整備 | JSDoc・README の生成 |
AI はコードを「読む」作業を大幅に効率化しますが、最終的な理解の確認は自分で行いましょう。 AI の説明が正しいかを、実際のコードと照らし合わせる習慣が大切です。