🔰

【2025/10最新版】ゼロから始めるClaude Code入門・ハンズオン

ryu fukuda

2025/10/01に公開

 はじめに皆さん、Claude Codeは使っていますか？

この記事は、当社カンリーで実施したClaude Codeハンズオンの資料に加筆修正したもので、

執筆時点（2025/10）におけるClaude Codeの基礎知識や基本機能を紹介します。
今までエージェント型コーディングツールを使ってこなかった方
GitHub CopilotやCursorを使っていてClaude Codeは使っていない方
Claude Codeを使っているけど、プロンプトでの通常会話のみで利用している方
を想定読者としています。

読み終えた時には、主要機能を理解できている状態になることを目指しています。

 エージェント型コーディングツール戦国時代記事執筆時点では、エージェント型コーディングツールは戦国時代の様相を呈しています。

2025年になってからも、Devin, Claude Code, Kiro, Codex CLI（以後Codex）等と、

様々なツールが毎月のように話題となっています。
直近で言えば、性能面や機能面で急速に成長しているCodexが話題になることが多く、

Claude Codeの性能低下が叫ばれていることも相まって、Codexに乗り換える話題も見られます。

Codex MCPを使い、Claude CodeからCodexを動かす方法も広がりを見せています。
そういった状況において、ツール動向のキャッチアップに追従するのがしんどくて

結局どのツールも触れていない…というエンジニアも一定数いらっしゃるように思います。

そのような方々には、まずはClaude Codeを学ぶことをオススメしたいです。
当社カンリーではCursorとDevinを中心に利用しているメンバーが多く、

Claude Codeの利用状況は人やチームによってバラバラであったため、ハンズオンを実施しました。

 なぜ今Claude Codeをオススメするのかなぜ今CodexではなくClaude Codeなのか？

それは、先行者であるがゆえにコミュニティやエコシステムが成熟していることに加え、

トレンドに振り回されず、比較的陳腐化しづらいAIコーディングスキルが身につくためです。
現時点のClaude Codeは、CursorやCodex等と比較すると機能面において一日の長があり、

直近ではCursorやCodexも、Claude Codeの機能に類似したアップデートがされています。

（9月に実装されたCursorのカスタムスラッシュコマンドや、Codexの会話復帰機能等）
これらツールは将来的にコモディティ化していき、類似した機能が概ね出揃った上で

徐々に淘汰されていき、デファクトスタンダードが決まっていくことでしょう。

過渡期の現時点において「このツールが覇権を取る」と断定的なことは全く言えない状況ですが

Claude Codeが提供している機能は、他ツールにも順次実装されていくと思われます。
つまり今、機能面において先行しているClaude Codeを学ぶことで、

どのツールがデファクトスタンダードになっても陳腐化しづらいスキルが身につくはずです。
また、先行して人気を獲得していたため、日本語記事も充実しています。

記事執筆時点ではZennでもQiitaでも、Claude CodeはCodexの約10倍の記事数があります。

2025年9月末にClaude Code 2.0.0やClaude Sonnet 4.5が発表されたことでも、

再びClaude Codeが注目を集めています。
そのため、「今から学び始めるのであればClaude Code」を推したいです。

逆に、今までClaude Codeを使い倒していた方は、KiroやCodexの学びはじめがオススメです。

（私自身はそれらを触りはじめています）

 Claude CodeとはClaude Code（クロード コード）とは、Anthropic社が提供する、

ターミナル（コマンドライン）で動作する対話型AIコーディング支援ツールです。

 （個人的）Claude Codeの特長カスタマイズ性の高さ
カスタムスラッシュコマンドやサブエージェント、フック等

拡張性の高さ
MCPでGitHub, Notion, Backlog等の各ツールと簡単に連携できる

サブスクモデルがある
従量課金による高額請求が来ることがなく、個人利用でも遠慮なく回せる

2と3は比較的他のツールも当たり前に備えていることが多いので、特に1が強みですね。
加えてツール自体の特長ではないですが、前章でも書いた通り、コミュニティやエコシステムが

他ツールと比較して成熟しており、入門も応用も適したツールと言えます。

 Claude CodeハンズオンここからはClaude Codeの各機能を学びながら、ハンズオン形式で実際手を動かしてみます。

