今回やること
この記事では、Claude Codeに小さな修正を依頼し、調査、修正、テスト、差分確認までの流れを練習します。
最初の実演では、認証・決済・DB削除のような危険領域ではなく、小さな表示やテスト修正から始めます。
前提条件
- Claude Codeを起動できる
- Git管理された学習用プロジェクトがある
- テストまたはビルドコマンドがわかる
- 作業前に
git statusが確認できる
Step 1: 作業前の状態を見る
ターミナルで差分がないか確認します。
git status
未コミットの変更がある場合は、今回の作業と関係あるか確認します。
Step 2: 調査だけ依頼する
まず編集させず、対象を調べてもらいます。
ボタンのラベルを「送信」から「保存」に変えたいです。
まず関連ファイルを調査して、変更候補を説明してください。まだ編集しないでください。
ここで、AIがどのファイルを見たか、説明が妥当か確認します。
Step 3: 小さく修正を依頼する
調査結果が妥当なら、範囲を絞って修正させます。
その方針で、ラベル変更だけ実施してください。関係ないリファクタはしないでください。
AIに修正を依頼するときは、関係ないリファクタをしないよう明示します。
Step 4: テストやビルドを実行する
プロジェクトに合わせて、テストやビルドを実行させます。
変更後に必要なテストまたはビルドを実行してください。失敗した場合は原因を説明してください。
手元でも必要に応じて確認します。
npm test
または、プロジェクトに合うコマンドを使います。
npm run build
Step 5: 差分を確認する
AIの変更を採用する前に、差分を見ます。
git diff
確認する観点は次の通りです。
| 観点 | 見ること |
|---|---|
| 変更範囲 | 依頼したファイルだけか |
| 余計な修正 | フォーマット以外の変更が混ざっていないか |
| テスト | 実行結果が説明されているか |
| 文言 | 目的通り変わっているか |
Step 6: 必要なら修正させる
差分に余計な変更があれば、具体的に戻します。
ラベル変更以外の差分は不要です。余計な変更を戻してください。
よくあるエラー
| エラー | よくある原因 | 確認すること |
|---|---|---|
| 変更範囲が広い | 指示が曖昧 | 「この修正だけ」と明示する |
| テストを実行していない | 検証指示がない | 実行コマンドを伝える |
| ビルドが失敗する | 既存不具合か修正ミス | エラー箇所を分けて確認 |
| どこが変わったかわからない | 差分未確認 | git diff を見る |
まとめ
Claude Codeで最初に実践するなら、小さな表示変更やテスト修正が安全です。調査だけ依頼し、方針を確認し、範囲を絞って修正し、テストやビルドを実行し、最後に git diff で人間が確認します。