注目キーワード

Claude Codeの使い方｜今からでもわかる基本操作・コマンド・便利機能

  • 2026.08.14
       
Claude Codeの使い方｜基本操作・コマンドをわかりやすく解説

AIを活用した開発支援ツールには、コードの生成や補完を行うものだけでなく、開発者の代わりにファイルを操作したり、コマンドを実行したりできるものも登場しています。
その中の代表的なツールの1つが、Anthropicが提供するAIエージェント型のコーディングツールである 「Claude Code」 です。

この記事では、シンプルなユーザー登録フォームを題材に、Claude Codeへ「メールアドレスの入力チェックを追加する」という改修を実際に依頼していきます。
指示する→変更内容を確認する→承認する→テストするという基本的な流れを、実際の画面を見ながら体験したうえで、同じプロジェクトを使ってコマンドや便利機能もあわせて紹介します。

なお、本記事ではClaude Codeの具体的な使い方に絞って解説します。
特徴やできること、料金などの概要から知りたい方は、以下の記事もあわせてご覧ください。

▼こちらもチェック▼
【Claude Codeとは】AIコーディングで業務を効率化する Claude Codeとは？できること・料金・始め方を初心者向けに解説 ▶
目次

Claude Codeを導入する

Claude Codeを使い始めるには、インストールとログインの2つの手順が必要です。

インストールする

macOS・Linux・WSL環境では、ターミナルで以下のコマンドを実行するとインストールできます。

macOS/Linux/WSL
curl -fsSL https://claude.ai/install.sh | bash

Windowsでは、PowerShellで以下のコマンドを実行します。

Windows PowerShell
irm https://claude.ai/install.ps1 | iex

より詳しいインストール方法(Homebrew・wingetなど)は、公式のクイックスタートガイドでも確認できます。

ターミナル操作に不慣れな場合は、Claude公式サイトで配布されているデスクトップアプリ版からClaude Codeを利用する方法もあります。
GUI上でセッションの管理やコードの差分確認ができるため、コマンド操作に不安がある方は検討してみてください。(利用にはPro以上の有料プランが必要です)

Claude CodeのバージョンをPowerShellで確認している画面
※「claude –version」を実行すると、インストールされたClaude Codeのバージョンを確認できます。

ログインする

Claude Codeの初回起動時にログイン方法を選択する画面
※初回起動時は、利用するClaudeアカウントやAnthropic Consoleなどのログイン方法を選択します。

インストール後、対象のプロジェクトフォルダでclaudeと入力するとClaude Codeが起動し、初回はログインを求められます。
画面の指示に従ってブラウザで認証を行うと、以降は同じ環境で再ログインする必要はありません。

利用にはClaude Pro・Max・Team・Enterpriseのいずれかのプラン、またはClaude Consoleのアカウントが必要です。
別のアカウントに切り替えたい場合は、セッション内で/loginを実行します。

Claude Codeの基本的な使い方

ここからは、実際に簡単な【ユーザー登録フォーム】をClaude Codeで改修してみます。
今回は、メールアドレスが未入力の場合や形式が正しくない場合にエラーメッセージを表示する入力チェックを追加したいと思います。

今回のゴールは、未入力や形式が正しくない場合はエラーを表示し、正しいメールアドレスであれば登録できる状態にすることです。この改修を、「指示する→変更内容を確認する→承認する→テストする」という流れで進めていきましょう。

具体的な指示を入力する

Claude Codeでは、通常のチャットと同じように自然言語で作業内容を指示できます。

今回用意したユーザー登録フォームには、メールアドレスを入力する欄はあるものの、入力内容をチェックする仕組みがありません。
そこで、まずClaude Codeに今回の改修内容を次のように伝えます。

例
ユーザー登録フォームにメールアドレスの入力チェックを追加してください。
未入力の場合は「メールアドレスを入力してください」、形式が正しくない場合は「メールアドレスの形式が正しくありません」と表示してください。
正しいメールアドレスの場合は登録できるようにしてください。
Claude Codeにフォームの修正を指示しコードの変更差分が表示された画面
※指示を送ると、Claude Codeが対象ファイルを確認し、変更内容を差分として提示します。

