メインコンテンツへスキップ
レッスン一覧に戻る

atom.web-builder.claude-code-settings-and-memory

Claude Codeの設定とCLAUDE.mdを整える

Claude Codeの設定とCLAUDE.mdを整える 新しい料理人をキッチンに迎えたとしましょう。何も伝えないまま作業を任せると、塩と砂糖を間違えてしまうかもしれません。だから「だしは冷蔵庫の右側」「味付けは薄...

claude-code-configuredclaude-code-configuredClaude Code を自分の PC で快適に動かす設定ができます。
想定時間未設定公開状態: draft
学習メモ

成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: config_file検証: basic_manual_check_v1

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshotlog_output

メディアメディアレッスン内に出てくる図や動画のスロットです。実際の画面やイメージで理解を補助します。

diagramscreen_capture

レッスン本文

Claude Codeの設定とCLAUDE.mdを整える

新しい料理人をキッチンに迎えたとしましょう。何も伝えないまま作業を任せると、塩と砂糖を間違えてしまうかもしれません。だから「だしは冷蔵庫の右側」「味付けは薄めが好き」と事前に伝えますよね。

CLAUDE.md(=クロード・エムディー)は、AIにその「事前説明」を伝えるファイルです。このファイルをプロジェクトのフォルダに置いておくと、Claude Codeが毎回自動的に読み込んで、あなたの意図をより正確に理解してくれます。

このレッスンでは、CLAUDE.mdを1つ作って、Claude Codeにプロジェクトのルールを伝えられるようになります。所要時間は約15分です。

CLAUDE.mdの役割図

CLAUDE.mdの役割を理解する

CLAUDE.mdは、プロジェクト(=作っているWebサイトやアプリのまとまり)のフォルダの「一番上」に置くテキストファイルです。ここに書いた内容は、Claude Codeが会話のたびに自動で読み込んでくれます。

たとえば旅行の計画をお願いするとき、「国内旅行」「予算5万円」「2泊3日」と伝えれば的確な提案が返ってきますよね。CLAUDE.mdはそれと同じで、AIに「このプロジェクトの前提条件」を伝える役割をします。

良い例: 使っている道具の名前と、守ってほしいルールを簡潔に3〜5行で書く

悪い例: 長文の企画書や関係ない個人的なメモを丸ごと貼り付ける

CLAUDE.mdを作る

まず、ターミナル(=パソコンに文字で指示を出す黒い画面)を開いて、プロジェクトのフォルダに移動してから、次の1行を打ちます。

touch CLAUDE.md

この命令は「空っぽのCLAUDE.mdファイルを新しく作る」という意味です。すでにファイルがある場合は何も起きないので、安心して実行できます。

AIに聞いてみよう: Claude Codeを起動して「CLAUDE.mdのテンプレートを作って」と頼むと、あなたのプロジェクトに合わせた雛形を提案してくれます。

内容を書き込む

お好みのテキストエディタ(メモ帳のようなもの)でCLAUDE.mdを開き、次の3つの項目を順番に書いていきます。

1. プロジェクトの概要を1行で書く

何を作っているかを一行で書きます。AIが最初に読む情報なので、ここが一番大事です。

良い例:

  • 「Next.js(=Webサイトを作るための道具)を使ったレストラン紹介サイト」
  • 「個人ブログをSupabase(=データを保存する仕組み)で管理している」

悪い例:

  • 「Webアプリを作ります」(何を作っているか分からない)
  • 「すごいサービスを開発中」(具体性がゼロ)

2. 使っている技術を箇条書きする

プロジェクトで使っている道具の名前をリストアップします。

良い例:

- Next.js 15(Webサイトの枠組み)
- Tailwind CSS(見た目を整える道具)
- Supabase(データを保存する仕組み)

悪い例: 将来的に使うかもしれない技術を全部書く(今は混乱の元になります)

AIに聞いてみよう: 何を書けばいいか迷ったら、Claude Codeに「このプロジェクトで使っている技術を一覧にして」と聞いてみましょう。package.json(=道具の一覧表)を読んで教えてくれます。

3. 守ってほしいルールを書く

Claude Codeに守ってほしい約束を書きます。あなたがAIと一緒に作業するときの「チームのルール」です。

良い例:

  • 「日本語で説明する」
  • 「変数名(=プログラム内で値につける名前)は英語にする」
  • 「1つの関数(=ひとまとまりの処理)は20行以内を目指す」

悪い例:

  • 「良いコードを書いてください」(何が「良い」か分からない)
  • 「完璧にやって」(基準が曖昧)

完成イメージ

以下がCLAUDE.mdの完成例です。コピーして自分のプロジェクトに合わせて書き換えてください。

# プロジェクト概要
Next.jsを使ったレストラン紹介サイト

# 使用技術
- Next.js 15
- Tailwind CSS
- Supabase

# ルール
- 日本語でコメントを書く
- 変数名は英語にする
- 変更を加えたら理由を一言添える

CLAUDE.mdの書き方例

読み込まれているか確認する

CLAUDE.mdを保存したら、ターミナルでClaude Codeを起動します。

claude

起動したら、次のように聞いてみましょう。

このプロジェクトのルールを教えて

CLAUDE.mdに書いた内容(プロジェクト概要、使用技術、ルール)が返ってくれば、正しく読み込まれています。

確認のコツ: もしCLAUDE.mdの内容が返ってこなかった場合は、「CLAUDE.mdを読んでいますか?」と聞いてみてください。読み込めていない場合はその理由も教えてくれます。

設定を見直す(ボーナスステップ)

CLAUDE.mdが動いたら、もう一歩進めてみましょう。Claude Codeに次のように聞いてみてください。

CLAUDE.mdの内容を見て、改善点があれば提案して

AIが「こういうルールも追加するといいですよ」と提案してくれることがあります。納得できたものだけ取り入れましょう。AIの提案を鵜呑みにせず、自分で判断することが大切です。

つまずきポイントに備える

よくある問題原因解決方法
CLAUDE.mdの内容が反映されないファイルがプロジェクトフォルダの一番上にないフォルダの一番上(ルート)に移動する
日本語が文字化けする保存形式がUTF-8でないテキストエディタで「UTF-8」を選んで保存し直す
AIの回答が的外れCLAUDE.mdの指示が曖昧「良いコードを書いて」→「変数名は英語、コメントは日本語で書いて」のように具体化
書きすぎて逆効果情報が多すぎてAIが混乱200行を超えたら整理する。優先度の高いルールを上に書く

困ったらAIに聞こう: つまずいたときは「CLAUDE.mdが読み込まれているか確認して」「CLAUDE.mdの書き方に問題がないかチェックして」とClaude Codeに直接聞くのが一番早いです。

完了チェックリスト

次の3つがすべてできていれば、このレッスンは完了です。

  • プロジェクトフォルダの一番上にCLAUDE.mdファイルがある
  • CLAUDE.mdに「概要」「使用技術」「ルール」の3項目が書かれている
  • Claude Codeを起動して「このプロジェクトのルールを教えて」と聞くと、書いた内容が返ってくる
成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: config_file

検証: basic_manual_check_v1

証跡とメディア

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshotlog_output

メディア

diagramscreen_capture
学習完了