Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【Claude Code】基本操作をわかりやすく解説

AIプログラミングツール「Claude Code」の基本を分かりやすく解説します。Windows環境でWSL2やVS Codeを使った開発環境の準備から、AIへの効果的な指示の出し方、生成されたコードの確認方法、修正サイクルまで、システムエンジニアを目指す初心者が知っておくべきClaude Codeの活用法を習得できます。

作成日: 更新日:

開発環境

  • OS: Windows10(WSL2 / Ubuntu)
  • Editor: Visual Studio Code
  • Node.js: v22.22.2
  • claude-code: 2.1.118

Claude Code の基本サイクル

Claude Code は、システム開発を行う際に、AIと対話しながらコードを作成したり、修正したりするためのツールです。このツールの基本的な使い方は、AIにチャット形式で指示を出し、AIが提案したコードの変更点(差分)を確認して、問題なければその変更を採用するという流れになります。

1claude を起動
2  ↓
3指示を出す(日本語でOK)
4  ↓
5差分(diff)が表示される
6  ↓
7y で受け入れ / n で拒否
8  ↓
9「直して」で修正を回す

このサイクルについて、一つずつ詳しく見ていきましょう。

まず、「claude を起動」は、Claude Code のツールを使い始めることを意味します。開発環境で専用のコマンドなどを実行して、Claude Code が利用できる状態にします。

次に、「指示を出す(日本語でOK)」では、AIに対して、どんなコードを書いてほしいか、どこを修正してほしいかなどを、日本語で具体的に伝えます。プログラミングの専門的な知識がまだ少ない場合でも、日本語でやりたいことを伝えるだけでAIがコードを生成してくれるため、初心者の方にも使いやすい点です。

指示を出すと、AIがその指示に基づいたコードを生成し、「差分(diff)が表示される」というステップに入ります。ここで表示される「差分(diff)」とは、AIが変更を提案したコードが、元のコードと比べてどこがどのように変わったのかを具体的に示す情報のことです。この差分を見ることで、AIの提案内容を正確に把握することができます。

差分を確認したら、「y で受け入れ / n で拒否」の選択をします。もしAIの提案したコードの変更点が期待通りで問題なければ、「y」(Yes)を入力して、その変更をプロジェクトに取り入れます。もし期待と違っていたり、気に入らない点があれば、「n」(No)を入力して、その変更を拒否することができます。

もし一度提案を拒否したり、さらに改善してほしい点がある場合は、「「直して」で修正を回す」というステップで、AIに具体的な修正指示を出します。例えば、「この部分を別の方法で実装してほしい」や「〇〇の機能を追加してほしい」といったように伝えると、AIは再度指示に基づいてコードを修正し、新しい差分を提示してくれます。このように、AIとの対話を繰り返すことで、より完成度の高いコードを作成していくことができます。

この一連のサイクルを通じて、AIはあなたのプログラミング作業を強力にサポートしてくれるツールとなります。

公式ドキュメント: https://code.claude.com/docs/ja/quickstart

claude を起動する

Claude Codeというツールを使い始める際は、まず作業を行いたいプロジェクトのフォルダへ移動してから起動します。これは、Claude Codeが「今いるフォルダ(カレントディレクトリ)」を、作業の対象となるプロジェクトとして認識するためです。

たとえば、/Users/you/dev/demo-app というフォルダで作業をしたい場合、以下のようにコマンドを実行します。

1cd ~/dev/demo-app
2claude

上記のコマンドについて説明します。 まず cd コマンドは「Change Directory」の略で、指定したフォルダに移動する際に使用します。~/dev/demo-app は、移動したいフォルダの場所を示しています。~ は通常、自分のユーザーのホームディレクトリを指します。 フォルダ移動が完了したら、次に claude と入力してClaude Codeを起動します。

コマンドを実行すると、以下のような出力結果が表示されます。

出力結果
1╭──────────────────────────────────────────╮
2│ ✻ Welcome to Claude Code                  │
3│   cwd: /Users/you/dev/demo-app            │
4╰──────────────────────────────────────────╯
5>

この出力は、Claude Codeが正常に起動し、現在の作業ディレクトリ(cwd は "current working directory" の略で、「現在の作業フォルダ」という意味です)が /Users/you/dev/demo-app であることを示しています。これにより、Claude Codeはこのフォルダ内のファイルやコードを基に、あなたをサポートします。

注意: 空のフォルダでも動くが、初回は「このフォルダで作業していい?」と確認が出ることがある。Yes で進める。

初めてClaude Codeを特定のフォルダで起動する際に、「このフォルダで作業を進めても良いか」という確認メッセージが表示されることがあります。これは、Claude Codeがあなたの許可なくファイルにアクセスしたり変更したりしないようにするための安全対策です。このメッセージが表示された場合は、Yes と入力してEnterキーを押すことで、作業を開始できます。

最初の指示を出す

まずはAIに指示を出してコードを作成する。