Claude Codeは指示を受けると、必要なファイルを調べ、プロジェクト内のコードを確認しながら作業を進めます。
指示する際に重要なのは、単に「このコードを書いて」とだけ指示するのではなく、何を実現したいのか、どのような条件があるのかを具体的に伝えることです。

NG例
メールアドレス欄を修正してください。
OK例
ユーザー登録フォームにメールアドレスの入力チェックを追加してください。
未入力またはメールアドレス形式でない場合は、登録せずにエラーメッセージを表示してください。

実装内容に関する目的や制約を具体的に指定した方が、期待する結果に繋がりやすくなります。

また、Claude Codeでは、関連するファイルを検索したり、リファクタリングを行ったりと、既存のコードを調査してから作業することも可能です。
まず最初にコードベース全体の概要を確認し、その後に特定の機能や処理へ掘り下げていくという一般的な進め方も参考になります。

変更内容を確認・承認する

指示を送ると、Claude Codeがscript.jsを確認し、メールアドレスの入力チェックを追加する変更案を提示します。
この時点ではまだファイルは書き換えられておらず、内容を確認してから反映するかどうかを選べます。

Claude Codeは、AIが勝手にすべての操作を実行するわけではありません。
ファイルの変更やシェルコマンドの実行など、操作の種類に応じてユーザーの承認を求める仕組みが用意されています。

例えば、特定のファイルを編集しようとした場合、変更内容を確認してから操作を実行するか否かを承認できます。
シェルコマンドを実行する際も、基本的には実行前に確認表示されます。(ただし、読み取り専用の操作など、一部の操作は確認なしで実行できます)

Claude Codeで承認したコード変更がscript.jsへ反映された画面
※変更内容を承認すると、Claude Codeが対象ファイルへ修正を反映します。

そのため、Claude Codeを使う際には、AIに作業を任せながらも、重要な変更については人間が確認するという使い方が基本になります。
特に、ファイルの削除やデータベース操作など、影響範囲が大きい操作については、内容を確認してから承認することが重要です。

また、権限の内容は細かく設定することもできます。
許可した操作について確認を省略したり、特定の操作を禁止したりなどができるため、プロジェクトや作業内容に応じて安全性と操作性のバランスを調整できます。

テストで実行結果を検証する

メールアドレスの入力チェックを追加できたので、次に正しく動作するか確認します。
コードを追加・変更しただけでは、その実装が正しく動作するとは限りません。そのため、修正後にテストを実行して結果を確認することが重要です。

例
今回追加したメールアドレスの入力チェックが正しく動作するかテストしてください。
メールの未入力や形式が正しくない場合など、複数のパターンで確認してください。
Claude Codeでメールアドレス入力チェックのテスト結果を確認している画面
※実装後はテストを依頼し、想定した入力に対して正しい結果になるか確認できます。

テスト結果を見ると、未入力では「メールアドレスを入力してください」と表示され、正しいメールアドレスは登録OK、形式が正しくない入力はエラーとして判定されています。
これで、今回の目標だったメールアドレス入力チェックの追加は完了です。

ここまでで、Claude Codeの基本となる「指示する→変更内容を確認する→承認する→テストする」という一連の流れを体験できました。

Claude Codeでよく使う基本コマンド

メールアドレス入力チェックの追加からテストまで、今回の基本的な改修は完成しました。
ここからは、同じプロジェクトを使いながら、Claude Codeで作業を続ける際に便利な基本コマンドを紹介します。

Claude Codeには、通常のターミナルコマンドとは別に、セッション内からClaude Codeを制御するためのコマンドが用意されています。
これらのコマンドは、/から始まる様式で形成されており、メッセージの先頭に入力することで使用できます。

今回は、その中でも特に使用頻度の高いコマンドについて、先ほどのメールアドレス入力チェックの例を交えながら紹介します。
コマンドの概要や一覧が見たい方は、以下のページも参考にしてみてください。

