💻 Claude Code入門
|
📖 15分
CLAUDE.mdで指示をまとめる
CLAUDE.md ― プロジェクトの指示書
Claude Codeを本格的に使い始めると、毎回のセッションで同じ前提条件を説明するのが手間になってきます。CLAUDE.mdは、この問題を解決する仕組みです。プロジェクトのルートに CLAUDE.md を置くと、Claude Codeは起動時に自動的にこのファイルを読み込み、内容を前提知識として利用します。
CLAUDE.mdの基本構造
最小構成の例
# CLAUDE.md
## プロジェクト概要
社内の勤怠管理Webアプリケーション
## 技術スタック
- PHP 8.1 / Laravel 10
- MySQL 8.0
- Vue.js 3 + TypeScript
## コーディングルール
- PSR-12に準拠
- コメントは日本語で記述
- テストは必ず書く(PHPUnit)
プロジェクトタイプ別の CLAUDE.md 完全テンプレート
テンプレート1: 静的Webサイト(HTML/CSS/JS)
# CLAUDE.md
## プロジェクト概要
コーポレートサイト(株式会社サンプル)。
レスポンシブ対応の静的サイト。
## 技術スタック
- HTML5 / CSS3 / JavaScript (ES6+)
- フレームワーク不使用(バニラJS)
- CSSはBEM命名規則
## ファイル構成
- index.html: トップページ
- about.html: 会社概要
- contact.html: お問い合わせ
- css/style.css: メインスタイルシート
- js/main.js: 共通スクリプト
- images/: 画像ファイル
## デザインルール
- メインカラー: #2563EB(青)
- フォント: Noto Sans JP
- ブレークポイント: 768px(タブレット)、1024px(デスクトップ)
## 注意事項
- IE11はサポート対象外
- 画像は必ずWebP形式で、alt属性を設定
- ページ速度を意識(CSSは最小限に)
テンプレート2: React + TypeScript アプリ
# CLAUDE.md
## プロジェクト概要
社内タスク管理ツール。SPAとして動作。
## 技術スタック
- React 18 + TypeScript 5
- 状態管理: Zustand
- UIライブラリ: shadcn/ui
- API通信: TanStack Query
- テスト: Vitest + Testing Library
## 開発コマンド
- `npm run dev` - 開発サーバー起動(port 3000)
- `npm run build` - プロダクションビルド
- `npm run test` - テスト実行
- `npm run lint` - ESLint実行
## コーディング規約
- コンポーネントは関数コンポーネント + hooks
- ファイル名はPascalCase(例: TaskCard.tsx)
- カスタムhooksは use プレフィックス
- API型定義は types/ ディレクトリに集約
- any 型の使用は禁止
## ディレクトリ構成
src/
├── components/ # UIコンポーネント
├── hooks/ # カスタムフック
├── pages/ # ページコンポーネント
├── types/ # 型定義
├── utils/ # ユーティリティ関数
└── api/ # API通信
テンプレート3: PHPバックエンド(Laravel)
# CLAUDE.md
## プロジェクト概要
ECサイトのバックエンドAPI。REST API設計。
## 技術スタック
- PHP 8.2 / Laravel 11
- MySQL 8.0
- Redis(キャッシュ、セッション)
- Docker環境(Laravel Sail)
## 開発コマンド
- `sail up -d` - 開発環境起動
- `sail artisan migrate` - マイグレーション実行
- `sail artisan test` - テスト実行
- `sail composer require パッケージ名` - パッケージ追加
## コーディング規約
- PSR-12準拠
- FormRequestでバリデーション
- Eloquentはリポジトリパターンで使用
- N+1クエリに注意(eager loading必須)
## セキュリティ
- SQLインジェクション対策: Eloquentのプリペアドステートメント必須
- XSS対策: Bladeテンプレートの {{ }} を使用
- 認証: Laravel Sanctum
- APIレート制限: throttle ミドルウェア適用済み
テンプレート4: Pythonデータ分析プロジェクト
# CLAUDE.md
## プロジェクト概要
売上データの分析・可視化パイプライン。
## 技術スタック
- Python 3.11
- pandas, numpy(データ処理)
- matplotlib, seaborn(可視化)
- scikit-learn(機械学習)
- Jupyter Notebook
## 環境構築
- `pip install -r requirements.txt`
- データファイルは data/ ディレクトリに配置
## ディレクトリ構成
- data/: 元データ(CSV)※Gitに含めない
- notebooks/: Jupyter Notebook
- src/: Pythonスクリプト
- output/: 出力結果(グラフ等)
## コーディング規約
- PEP 8 準拠
- 型ヒントを使用
- docstringはGoogleスタイル
テンプレート5: モバイルアプリ(Flutter)
# CLAUDE.md
## プロジェクト概要
フィットネス記録アプリ。iOS/Android対応。
## 技術スタック
- Flutter 3.19 / Dart 3.3
- 状態管理: Riverpod
- ローカルDB: Drift (SQLite)
- API通信: Dio
## 開発コマンド
- `flutter run` - アプリ起動
- `flutter test` - テスト実行
- `flutter build apk` - Androidビルド
- `flutter build ios` - iOSビルド
## コーディング規約
- effective_dart に準拠
- Widget は小さく分割
- const コンストラクタを積極的に使用
- 色・テーマは theme.dart で一元管理
CLAUDE.mdに書くべきこと・書かないこと
| 書くべきこと | 書かないこと |
|---|---|
| プロジェクトの概要・目的 | APIキーやパスワードなどの秘密情報 |
| 技術スタック・バージョン | 個人の好みや感想 |
| コーディング規約 | 一般的すぎるルール(「バグを出すな」等) |
| ディレクトリ構成 | 頻繁に変わる一時的な情報 |
| 開発・ビルドコマンド | 他のドキュメントと重複する詳細仕様 |
| セキュリティ上の注意点 | READMEのコピー(役割が違う) |
| プロジェクト固有の用語・略語 | 長すぎる文章(簡潔に箇条書きで) |
.claude/ ディレクトリの構造
Claude Codeは CLAUDE.md 以外にも、.claude/ ディレクトリ内のファイルを活用します。
ディレクトリ構成
プロジェクトルート/
├── CLAUDE.md # プロジェクト全体の指示書(Git管理推奨)
└── .claude/
├── settings.json # Claude Codeの設定ファイル
└── worktrees/ # ワークツリー(自動生成)
settings.json の例
{
"permissions": {
"allow": [
"Bash(npm run *)",
"Bash(git *)"
],
"deny": [
"Bash(rm -rf *)"
]
}
}
settings.json では、特定のコマンドを自動許可または自動拒否する設定ができます。頻繁に使うコマンドを許可リストに入れておくと、毎回の確認が不要になり効率的です。
ユーザーレベルのメモリファイル
プロジェクト固有の設定とは別に、ユーザーのホームディレクトリにも設定を置けます。
# ユーザーのホームディレクトリ
~/.claude/
├── CLAUDE.md # 全プロジェクト共通の指示
└── projects/
└── {project-path}/
└── memory/
└── MEMORY.md # プロジェクト別のメモリ(自動追記可)
~/.claude/CLAUDE.md の例(全プロジェクト共通)
# グローバル CLAUDE.md
## 共通ルール
- コミットメッセージは日本語で書く
- ファイルのエンコーディングは UTF-8
- 改行コードは LF
## 私の環境
- OS: Windows 11
- エディタ: VS Code
- ターミナル: Windows Terminal
チーム開発でのCLAUDE.md活用
チームでの運用ベストプラクティス
- CLAUDE.md は Git で管理する ― チーム全員が同じ前提で作業できる
- コーディング規約を明記する ― AIが統一されたスタイルでコードを書く
- レビュー時のチェックポイントを書く ― AIにコードレビューを依頼するときの基準になる
- 定期的に更新する ― プロジェクトの進行に合わせてルールを追加・修正
CLAUDE.mdの更新戦略
| タイミング | 更新内容 |
|---|---|
| プロジェクト開始時 | 概要、技術スタック、基本ルールを記載 |
| 新しいライブラリ導入時 | 技術スタックに追加、使い方のルール追記 |
| バグが頻発する箇所を発見 | 「注意事項」として追記 |
| チームメンバー変更時 | コーディング規約の再確認と更新 |
| リファクタリング後 | ディレクトリ構成の更新 |
中級者向けヒント
- /memory コマンドで Claude Code に「これを覚えて」と伝えると、MEMORY.md に自動的に記録される
- CLAUDE.md が長くなりすぎたら、セクションごとに別ファイルに分割し、CLAUDE.md からリンクする
- Claude Codeに「CLAUDE.mdを更新して」と指示すれば、プロジェクトの現状に合わせて自動更新してくれる
- settings.json の
allowリストを活用すると、よく使うコマンドの許可確認を省略できる
まとめ
- CLAUDE.md はプロジェクトルートに置く指示書で、Claude Codeが起動時に自動読み込み
- 記載すべき内容:概要、技術スタック、コーディング規約、ディレクトリ構成、開発コマンド
- 秘密情報(APIキー等)は絶対に書かない
- .claude/settings.json でパーミッションルールをカスタマイズ可能
- ~/.claude/CLAUDE.md で全プロジェクト共通ルールを設定可能
- チーム開発では Git管理して共有するのがベストプラクティス
やってみよう
自分のプロジェクト(または練習フォルダ)で CLAUDE.md を作ってみましょう。
- Claude Code を起動して以下のように指示します:
> このプロジェクトの構成を分析して、 CLAUDE.md のテンプレートを作成してください。 - 生成されたCLAUDE.mdの内容を確認し、必要に応じて修正
- Claude Codeを一度
Ctrl+Dで終了 - 再度
claudeで起動して、CLAUDE.mdが読み込まれているか確認> このプロジェクトの技術スタックは何ですか? - CLAUDE.mdに書いた内容が回答に反映されていれば成功です!