プロンプトとは、コンピューターに対して命令を入力する場所のことです。通常、プログラムを作成する際には専門的なコマンドや記述方法を学ぶ必要がありますが、この場合は難しく考える必要はありません。普段私たちが日本語で会話するのと同じように、AIに対して自然な言葉で作成してほしい内容を依頼できます。

例えば、以下のように具体的な指示を出してみましょう。

1hello.js を作って、実行すると "Hello Claude Code" と表示されるようにして

この指示は、「hello.jsというファイルを作成し、そのファイルを実行したときに画面に"Hello Claude Code"という文字が表示されるようにしてください」という意味です。非常にシンプルで分かりやすい指示ですね。

この指示に対して、AI(Claude)はすぐにはファイルを作成しません。まず、指示をどのように解釈し、具体的に何をするのかを説明してくれます。そして、その作業を実行しても良いかどうかの許可を求めてきます。

ただし、この確認が表示されるかどうかは「権限モード」によって変わります。Pro / Max / Team プランのターミナルセッションでは Auto モードが開始時の権限モードになり、多くのファイル編集やコマンド実行が確認なしで進みます。その他のプランでは Manual モードが開始時の権限モードです。本記事は、確認が表示される Manual モードを前提にしています。権限モードはセッション中に Shift+Tab で切り替えられます。

出力結果
1● hello.js を新規作成します。
2
3  hello.js
4  + console.log("Hello Claude Code");
5
6  Create file? (y/n)

上記の出力結果について説明します。 まず、「● hello.js を新規作成します。」という表示で、AIがhello.jsというファイルを新しく作成しようとしていることを教えてくれます。 次に続く「+ console.log("Hello Claude Code");」という部分は、hello.jsファイルの中に具体的にどのようなコードが書き込まれるのかを示しています。このコードは、JavaScriptというプログラミング言語で「"Hello Claude Code"という文字列をコンソール(画面)に表示する」という意味です。 最後に「Create file? (y/n)」と表示され、AIが提案した内容でファイルを作成してよいか、最終的な確認を求めています。「y」はYes(はい)、「n」はNo(いいえ)を意味します。

ここでyを押すと、AIが提案した通りにファイルが作成されます。

注意: ここで出る差分(+ の行)が「これから追加される内容」。中身を読んでからyを押すのが基本習慣。

この「注意」は非常に重要です。出力結果に表示される「+」の記号が付いた行は、これからファイルに追加される内容、つまり、AIが作成しようとしているコードそのものを示しています。システムエンジニアとして作業を進める上では、AIが提案する内容を必ず確認し、意図しないコードや誤ったコードが含まれていないかをチェックする習慣を身につけることが大切です。内容をしっかり確認してから「y」と入力して許可することで、予期せぬ問題を防ぎ、安全に作業を進めることができます。

生成された差分の見方

Claude の編集はすべて「差分(diff)」で表示されます。ここでいう「差分(diff)」とは、ファイルやコードが以前の状態からどのように変更されたのかを、わかりやすく示す機能のことです。この機能によって、Claude がコードに加えた変更点をすぐに把握できます。

差分の具体的な表示方法は以下の通りです。

  • +(緑)… 新しく追加された行を示します。
  • -(赤)… 削除された行を示します。
  • 色なし … 変更がなかった行、または変更の前後の行を示します。

このように差分を確認することで、Claude がどのような意図でコードを修正したのかを理解するのに役立ちます。

次に、作成したファイルを実際に動かして、その動作を確認する方法について説明します。 ! をコマンドの先頭に付けると、その場でシェルコマンドを実行できます。「シェルコマンド」とは、コンピューターに特定の作業を指示するための命令文のことです。この機能を使うことで、作成したプログラムを直接実行し、すぐに結果を確認できます。

例えば、hello.js というJavaScriptファイルをNode.jsという実行環境で動かす場合は、以下のコマンドを入力します。

1!node hello.js

このコマンドは、「Node.js を使って hello.js ファイルを実行してください」という意味になります。

上記のコマンドを実行すると、以下のようにプログラムの出力結果が表示されます。

出力結果
1Hello Claude Code

このように、差分で変更点を確認し、実際にコードを実行して動作を検証することで、システム開発の学習や作業を効率的に進めることができます。

「直して」で修正を回す

AIを活用したプログラミングでは、一度で完璧なコードを作成しようとせず、AIとの対話を通じて少しずつ修正を重ねていく方法が効果的です。これは、人間同士が共同で作業を進めるように、AIに具体的な指示を出し、その結果を確認しながら、理想のコードに近づけていく開発スタイルです。

例えば、プログラムの表示内容を変更したい場合、AIに対して以下のように指示を出します。

1表示するメッセージを「Hello from Claude」に変えて

この指示を受けて、AIはコードの修正案を提示します。その際、変更前のコードと変更後のコードの差分をわかりやすく表示し、ユーザーが内容を確認できるようにします。

出力結果
1● hello.js を編集します。
2
3  hello.js
4  - console.log("Hello Claude Code");
5  + console.log("Hello from Claude");
6
7  Apply this change? (y/n)