この記事で扱う代表的なコマンドをまとめると、以下のとおりです。

コマンド 用途
/resume 過去のセッションを再開する
/compact 会話履歴を要約してコンテキストを整理する
/clear 現在の会話をリセットする
/login 利用するアカウントを切り替える
/init CLAUDE.mdを作成する
/rewind コードや会話を以前の状態まで巻き戻す
コマンド概要 › 早見表 ›

セッションを終了・再開する

実際の開発では、作業を1日で終えず、後日続きから作業することもあるでしょう。
Claude Codeで行った会話は、セッションとしてローカルに保存されます。

/resume コマンドを入力すると、保存されているセッションから選択して作業を再開することができます。
セッションには会話履歴だけでなく、ツールの実行結果なども保存されているため、前回の作業内容を説明し直さなくても続きから作業できます。下のスクリーンショットのように、内容が分かるセッション名が一覧に表示されるため、複数のセッションがある場合でも目的の作業を見つけやすくなります。

Claude Codeのresumeコマンドで過去のセッションを選択する画面
※「/resume」を実行すると、保存されているセッションを選択して作業を再開できます。

長期間に渡って開発する場合や、実装やテストなどの工程ごとに間隔を空けて作業する場合には、このセッション再開機能が便利です。

会話を整理・復元する

先ほどのメールアドレス入力チェックの実装やテストのように、作業を重ねていくと、会話の履歴が増えてコンテキストを消費してしまいます。
そのため、開発時には定期的に会話を整理することが重要です。

/compact コマンドを実行すると、それまでの会話履歴を要約し、コンテキストを整理することができます。
使用の際には、要約時に残したい情報を指定することも可能です。

例
/compact メールアドレス入力チェックの変更内容とテスト結果を中心に残してください
Claude Codeでcompactコマンドを実行してコンテキストを圧縮した画面
※「/compact」を実行すると、これまでの会話内容を圧縮してコンテキストを整理できます。

メールアドレス入力チェックの追加が完了し、まったく別の作業を新しく始めたいという場合には、/clear コマンドを使用します。

/clear を実行すると新しい会話が開始されますが、それまでのセッション自体が削除されるわけではありません。
そのため、必要時には/resumeで以前のセッションを呼び戻すこともできます。

誤った変更を元に戻す

例えば、メールアドレス入力チェックの修正内容が意図したものと違っていた場合は、/rewind コマンドが役立ちます。
/rewind を実行すると、コードや会話を特定の時点まで巻き戻すことができるため、ファイルを手動で復元しなくても、指示する前の状態からやり直せます。

特に、変更範囲が広い依頼をした直後や、想定と異なる修正が加えられてしまった場合には、コマンド一覧にある /rewind を覚えておくと安心です。

Claude Codeを効率よく操作する方法

ここまでは、Claude Codeに自然言語で指示するだけで、メールアドレス入力チェックの追加からテストまでを進めてきました。
Claude Codeは自然言語で指示するだけでも利用できますが、ファイルやディレクトリを明示的に指定したり、シェルコマンドや画像を組み合わせたりすることで、より効率的に操作できます。

また、Claude Codeには、AIがどこまで操作できるかを制御する「権限モード」も用意されています。
作業内容に応じてこれらの機能を使い分けることで、必要な情報をAIに正確に伝えながら、安全性にも配慮して開発を進めることができます。

@でファイルやディレクトリを指定する

今回のプロジェクトには index.html と script.js があります。
Claude Codeでは、@を使ってこれらのファイルやディレクトリを具体的に指定できます。

例
@script.js
メールアドレスの入力チェック部分を確認し、改善点があれば教えてください。
Claude Codeでアットマークを入力してファイル候補を表示している画面

@による指定を使うと、Claude Codeに 「どのファイルを対象にするのか」 を明確に伝えられます。
今回のscript.jsのように、特定のファイルを変更してほしい場合や、調査対象を限定したい場合に便利です。

シェルコマンドや画像を入力する

Claude Codeは、シェルコマンドを利用した作業にも対応しています。
例えば、以下のように指示すると、Claude Codeが必要なコマンドを判断して実行します。

