Claude Codeは、Anthropicが提供するターミナルベースのAIコーディングエージェントだ。VS CodeやCursorのようなGUIエディタではなく、ターミナルから直接AIと対話しながら開発を進める。このチュートリアルでは、インストールから実戦で使えるテクニック、CLAUDE.mdの書き方、MCP連携、Hooks、コスト最適化まで、Claude Codeを使いこなすための実践知識を体系的に解説する。
Claude Codeの導入と初期設定
インストール
npm install -g @anthropic-ai/claude-code
Node.js 18以上が必要。インストール後、任意のプロジェクトディレクトリで以下を実行する。
cd your-project
claude
初回起動時にAnthropicアカウントの認証が求められる。OAuth認証フローに従い、ブラウザでログインすれば準備完了だ。
料金プランの選択
| プラン | 月額 | 特徴 | 推奨ユーザー |
|---|---|---|---|
| Claude Pro | $20 | 基本的なClaude Code利用 | 個人開発者・ライトユース |
| Claude Max 5x | $100 | Proの5倍の利用量 | メイン開発ツールとして使う場合 |
| Claude Max 20x | $200 | Proの20倍の利用量 | ヘビーユーザー・チーム開発 |
| API従量課金 | 使った分だけ | Sonnet: $3/$15 per MTok | コスト管理を徹底したい場合 |
Pro ($20/月)から始めて、利用量に応じてMax ($100/月)に移行するパターンが最も一般的だ。
CLAUDE.md — プロジェクトの「取扱説明書」
CLAUDE.mdは、Claude Codeに対してプロジェクトのルール、構造、注意点を伝えるファイルだ。プロジェクトルートに配置すると、セッション開始時に自動的に読み込まれる。
配置場所と優先順位
| ファイル | 配置場所 | スコープ |
|---|---|---|
| CLAUDE.md | プロジェクトルート | そのプロジェクト全体 |
| ~/.claude/CLAUDE.md | ホームディレクトリ | 全プロジェクト共通 |
| CLAUDE.md（サブディレクトリ） | 任意のサブディレクトリ | そのディレクトリ以下 |
効果的なCLAUDE.mdの書き方
Anthropicの公式ベストプラクティスでは、300行以下に収めることが推奨されている。含めるべき項目は以下の通りだ。
| セクション | 記述内容 | 例 |
|---|---|---|
| プロジェクト概要 | 技術スタック、フレームワーク | Next.js 16 + Supabase + TypeScript |
| コマンド | ビルド、テスト、lint の実行方法 | pnpm dev, pnpm build, pnpm lint |
| ディレクトリ構成 | 主要ディレクトリの役割 | app/ = ページ、lib/ = ロジック |
| コーディング規約 | 命名規則、インポートルール | PascalCase、@/ エイリアス使用 |
| DB注意点 | カラム名の注意（間違えやすいもの） | body（contentではない） |
| やってはいけないこと | 禁止事項を明示 | .env.localをコミットしない |
# CLAUDE.md
## 技術スタック
- Next.js 16 (App Router) + React 19 + TypeScript
- DB: Supabase (PostgreSQL + RLS)
- スタイリング: Tailwind CSS v4 + shadcn/ui
## コマンド
pnpm dev # 開発サーバー
pnpm build # ビルド
pnpm lint # ESLint
## コーディング規約
- インポートは @/ エイリアスを使用
- コンポーネント: PascalCase
- DB列名: snake_case
冗長な説明は避け、箇条書きで簡潔に書くのがポイントだ。Claude Codeはこのファイルを毎セッション読み込むため、長すぎるとコンテキストを消費する。
基本コマンドとワークフロー
対話モード
claude # 対話モードで起動
claude "バグを修正して" # ワンショット実行
claude -p "説明して" # print モード（ファイル変更なし）
セッション管理コマンド
| コマンド | 機能 |
|---|---|
| /clear | コンテキストをリセット（コスト節約に有効） |
| /compact | 会話を要約して圧縮（コンテキスト窓の節約） |
| /memory | プロジェクトの記憶を追加・確認 |
| /model | 使用モデルを切り替え（Opus↔Sonnet） |
| /cost | 現セッションのコストを確認 |
| /help | コマンド一覧を表示 |
コスト管理のベストプラクティスとして、タスクが切り替わるたびに /clear を実行し、長い会話が続いた場合は /compact で要約する。これだけでAPI費用を30〜50%削減できる。
Custom Skills — 再利用可能なプロンプト
Claude Codeには「カスタムスキル」という仕組みがあり、頻繁に使うプロンプトをファイルとして保存できる。
スキルの作成
mkdir -p .claude/skills
.claude/skills/ ディレクトリにMarkdownファイルを配置すると、Claude Codeがスキルとして認識する。
# .claude/skills/code-review.md
## コードレビュースキル
以下の観点でコードをレビューしてください：
1. セキュリティ脆弱性（SQLインジェクション、XSS等）
2. パフォーマンス問題（N+1クエリ、不要な再レンダリング）
3. TypeScript型安全性（any型の使用、型アサーション）
4. エラーハンドリング（try-catch、エラー境界）
5. テスタビリティ（依存性注入、モック可能性）
スキルは /skill コマンドで呼び出すか、会話内で「コードレビューして」と指示すると自動的にマッチングされる。チーム全体でスキルファイルをGitにコミットすることで、レビュー基準やコーディング規約をAIに統一的に適用できる。
MCP（Model Context Protocol）連携
MCPは、Claude Codeを外部サービスと接続するためのプロトコルだ。GitHub、Slack、データベース、Figma等のツールとClaude Codeを直接連携できる。
MCP設定
// .claude/mcp.json
{
"mcpServers": {
"github": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-github"],
"env": {
"GITHUB_TOKEN": "ghp_xxxxxxxxxxxx"
}
},
"supabase": {
"command": "npx",
"args": ["-y", "@supabase/mcp-server"],
"env": {
"SUPABASE_URL": "https://xxx.supabase.co",
"SUPABASE_SERVICE_ROLE_KEY": "eyJhbGci..."
}
}
}
}
主要なMCPサーバー
| MCPサーバー | 接続先 | できること |
|---|---|---|
| server-github | GitHub | Issue/PR操作、リポジトリ検索 |
| server-slack | Slack | メッセージ送受信、チャンネル検索 |
| server-filesystem | ファイルシステム | ディレクトリ探索、ファイル操作 |
| mcp-server-supabase | Supabase | テーブル操作、SQL実行 |
| server-figma | Figma | デザインデータの取得 |
MCP連携により、Claude Codeは単なるコーディングツールから「開発ワークフロー全体を統合するハブ」へと進化する。
Hooks — ワークフローの自動化
Hooksは、Claude Codeの特定のアクション（ファイル編集、コマンド実行等）の前後にカスタムスクリプトを自動実行する仕組みだ。
Hookの種類
| Hook | タイミング | 用途例 |
|---|---|---|
| PreToolUse | ツール実行前 | 禁止操作のブロック、確認プロンプト |
| PostToolUse | ツール実行後 | 自動lint、テスト実行、通知 |
| PreCompact | /compact実行前 | コンテキスト圧縮前のバックアップ |
設定例
// .claude/settings.json
{
"hooks": {
"PostToolUse": [
{
"matcher": "Edit|Write",
"command": "npx eslint --fix $CLAUDE_FILE_PATH"
}
],
"PreToolUse": [
{
"matcher": "Bash",
"command": "echo 'Command: $CLAUDE_TOOL_INPUT' >> .claude/audit.log"
}
]
}
}
上記の例では、ファイル編集後に自動でESLintを実行し、Bashコマンド実行前に監査ログを記録する。Hooksを活用することで、AIの操作に対するガードレールとワークフロー自動化を同時に実現できる。
Agent Teams — 並列エージェント実行
Agent Teamsは、複数のClaude Codeエージェントを同時に実行し、異なるタスクを並列処理する機能だ。
| 用途 | 実行パターン |
|---|---|
| 複数リポジトリの同時修正 | リポジトリごとにエージェントを起動 |
| テスト実行とコード修正の並行 | 1つがテスト、もう1つが修正 |
| フロントとバックの同時開発 | UIエージェントとAPIエージェントを分離 |
| 大規模リファクタリング | モジュールごとにエージェントを割り当て |
# ターミナル1
claude "フロントエンドのコンポーネントをリファクタリングして"
# ターミナル2
claude "APIエンドポイントのエラーハンドリングを改善して"
# ターミナル3
claude "テストカバレッジを80%まで上げて"
各エージェントは独立したコンテキストを持ち、Git Worktreeを使えばブランチの競合も回避できる。
コスト最適化 — 実践テクニック
Claude Codeのコストを最小化するための実践テクニックを整理する。
| テクニック | 効果 | 方法 |
|---|---|---|
| /clear の活用 | 不要なコンテキスト削除 | タスク切替時に毎回実行 |
| /compact の活用 | コンテキスト圧縮 | 長い会話が続いたら実行 |
| モデル切替 | 安価なモデルで簡単なタスク | /model でSonnetに切替 |
| CLAUDE.mdの最適化 | コンテキスト消費を削減 | 300行以下に抑える |
| ワンショット実行 | セッション維持コストなし | claude "タスク内容" で直接実行 |
| スコープの限定 | 処理対象ファイルを絞る | ディレクトリを指定して起動 |
特に効果が大きいのは「/clear + /compact」の組み合わせだ。10分以上の長い会話セッションでは、途中で /compact を実行するだけで後続のAPIコールのトークン消費が大幅に削減される。
実践ワークフロー例
新機能の実装（典型パターン）
# 1. プロジェクトディレクトリで起動
cd my-project && claude
# 2. 機能の実装を依頼
> ユーザー認証にパスワードリセット機能を追加して。
> メール送信にはResendを使って。テストも書いて。
# 3. Claude Codeが自律的に実行:
# - 既存の認証コードを分析
# - パスワードリセットのAPIルートを作成
# - メール送信のServer Actionを作成
# - フロントエンドのフォームを作成
# - テストを作成・実行
# - 動作確認して完了報告
# 4. 結果を確認してコミット
> git diff を見せて
> 問題なければコミットして
PRレビューの自動化
# GitHub MCPが設定済みの場合
claude "PR #42 をレビューして。セキュリティ、パフォーマンス、
型安全性の観点でコメントを残して"
バグ修正
claude "本番でエラーが出ている。ログは以下の通り:
TypeError: Cannot read properties of undefined (reading 'map')
at ArticleList (app/articles/page.tsx:24)
原因を特定して修正して"
「ターミナルから世界を変える」ための第一歩
Claude Codeは、AIコーディングツールの中で最もミニマルでありながら、最もパワフルなツールだ。GUIの装飾を排し、ターミナルという開発者にとって最も自然なインターフェースからAIの全能力にアクセスできる。
CLAUDE.mdでプロジェクトのルールを伝え、MCP で外部サービスと接続し、Hooksでワークフローを自動化し、Agent Teamsで並列処理する。このスタックを構築すれば、1人の開発者がチームに匹敵する生産性を手にできる。まずはインストールして、自分のプロジェクトで claude と打ってみてほしい。
出典・参考