全機能は網羅しませんが、主要な機能は一通り紹介します。
インストール
どのプランで契約すべきか？
Claude Code起動に関する基礎知識
スラッシュコマンド
カスタムスラッシュコマンド
サブエージェント
MCPサーバ
フック
開発体験ハンズオン
知っておくと便利なTips集

 1. インストールまずは以下いずれかの方法で、ローカルにClaude Codeをインストールします。

 ハンズオン：インストールとログイン$ npm install -g @anthropic-ai/claude-code
or
$ curl -fsSL https://claude.ai/install.sh | bash
続いてログインすることで、Claude Codeを使えるようになります。
$ claude
# 初回使用時にログインを求められます

/login
# プロンプトに従ってアカウントでログインしてください
引用：クイックスタート - Claude Docs
!IDE拡張

VSCode/Cursor向けに、Claude Codeの便利な拡張機能が存在します。
しかし2025年10月1日現在の最新版は、日本語入力時のEnterでも送信されてしまうので

このバグが直るまでは、ターミナルからClaude Codeを起動することを推奨します。

 2. どのプランで契約すべきか？趣味で学習する範囲なら、少し不便ですがまずは最安値のProプラン（$20/月）で良いです。

足りなければMaxプランに上げましょう。
https://support.claude.com/ja/articles/11145838-proまたはmaxプランでclaude-codeを使用する
Proプランが月額$20
Maxプラン（Proの5倍）が月額$100
Maxプラン（Proの20倍）が月額$200
です。

どのプランも一定時間以内に使いすぎると、レート制限がかかります。

利用状況は/usageコマンドを使うことで可視化できます（v2.0.0以降）。

5時間でリセットされるため、レート制限に達するとしばらく作業が中断されます。
Proプランでは、1時間ほどノンストップで使い続けるとレート制限に引っかかりやすいです。

Maxプラン（5倍）では、ノンストップで使い続けると稀にレート制限に引っかかります。

Maxプラン（20倍）は未経験ですが、複数立ち上げてぶん回さない限りはよっぽど大丈夫でしょう。
なお、当社カンリーではAmazon Bedrockを利用してClaude Codeを動かしています。

そしてOpenTelemetryでメンバーごとの利用状況やコストを可視化しています。

今後、利用状況次第ではMAXプランへの切り替えも検討しています。

 3. Claude Code起動に関する基礎知識とりあえず、最初に覚えておくことは4つだけです。
通常起動はclaude
過去の会話再開はclaude -r
起動時のディレクトリ配下がスコープとなる
プロンプトでパスを明示しない限り、配下ファイルを探索してコードが書かれる

起動時にCLAUDE.mdというファイルが自動で読み込まれる
やり取りの日本語化や開発ルール、プロジェクト概要等はこちらに明記
なんでもかんでも突っ込むとコンテキストウィンドウを圧迫するため、肥大化注意


 4. スラッシュコマンドhttps://docs.claude.com/ja/docs/claude-code/slash-commands
Claude Codeを起動時、スラッシュ/から始まるコマンドを打つことで様々な操作が可能です。
プリセットのスラッシュコマンドが豊富であることが、Claude Codeの特長の一つです。

全コマンドは上記ドキュメントをご参照ください。以下、特に重要度が高いもののみ紹介します。

/init
初期設定コマンド。Claude Codeを実行したことないディレクトリでまず実行する

CLAUDE.mdが作られる
「日本語でやり取りして」だけ指示すればとりあえずOK



/compact
それまでの会話を圧縮
コンテキストウィンドウが溢れてくると自動でcompactが走るが、その前の手動圧縮


/clear
それまでの会話をクリア


/rewind （v2.0.0以降）
過去会話とコードに戻る


/mcp
MCPの接続状況を確認


/agents
利用可能なサブエージェントを確認


/output-style
アウトプットスタイルを変更
デフォルト（早く実装できる）
説明モード（なぜ実装したのか説明が足される）
学習モード（人間がコードを一部書くこと前提にサポートしてくれる）


!コンテキストウィンドウとは？