例
このプロジェクトにどのようなファイルがあるか確認してください。
また、それぞれのファイルの役割も簡単に教えてください。

ユーザー自身がシェルコマンドを実行して、その結果をClaude Codeに確認させることも可能です。
例えば、入力の先頭に「!」を付けて「dir」と入力すると、今回のプロジェクトにあるindex.htmlやscript.jsなどのファイルを、その場で一覧表示できます。

Claude Codeでシェルコマンドのdirを実行してファイル一覧を表示した画面
※入力の先頭に「!」を付けると、Claude Code上からシェルコマンドを直接実行できます。

また、Claude Codeでは、画像を入力として利用することもできます。
画像から画面構成やUI上の問題を確認させることで、文章だけでは伝えにくいデザイン上の要件も共有することができるメリットがあります。

権限モードを使い分ける

Claude Codeには、ファイル編集やコマンド実行などの特定の作業に対して、権限を制御する仕組みがあります。
危険性のある操作を実行する前にユーザーへ確認を求めることにより、AIが意図しない変更を勝手に行うことを防いでくれます。

ここまでのメールアドレス入力チェックの追加では、確認ありのdefaultモードで、変更内容を1つずつ確認しながら進めてきました。
一方、同じような小さな修正を繰り返す場合には、権限モードを変更して操作を効率化するという選択肢もあります。
代表的なモードとして、通常の確認を行う「default」、より自律的に作業を進める「acceptEdits」、確認なしでコマンドを実行できる「bypassPermissions」などがあります。

Claude Codeでaccept editsモードへ切り替えた画面
※Shift＋Tabで権限モードを切り替えられ、現在のモードは画面下部に表示されます。
モード 動作 向いている場面 注意点
default ファイルの編集やコマンド実行の前に、都度承認を求める 初めて使う場合や、慎重に進めたい作業 確認の手間はあるが、意図しない変更を防ぎやすい
acceptEdits ファイルの編集や基本的なファイル操作を自動で承認する 内容を把握しているコードを継続的に修正する場合 ファイル操作は自動化されるが、その他のコマンド実行は別途確認が必要
bypassPermissions ほぼすべての操作を確認なしで実行する 影響範囲を完全に把握している、隔離された環境での作業 意図しない操作が実行される可能性があるため、通常の開発環境での使用は推奨されない

ただし、権限の強さに比例して、AIによる操作の影響範囲も大きくなりやすいため、利用する環境には十分注意が必要です。
より細かな動作や制限については、権限モードの詳細を確認してください。

CLAUDE.mdにプロジェクトのルールを設定する

Claude Codeで開発をする上で重要なのが、CLAUDE.mdです。

CLAUDE.mdは、プロジェクト固有の情報や指示を伝えるためのMarkdownファイルであり、Claude Codeはこのファイルに記載されたルールを考慮しながら作業します。
プロジェクト全体で守りたいルールがある場合に、このファイルで設定するのが基本となっています。

/initでCLAUDE.mdを作成する

既存プロジェクトで /init コマンドを使用すると、コード内容やファイル構成を分析した上で、自動でCLAUDE.mdを作成してくれます。
今回のプロジェクトでも、index.htmlとscript.jsの内容をもとに、Claude Codeが自動でCLAUDE.mdのたたき台を作成してくれます。

Claude Codeでinitコマンドを実行してCLAUDE.mdを作成した画面
※「/init」を実行すると、プロジェクトの内容をもとにCLAUDE.mdのたたき台を作成できます。

また、コマンドを使用せずに自身でCLAUDE.mdを作成することも可能です。
その場合は、該当プロジェクトのルートディレクトリに作成したファイルを配置します。

CLAUDE.mdの配置例
my-project/
├── CLAUDE.md
├── src/
├── tests/
├── package.json
└── README.md

この状態でClaude Codeを起動すると、設定されたCLAUDE.mdの内容が作業時の指示として利用されます。

CLAUDE.mdに記載する内容

