Chapter 27: Claude Code で機能を実装する
計画→実装→検証のワークフロー
Claude Code はターミナルから使うエージェント型の AI です。コードを読み・書き・実行しながら、大きな機能を自律的に実装できます。この章では Claude Code の強みを活かした実装フローを学びます。
27.1 計画 → 実装 → 検証のワークフロー
Claude Code の最大の特徴は、単なるコード生成ではなく「エージェントとして自律的に動く」点です。ファイルの読み込み、コマンドの実行、テストの確認まで一気通貫で行えます。
基本ワークフロー
実際のセッション例
$ claude
> 以下の機能を実装してほしい:
ユーザーが商品をお気に入りに追加・削除できる機能。
- エンドポイント: POST /api/favorites/:productId (追加)
- エンドポイント: DELETE /api/favorites/:productId (削除)
- エンドポイント: GET /api/favorites (一覧取得)
- ログイン済みユーザーのみ使用可能
- 既存の Express + Prisma の構成に合わせること
- テストも書くことClaude Code は以下のように動きます。
- 既存の
src/ディレクトリ構造をスキャン - 既存の Controller/Service/Repository パターンを読み込み
- Prisma スキーマを確認し、
Favoriteモデルを追加 - 各レイヤーのファイルを実装
npm testを実行してテストが通るか確認- 失敗したテストを自動修正
TODO: あとで実際のスクリーンショットに置き換え - Claude Code がファイルを読み込み実装している様子(ターミナル)
計画を先に確認する
実装前に計画を確認させる習慣をつけましょう。
まず実装計画を教えてほしい。コードは書かないでよい。
どのファイルを変更・追加するか、どんな設計にするかを先に説明してほしい。これにより、大きな実装ミスを防げます。
27.2 Issue 駆動開発との組み合わせ
GitHub Issues と Claude Code を組み合わせることで、タスク管理と実装を統合できます。
Issue から実装までのフロー
Claude Code への指示例:
以下の GitHub Issue を実装してほしい:
https://github.com/myorg/myapp/issues/42
Issue の内容に沿って実装し、最後に PR を作成してほしい。
コミットメッセージに Issue 番号を含めること。Claude Code は gh コマンドを使って Issue の詳細を取得し、要件を把握した上で実装を進めます。
ブランチ命名規則の指定
実装前に以下の手順を踏んでほしい:
1. git checkout -b feat/42-add-favorites
2. 実装する
3. コミットメッセージは "feat: add favorites feature (#42)" の形式にする
4. gh pr create で PR を作成する27.3 サブエージェントで調査を並列化
Claude Code は Task ツールを使い、サブエージェントに調査を並列で委託できます。大きな機能を実装する前の調査フェーズで特に有効です。
並列調査のパターン
指示例:
以下を並列で調査してから実装計画を立ててほしい:
1. src/auth/ を読んで認証の仕組みを把握する
2. prisma/schema.prisma を読んでデータモデルを把握する
3. src/controllers/ の既存コントローラーのパターンを把握する
調査が終わったら、お気に入り機能の実装計画を提示してほしい。27.4 複雑な機能の分割実装
大きな機能は分割して実装するとリスクが減ります。Claude Code に明示的に分割を指示しましょう。
分割実装の例: 通知システムの追加
段階 1: データモデルのみ
まず Prisma スキーマに Notification モデルを追加するだけにしてほしい。
マイグレーションも実行してテーブルが作成されることを確認する。
この段階ではアプリケーションコードは変更しない。段階 2: リポジトリ層
次に NotificationRepository を実装してほしい。
CRUD 操作と、未読通知を取得するメソッドを含める。
単体テストも書くこと。段階 3: サービス層
NotificationService を実装してほしい。
- 通知を作成する
- ユーザーに通知を送る (現時点では DB 保存のみ、メール送信は後で)
- 既読にする段階 4: API エンドポイント
最後に通知の API エンドポイントを実装してほしい。
GET /api/notifications (未読のみ)
PATCH /api/notifications/:id/read (既読にする)
結合テストも書くこと。段階ごとにテストを確認する
# 各段階が終わるたびに実行
npm test
# カバレッジも確認
npm run test:coverage27.5 ハンズオン: REST API を作る
課題: ブログ API を一から実装する
Claude Code を使って、以下の仕様の REST API を実装します。
仕様:
- 記事 (Article) の CRUD
- カテゴリー (Category) での絞り込み
- JWT 認証
- PostgreSQL + Prisma
- Express.js + TypeScript
Step 1: 要件を渡す
以下の仕様で REST API を実装してほしい:
[上記の仕様をそのまま貼り付ける]
まず実装計画を立てて、承認を得てから実装を始めてほしい。
実装順序の提案もしてほしい。Step 2: 計画を確認する
Claude が提示した計画を確認します。変更したい点があれば指示します。
計画の Step 3 で認証ミドルウェアを先に実装するよう変更してほしい。
また、エラーハンドリングは最初から共通クラスを使うようにしてほしい。Step 3: 実装を進める
計画を承認したら実装を開始します。
計画で合意できた。実装を始めてほしい。
各ステップが完了したら報告してほしい。Step 4: テストを確認する
npm test
# 全テストが通ることを確認
npm run test:coverage
# カバレッジが 80% 以上であることを確認Step 5: 動作確認
npm run dev
# 別ターミナルで動作確認
curl -X POST http://localhost:3000/api/auth/register \
-H "Content-Type: application/json" \
-d '{"email":"test@example.com","password":"password123"}'Claude Code 活用のチェックリスト
- 実装前に計画を確認したか
- 各段階でテストが通ることを確認したか
- コミットは小さい単位で行ったか
- 既存コードのパターンに沿っているか
- エラーハンドリングが適切か
- 型の安全性が保たれているか
まとめ
Claude Code を使った実装のポイントをまとめます。
| ポイント | 実践方法 |
|---|---|
| 計画を先に確認する | 「計画だけ教えてほしい」と明示する |
| Issue 駆動で追跡可能にする | GitHub Issues と紐付けて実装する |
| 並列調査を活用する | 大きな機能の前に調査を委託する |
| 段階的に実装する | 大きな変更は分割してリスクを下げる |
| 各段階でテストを確認する | 壊れたコードが積み重ならないようにする |
Claude Code は「AI に実装をお任せ」するツールではなく、「AI と一緒に実装する」ツールです。計画・確認・修正のサイクルを回しながら使うことで、品質と速度を両立できます。