LLMのモデルが一度に処理できるトークン数のこと。

Claude Codeの場合、上限を迎える前に自動的に会話が圧縮され、コンテキストウィンドウが溢れるのを防ぎます。
ただし圧縮ということは文脈が一定失われるため、/compactをマニュアル実行することで、意図しないタイミングで圧縮されるのを防ぐことができます。
/clearの場合は完全に新規の会話が開始されるため、コンテキストウィンドウがリセットされます。

 ハンズオン：初期設定/init

> CLAUDE.mdを日本語化するとともに、やり取りは日本語で行うことを明記してください。
とりあえず初期設定はこれでOKです。

なお、プロンプトは先頭に#を付けるとCLAUDE.mdへの変更指示になります。

 5. カスタムスラッシュコマンドプリセットのスラッシュコマンドに加えて、独自コマンドを定義することもできます。

毎回似たプロンプトを入力する手間を省くことができます。

 配置カスタムスラッシュコマンドは、定義markdownファイルをどこに配置するかでスコープが変わります。
プロジェクト固有
.claude/commands/
プロジェクト内で利用可能
個人設定
~/.claude/commands/
全プロジェクトで利用可能

 ハンズオン：カスタムスラッシュコマンドの設定ファイルを直接編集しても良いですが、今回は以下のようにプロンプトで作成させます。
https://docs.anthropic.com/ja/docs/claude-code/slash-commands
を参考に、/research というコマンドを作って、~/.claude/commands/ に配置して。

GitHub issueのURLが渡された場合、GitHub MCPを使って内容を理解して。
その他文字列が渡された場合、必要に応じてプロジェクトの調査をして。
https://docs.anthropic.com/ja/docs/claude-code/slash-commands
を参考に、/code-review というコマンドを作って、~/.claude/commands/ に配置して。

コードレビュー用サブエージェントがある場合、優先的にサブエージェントを使って
客観的なコードレビュー結果を返して。レビュー観点等、余分な情報はコマンドの定義に含まないで。
!何か作業させる際、サンプルとなるコードやドキュメントを渡す方が精度が上がります。
例えばカスタムスラッシュコマンドはフロントマターという記述方法をサポートしていますが、

サンプルを渡さずに作成させると、フロントマターを考慮せず作成してしまうことが多いです。

 動作確認上記プロンプトにより、2つのカスタムスラッシュコマンドが作成されたはずです。

Claude Codeを再起動してスラッシュコマンドを打つと、/researchや/code-review

がサジェストされるはずです。

 6. サブエージェント続いて紹介する機能はサブエージェントです。
サブエージェントは、Claude Codeがタスクを委任できる事前設定されたAIパーソナリティです。各サブエージェントは：
特定の目的と専門分野を持つ
メインの会話とは独立した独自のコンテキストウィンドウを使用する
使用を許可された特定のツールで設定できる
その動作を導くカスタムシステムプロンプトを含む
Claude Codeがサブエージェントの専門分野に一致するタスクに遭遇すると、そのタスクを専門化されたサブエージェントに委任でき、サブエージェントは独立して作業し結果を返します。

引用：Anthropic サブエージェント - Anthropic
サブエージェントを使わない開発手法を開発組織に例えると、

CTOが要件定義や設計、開発、テストまですべての作業工程を1人で担っていた状態です。

サブエージェントは例えるならチームメンバーで、必要に応じて各作業をメンバーに委任します。

例えばセキュリティ特化やコードレビュー特化のサブエージェント等を複数定義しておくことで、

汎用的なメインエージェント1つが全作業を担うよりも、アウトプットの質が高まります。
また、サブエージェントは以下のようなメリットもあります。
並列処理できるケースがあり、効率化が見込める
例）フロントエンドのサブエージェントとバックエンドのサブエージェントが同時稼働

メインエージェントのコンテキストを圧迫しづらい
作業中コンテキストは各サブエージェントが持つことで、メインのコンテキストが減らせる

バイアスが入りづらい
レビューをサブエージェントに委譲することで、より客観的なレビューが可能

ただし、メインが全コンテキストを保持しているわけではないので、非効率になる場合もあります。

 ハンズオン：サブエージェントの設定https://docs.anthropic.com/ja/docs/claude-code/sub-agents