CLAUDE.mdには、Claude Codeがプロジェクトを扱う際に知っておくべき情報を記載します。
例えば、今回のユーザー登録フォームのようなプロジェクトであれば、次のようなルールを記録しておくことができます。

CLAUDE.md
# 開発ルール

## 技術スタック
- HTMLとJavaScriptで構成されている

## コーディングルール
- 入力チェックでは既存の書き方に合わせる
- エラーメッセージの形式を統一する

## テスト
- コード変更後は入力チェックが正しく動作するか確認する

このように、プロジェクトで守るべきルールをまとめておくことで、起動する度に同じ説明を繰り返す必要がなくなります。

また、CLAUDE.mdは1つだけである必要はなく、特定のディレクトリごとに固有のルールを配置することも可能です。
ファイルの配置場所や優先順位については、CLAUDE.mdの設定方法で解説されています。

Plan Modeで実装前に作業計画を立てる

メールアドレス入力チェックの追加が完了したので、次はユーザー登録フォームへパスワード入力欄を追加すると仮定してみましょう。
このように既存コードへの影響範囲が大きくなりそうな改修では、Claude Codeにいきなりコードを書かせるのではなく、まず実装方針を考えさせてから作業を開始する方法もあります。その際に利用できるのが、Plan Modeです。

Plan Modeに切り替えて計画を作成する

Plan Modeでは、コードベースを調査しながら、どのような変更が必要なのかを検討します。
今回であれば、パスワード入力欄を追加するために変更が必要なファイルや実装手順を、Plan Modeが整理して提示してくれます。
計画の内容を確認し、「この方針で問題ない」と判断してから実装に移ることで、AIが誤った方向へ進むリスクを減らせます。

Claude CodeのPlan Modeで実装前の変更計画を表示している画面
※Plan Modeでは、コードを変更する前に対象ファイルや実装手順、検証方法などを確認できます。

特に、既存コードへの影響範囲が大きい作業では、実装前に計画を確認することが重要です。

Plan Modeが適している作業

Plan Modeは、以下のような作業に適しています。

  • 複数ファイルの変更
  • 既存アーキテクチャの変更
  • データベース構造の変更
  • 大規模なリファクタリング

例えば、API、データベース、UIなど、多くの場所で変更が必要になる修正を行う場合に、まずPlan Modeでプロジェクトを調査し、実装計画を作成します。
作成内容の確認後に必要があれば修正を行い、最終的に完成した計画をもとに実装に進みます。

複雑な作業ほど、「何をどのように変更するか」を事前に決めておくことが重要となります。
そのため、Plan Modeを利用することによって、AIによる開発作業をよりコントロールしやすくなります。
Plan Modeの詳しい仕組みや切り替え方法は、Plan Modeの詳細にまとまっています。

SkillsとHooksで作業を効率化する

Claude Codeには、基本的なコード生成やファイル編集だけでなく、開発者が繰り返し行う作業を効率化するための仕組みも用意されています。
代表的なのがSkillsとHooksです。

どちらも作業を効率化できる機能ですが、役割はそれぞれ異なります。

Skillsで繰り返し使う指示を登録する

Skillsは、特定の作業を行うための指示や関連ファイルなどをまとめ、必要な時に呼び出せる仕組みです。
定期的に利用する作業をSkillとして登録しておくことで、再利用しやすくなります。必要な時に同じ手順を利用できます。

SKILL.mdには、そのSkillを実行するときの説明や指示を記述します。
例えば、今回のユーザー登録フォームを継続的にレビューするためのSkillは、次のように作成できます。

SKILL.md
---
name: review-form
description: ユーザー登録フォームをレビューする
---

# ユーザー登録フォームのレビュー

index.htmlとscript.jsを確認し、以下の項目をチェックしてください。

- 入力チェック
- エラーメッセージ
- 改善点

コードの変更は行わず、レビュー結果を箇条書きで報告してください。
Claude Codeでreview-formというSkillのSKILL.mdを作成した画面
※SKILL.mdに手順を登録しておくことで、繰り返し利用する作業をSkillとして呼び出せます。

