Claude Code攻略#Claude Code#Plan Mode#設計
Plan Mode完全ガイド【Claude Codeの設計力を最大化】
Claude CodeのPlan Modeを使って、大規模な開発タスクを効率的に進める方法。Explore→Plan→Implement→Commitの4フェーズワークフローを解説。
Plan Modeとは
Plan Modeは、Claude Codeが「実装」ではなく「設計・計画」に集中するモードです。
通常モードではClaudeはすぐにコードを書き始めますが、Plan Modeでは:
- ファイルを読んで理解する
- 方針を考える
- 計画を立てる
という作業に専念します。
なぜPlan Modeを使うのか
問題: いきなり実装すると失敗する
大きなタスクを「作って」と指示すると、Claudeは:
- 全体像を把握せずに実装を始める
- 途中で方針変更が必要になる
- 前に書いたコードを書き直す
- コンテキストを消費しまくる
- 結局うまくいかない
解決: 先に設計、後で実装
Plan Modeを使うと:
- Explore: まずプロジェクトを調査
- Plan: 設計・計画を立てる
- Implement: 計画に従って実装
- Commit: 変更をコミット
このフェーズ分離により、無駄な作業が激減します。
Plan Modeの使い方
Plan Modeに入る
/plan
または、タスクの説明に「まず計画を立てて」と含める:
ユーザー認証機能を追加したい。まず計画を立てて。
Plan Modeから出る
計画が完成したら:
/implement
または Claudeに「実装を始めて」と指示。
4フェーズワークフロー
Phase 1: Explore(調査)
目的: プロジェクトの現状を理解する
/plan
このプロジェクトの認証周りのコードを調査して。
- どんな認証方式が使われているか
- どのファイルが関係しているか
- 既存のユーザーモデルはどうなっているか
Claudeは:
- 関連ファイルを読む
- 構造を理解する
- 現状を報告する
この時点ではコードを書かせない。
Phase 2: Plan(計画)
目的: 実装方針を決める
調査結果を踏まえて、OAuth認証を追加する計画を立てて。
- 変更が必要なファイル
- 追加が必要なファイル
- 実装の順序
- 注意点
Claudeは:
- 実装計画を提案
- ファイル構成を設計
- 手順を整理
計画を確認・修正してから次へ進む。
Phase 3: Implement(実装)
目的: 計画に従ってコードを書く
/implement
計画通りに実装を始めて。
Claudeは:
- 計画に従ってファイルを作成
- コードを実装
- テストを実行
計画があるので迷わず実装できる。
Phase 4: Commit(コミット)
目的: 変更を記録する
変更をコミットして。コミットメッセージは日本語で。
Claudeは:
- 変更を確認
- 適切なコミットメッセージを作成
- コミット実行
実践例: 決済機能の追加
Step 1: Plan Modeに入る
claude
/plan
Step 2: 調査
Stripeを使った決済機能を追加したい。
まず、このプロジェクトの現状を調査して:
- 既存の課金関連コードはあるか
- ユーザーモデルにどんなフィールドがあるか
- 環境変数の管理方法
Claudeの応答例:
調査結果:
1. 課金関連コードは存在しません
2. Userモデルには id, email, name, createdAt があります
3. 環境変数は .env.local で管理しています
決済機能を追加するにあたり、以下が必要そうです:
- Userモデルに stripeCustomerId を追加
- 新規ファイル: src/lib/stripe.ts
- 新規API: /api/checkout, /api/webhook
Step 3: 計画
では、Stripe決済機能の実装計画を立てて。
- サブスクリプション型(月額課金)
- 料金プランは Basic / Pro の2つ
- Webhookで支払い状態を同期
Claudeの応答例:
## 実装計画
### 1. 準備作業
- [ ] Stripeアカウント設定の確認
- [ ] 環境変数の追加(STRIPE_SECRET_KEY, STRIPE_WEBHOOK_SECRET)
### 2. データベース変更
- [ ] Userモデルに追加: stripeCustomerId, subscriptionStatus, plan
### 3. 新規ファイル作成
- [ ] src/lib/stripe.ts - Stripeクライアント初期化
- [ ] src/lib/subscription.ts - サブスクリプション管理ロジック
### 4. API作成
- [ ] POST /api/checkout - Checkout Session作成
- [ ] POST /api/webhook - Stripe Webhook処理
- [ ] GET /api/subscription - 現在のプラン取得
### 5. UI
- [ ] PricingPage - 料金プラン表示
- [ ] AccountPage - プラン管理
### 注意点
- Webhookは冪等性を確保
- 本番環境では署名検証を必須に
Step 4: 計画の確認
計画を確認しました。以下を修正して:
- Free プランも追加
- AccountPageは既存のものを拡張
Step 5: 実装開始
/implement
計画に従って実装を開始して。まずデータベース変更から。
Step 6: 段階的に実装
データベース変更完了。次はStripeクライアントの初期化を実装して。
完了。次はAPIを実装して。
Step 7: コミット
一通り完了。変更をコミットして。
Plan Modeを使うべきケース
| ケース | Plan Mode | 理由 |
|---|---|---|
| 新機能の追加 | ✅ 使う | 設計が重要 |
| 大規模リファクタリング | ✅ 使う | 影響範囲が広い |
| バグ修正(原因不明) | ✅ 使う | まず調査が必要 |
| typo修正 | ❌ 不要 | 単純作業 |
| 1ファイルの小修正 | ❌ 不要 | 設計不要 |
| ログ追加 | ❌ 不要 | 単純作業 |
目安: 3ファイル以上に影響する作業はPlan Modeを使う
よくある間違い
間違い1: 計画なしで大規模タスクを始める
❌ "OAuth認証を追加して"(いきなり実装)
✅ "/plan OAuth認証を追加したい"(まず計画)
間違い2: 計画を確認せずに実装開始
❌ Claude: "計画を立てました" → あなた: "実装して"
✅ Claude: "計画を立てました" → あなた: "〇〇を修正して。それで実装開始"
計画をレビューして、必要なら修正を依頼してから実装。
間違い3: Plan Modeで実装させようとする
❌ /plan "ログイン機能を作って"(実装を期待)
✅ /plan "ログイン機能の実装計画を立てて"(計画を期待)
Plan Modeは「計画モード」。実装は /implement で。
次のステップ
Plan Modeの使い方をマスターしました!
これで Claude Code の入門編は完了です。次は実践編として、実際にアプリを作るチュートリアルに進みましょう。
→ 30分でToDoアプリを作る(Claude Code版)
まとめ
- Plan Mode = 設計・計画に集中するモード
/planで開始、/implementで実装へ- 4フェーズ: Explore → Plan → Implement → Commit
- 3ファイル以上に影響する作業で使う
- 計画をレビューしてから実装開始
- 大規模タスクの成功率が大幅に上がる
参考文献・引用元
- [1]Plan Mode - Claude Code- Anthropic