を参考に、コードレビュー　サブエージェントを作って、~/.claude/agents/ に配置して。

コード品質、パフォーマンス、セキュリティ、可読性・保守性について10点満点で評価して。
評価は忖度なく客観的かつ率直にまとめて

 7. MCPサーバMCPサーバは、いわゆるAIとツールを繋ぐUSB-TypeCのような統一規格、と表現されます。

様々なAIツールとSaaS等を簡単に接続し、作業の連携が可能となります。
今回のハンズオンではGitHub MCPを導入します。

すると、GitHubのissueの読み込みやpushしてPull Requestを出す作業は

人間がやらずとも、Claude Codeに指示したらGitHub MCP経由で実行可能になります。

 ハンズオン：PATの取得GitHubの操作はPAT（personal access token）が必要です。
https://github.com/settings/personal-access-tokens

からGenerate new tokenを選択します
token name
分かりやすく、Claude Code等で

Repository access
必要なリポジトリを選択
汎用的にしたいならAll RepositoryでもOK
その分リスクが高まることは理解しておくこと


Permissions
Issue, Contents, Metadata, Pull requestsあたりに必要権限付与


 ハンズオン：.claude.jsonに追加MCPはコマンドで導入も可能ですが、プロジェクトを跨いで利用することが多いです。

その場合は全体に入れた方が楽なので、直接設定ファイルを変更します。
~/.claude.json
  "mcpServers": {
    "github": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-github"
      ],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "github_pat_***" // 要書き換え
      }
    }
  }
!~/.claude.jsonの中にはmcpServersという文字列が既にあると思います。

ただしprojects階層下のmcpServersでは、プロジェクト単位の追加になります。

第一階層に上記内容を入力することで、プロジェクト問わずMCPが使えます。
当社カンリーでは、MCPサーバ利用ガイドラインを設け、利用申請プロセスが整備されています。

具体的にはGitHub, Backlog, Notion, Figma等と連携して、業務でMCPを利用しています。

 8. フックフックを使うことで、特定のイベントにフックして何かしらの処理をすることができます。

例えばユーザー入力のプロンプトをログに残したり、破壊的な変更をブロックできます。
設定ファイルは以下の通りです。
Claude Codeフックは設定ファイルで設定されます：

~/.claude/settings.json - ユーザー設定

.claude/settings.json - プロジェクト設定

.claude/settings.local.json - ローカルプロジェクト設定（コミットされない）
エンタープライズ管理ポリシー設定

引用：Anthropic フックリファレンス - Anthropic

 ハンズオン：作業完了音の設定とりあえずオススメなのは、作業完了時に音を鳴らす設定です。

この設定をすることで、他作業をしていても応答が求められた時にすぐ気付くことができます。

以下サンプルはMac向けの設定です。Claude Codeの作業が終わるとSEが鳴ります。
~/.claude/settings.json
  "hooks": {
    "Stop": [
      {
        "matcher": "",
        "hooks": [
          {
            "type": "command",
            "command": "afplay /System/Library/Sounds/Glass.aiff"
          }
        ]
      }
    ],
    "Notification": [
      {
        "matcher": "",
        "hooks": [
          {
            "type": "command",
            "command": "afplay /System/Library/Sounds/Glass.aiff"
          }
        ]
      }
    ]
  }

 9. 開発体験ハンズオンここまで導入した全機能を一通り試してみましょう。

 ハンズオン：issueの作成GitHub MCPを導入しているので、Claude Codeからissueを作成してみましょう。
https://github.com/{your_name}/{your_repository}/issues/ に新規issueを作成して。内容は以下の通り

# ハンズオン用チケット

ハンズオン用のテストチケットです

- フレームワーク、ライブラリ等の利用は禁止
- html, css, jsのみ使用
- ファイル名はindex.html
- 大きな文字で「hello world」と表示
- アニメーションでフェードインさせる
GitHub MCPの連携が成功していれば、issueが作成されます。

 ハンズオン：issueの取得と分析そのまま実装に入ってもいいのですが、今回は練習のために一旦issue内容を忘れてもらいます。