こうしてreview-formというSkillを作っておけば、このフォームを今後も改修するときに、毎回同じ観点でレビューしてもらえます。
指示を一から書き直す必要がなくなるため、繰り返し行う作業ほどSkillsの効果を感じやすくなります。

CLAUDE.mdが「プロジェクト全体で守るルール」を設定するための仕組みであるのに対し、Skillsは「特定の作業を行うときの手順や知識」を再利用するための仕組みと考えると分かりやすいでしょう。
Skillのファイル構成や設定項目については、Skillsの作成方法を参照してください。

Hooksで特定の処理を自動実行する

Hooksは、Claude Codeの特定のイベントをきっかけとして、あらかじめ設定した処理を自動的に実行する仕組みです。
Claude Codeの設定ファイルに、起点となるイベントと実行する処理を設定して利用します。
例えば、今回のようにscript.jsを変更した直後に、入力チェック用のコマンドを自動実行するといった使い方も可能です。

Hooksのポイントは、AIに「実行してください」と毎回頼むことなく、決められた処理を自動的に実行できることにあります。
ただし、ファイル削除や外部サービスへのアクセスなど、影響の大きい処理を自動化する場合は、実行条件や対象を慎重に設定する必要があります。

設定可能なイベントの種類やコマンドの記述方法については、Hooksの設定方法で確認できます。

▼こちらもチェック▼
Vibe Codingとは？おすすめツールと始め方をわかりやすく解説 Vibe Codingとは？おすすめツールと始め方をわかりやすく解説 ▶

MCPでClaude Codeと外部ツールを連携する

ここまでの作業はローカルのindex.htmlとscript.jsだけで完結しましたが、より実践的な開発では外部サービスやドキュメントを利用する場面もあります。
同じプロジェクトをさらに発展させる場合に利用できるのが、MCP（Model Context Protocol）です。

MCPの仕組み

MCPとは、AIアプリケーションと外部ツールを接続するための共通規格のことを言います。

通常、AIと外部ツールを接続する場合、使用するツールごとに個別の処理を実装する必要があり、接続先が増えるごとに開発コストがかかってしまいます。
この問題を解決してくれるのが、MCPです。

MCPを利用すると、使用するツールに関係なく、同一の処理方法で外部ツールと接続できるようになります。

MCPサーバーを追加して外部ツールと連携する

実際にAIと外部ツールが連携する際は、共通規格に基づいて作成されたサーバー (MCPサーバー) を介してやり取りすることによって連携します。
Claude Codeでも、利用したいツールに対応するMCPサーバーを追加することによって、外部ツールと連携できるようになります。
例えば、下のスクリーンショットのようにContext7 MCPを接続しておけば、ライブラリの最新ドキュメントを参照しながら開発を進めるといったことも可能になります。
対応しているツールの一覧や追加手順は、MCPサーバーの追加方法にまとまっています。

Claude CodeでMCPサーバーcontext7の接続状態を確認している画面
※「claude mcp list」を実行すると、登録したMCPサーバーと接続状態を確認できます。

以下は、実際に連携可能なMCPサーバーの一例です。

  • GitHub MCP … Issue管理、PRレビュー、ブランチ操作など
  • PostgreSQL MCP … クエリ実行、スキーマ確認など
  • Playwright MCP … E2Eテスト、Webスクレイピングなど
▼こちらもチェック▼
【MCPとは】AIによる業務効率化を支える仕組みや機能、使い方を解説 MCPとは？AIによる業務効率化を支える仕組みや機能、使い方を解説 ▶
▼こちらもチェック▼
【画像付き】GitHubの使い方｜設定・基本操作 【画像付き】GitHubの使い方｜設定・基本操作 ▶

まとめ

Claude Codeは、開発者とAIが協力してソフトウェア開発を進めるための環境として活用できます。
最初からすべての機能を使いこなす必要はありませんので、まずはコード調査や簡単な修正、テストの実行といったような、基本的な使い方から始めていくといいでしょう。

     

AI・機械学習カテゴリの最新記事