上記の出力結果では、「hello.js」というファイル内のコードが変更されています。- の行が削除されるコード、+ の行が追加されるコードを示しており、console.log("Hello Claude Code"); が console.log("Hello from Claude"); に変わることを意味します。

提示された修正案に対して、以下のいずれかの対応を取ることができます。

  • 意図と違ったら n で拒否 → 言い直せばよい もしAIが提案した修正内容が自分の意図と異なっていたり、改善の余地があると感じたりした場合は、n を入力して変更を拒否します。その後、さらに具体的な指示をAIに与え直すことで、より意図に沿った修正案を再度生成させることができます。

  • 良ければ y 提示された修正内容が適切であり、問題ないと判断した場合は、y を入力して変更を承認します。これにより、AIが提案した修正が実際のコードに適用され、ファイルが更新されます。

うまく指示を出すコツ

システムエンジニアとして仕事を進める上で、他の人に作業を依頼したり、あるいは自分自身の作業計画を立てたりする際に、「指示」をうまく出すことは非常に重要です。明確で分かりやすい指示は、作業の効率を高め、手戻りを減らすことにつながります。ここでは、指示を出す際の重要なコツを3つご紹介します。

コツ悪い例良い例
具体的に「いい感じにして」「関数名を greet にして」
分割する「アプリ全部作って」「まず入力フォームだけ作って」
確認を挟むいきなり大改修「まず方針だけ教えて」→実装

1. 具体的に指示を出す

指示は、できるだけ具体的に伝えることが大切です。曖昧な指示は、受け手がどのように解釈すればよいか迷ってしまい、結果として意図と異なるものができあがってしまう可能性が高まります。

  • 悪い例:「いい感じにして」
    • この指示では、「いい感じ」が何を指すのか、人によって基準が異なります。見た目のことなのか、機能のことなのか、スピードのことなのか、受け手は判断できません。
  • 良い例:「関数名を greet にして」
    • このように具体的に指示することで、受け手は迷うことなく正確な作業に取りかかることができます。どのような関数を作成するのかという意図も、この名前から伝わりやすくなります。

システム開発においては、誤解なく正確に情報が伝わることで、無駄なやり取りや手戻りが減り、効率的にプロジェクトを進めることができます。

2. 作業を細かく分割して指示を出す

大きなタスクを一度に指示すると、受け手はどこから手をつけてよいか分からず、作業の全体像も掴みにくくなります。タスクを小さな単位に分割することで、作業の見通しが良くなり、進捗管理もしやすくなります。

  • 悪い例:「アプリ全部作って」
    • アプリ全体を作成するには多くの時間と労力がかかります。この指示だけでは、具体的な手順や優先順位が不明確で、どこから着手すべきか判断が難しいです。
  • 良い例:「まず入力フォームだけ作って」
    • このように、まずは一部の機能から始めるように指示することで、受け手は目の前の具体的なタスクに集中できます。一つの機能が完成するごとに、全体の進捗が確認しやすくなります。

タスクを分割することは、作業の難易度を下げ、一つ一つの工程を確実にクリアしていく上で非常に有効な方法です。

3. 要所で確認を挟む

作業が大きな変更を伴う場合や、方針が複数考えられる場合は、途中で確認の機会を設けることが重要です。これにより、方向性の間違いを早期に発見し、手戻りのリスクを最小限に抑えることができます。

  • 悪い例:いきなり大改修
    • 完成してから「思っていたものと違う」となると、それまでの努力が無駄になってしまいます。大きな改修を行う前に、方針の合意が必要です。
  • 良い例:「まず方針だけ教えて」→実装
    • 最初に「どのような方針で進めるか」という計画を共有し、合意を得てから実装に進むことで、方向性のズレを防ぐことができます。これにより、無駄な作業を減らし、効率的に最終目標に到達できます。

注意: 迷ったら「まず計画だけ立てて、実装はまだしないで」と頼むと暴走を防げる。

この「注意」の通り、もし指示を出す側が迷っている場合や、受け手が「このまま進めて大丈夫だろうか」と感じた場合は、まず具体的な実装に入る前に、計画や方針について一度立ち止まって話し合う時間を持つことが大切です。これにより、後から大きな手直しが発生する「暴走」を防ぎ、確実に目標達成へとつながります。

おわりに

本記事では、Claude Codeを活用するための開発環境の準備から基本操作、そしてAIとの効果的な開発サイクルを学びました。AIへの指示出しから、生成されたコードの差分を正確に確認し、yで受け入れ、nで拒否しながら「直して」と指示して修正を重ねることが大切です。特に、「具体的に」「分割して」「確認を挟みながら」という指示のコツを実践することで、AIをあなたの強力なパートナーとして最大限に活用できます。これらの基本を習得し、Claude Codeを使いこなすことで、皆さんのプログラミング学習や開発作業はより効率的でスムーズになるでしょう。

関連コンテンツ

関連IT用語