/clear
これにより、Claude Codeはissueを作成したことも、issue内容も忘れます。

他の人が作成したissueを取得し、作業を開始するシチュエーションを再現しています。
続いて以下コマンドを実行します。

カスタムスラッシュコマンドとMCPの導入に成功していれば、issueの内容を取得し分析されます。
/research https://github.com/{your_name}/{your_repository}/issues/{your_issue}

 ハンズオン：コードの実装Claude Codeがissue内容を理解したら、実際にそれを実装させてみます。

恐らく問題なく実装がされるはずです。
> issueに沿って実装して

 ハンズオン：コードレビュー実装されたコードをレビューさせます。

カスタムスラッシュコマンドとサブエージェントの導入に成功していれば、

恐らくレビュー用のサブエージェントが立ち上がって、客観的なレビュー結果を返してくれます。
/code-review

 ハンズオン：修正とPull Request作成レビュー内容が返ってくるため、修正が必要そうであれば修正指示を出します。

問題なければPull Requestを出しましょう。
> PR出して
GitHub MCPが正常に導入できていれば、add, commit, pushの後にPull Requestが作られます。

ハンズオンはこれにて終わりです。

 10. 知っておくと便利なTips集
 Tips: カスタムスラッシュコマンドやサブエージェントの設定共有当社カンリーでは、カスタムスラッシュコマンドやサブエージェントの設定を

チーム内で共有できるリポジトリを用意しています。
参考までに、以前登壇した際の資料を貼っておきます。

 Tips: モード切り替えShift + Tabを押すと、自動承認モードとプランモードが切り替わります。
プランモードはファイル編集を行わずに計画を立てることに集中します。

大規模な改修の場合は、プランモードで綿密に計画や調査を終えてから作業に入ると良いです。

 Tips: ThinkingモードClaude Code 2.0.0以降では、Tabを押すことでThinkingモードのON/OFFが切り替えられます。
以前のバージョンでは隠しコマンドultrathinkとして実装されていたモードで、

Thinkingモードでは思考が深くなります。

その分トークンも時間も消費するので多用は禁物ですが、思考が重要な場面では有用です。

 終わりに今回は、ハンズオンを通じてClaude Codeの基本機能を学びました。
恐らくClaude Codeは今後Codexとの差を埋めるために性能が向上していくでしょうし、

Codexは追いつかれないように性能を上げつつ、機能面で追従していくはずです。
まずはClaude Codeを使い倒し、大きなトレンドは見逃さないように手を動かしていければ

AI時代の新たなエンジニアの働き方に順応できると思います。

当社でもその流れに乗っていけるよう、既存ツールへの理解を深めるとともに、

新規ツールの導入検証も進めていきます。

カンリーテックブログPublication

株式会社カンリーは「店舗経営を支える、世界的なインフラを創る」をミッションに、店舗アカウントの一括管理・分析SaaS「カンリー店舗集客」の開発・提供、他複数のサービスを提供しております。技術系以外のnoteはこちらから note.com/canly

はじめに

エージェント型コーディングツール戦国時代

なぜ今Claude Codeをオススメするのか

Claude Codeとは

（個人的）Claude Codeの特長

Claude Codeハンズオン

1. インストール

ハンズオン：インストールとログイン

2. どのプランで契約すべきか？

3. Claude Code起動に関する基礎知識

4. スラッシュコマンド

ハンズオン：初期設定

5. カスタムスラッシュコマンド

配置

ハンズオン：カスタムスラッシュコマンドの設定

動作確認

6. サブエージェント

ハンズオン：サブエージェントの設定

7. MCPサーバ

ハンズオン：PATの取得

ハンズオン：.claude.jsonに追加

8. フック

ハンズオン：作業完了音の設定

9. 開発体験ハンズオン

ハンズオン：issueの作成

ハンズオン：issueの取得と分析

ハンズオン：コードの実装

ハンズオン：コードレビュー

ハンズオン：修正とPull Request作成

10. 知っておくと便利なTips集

Tips: カスタムスラッシュコマンドやサブエージェントの設定共有

Tips: モード切り替え

Tips: Thinkingモード

終わりに

Discussion