日曜日, 8月 10, 2025
日曜日, 8月 10, 2025
- Advertisment -
ホームニューステックニュースClaude Code を初めて使う人向けの実践ガイド

Claude Code を初めて使う人向けの実践ガイド


この記事は Claude Code を初めて試そうとされている方向けの記事です。

https://www.anthropic.com/claude-code

導入手順

Claude Codeは、ターミナルで動作する対話型AIコーディングツールです。コードの生成だけでなく、ファイルの編集、テストの実行、Gitの操作まで自然言語で指示できます。

以下の公式ドキュメントを参考にして導入してみてください。

よく使うコマンド

CLIコマンド(起動前)

Claude Code を起動するコマンド:

claude                
claude --continue     
claude --resume       

セッション内コマンド

claude コマンドを実行した後のセッション内で特によく使うコマンド:

  • /init – プロジェクト用のCLAUDE.mdを生成
  • /clear – コンテキストをリセット(タスクが変わったら即実行)
  • /compact – 会話を要約してトークンを節約
  • /review – Pull Request などを指定するとレビューしてくれます
  • /help – 利用可能なコマンド一覧

/model

/model で利用するモデルを選択できる。

  1. Default: 上限の50%に到達するまではOpusで、それ以降はSonnetを利用
  2. Opus: 2025-06-20時点で一番コーディング性能の高いモデル
  3. Sonnet: コスト効率と応答速度を重視したモデル

僕はMaxプランなので普段はOpusを選択しておいて、limit の警告が出たらSonnetに切り替えて使っています。(limit の警告が出てもある程度はOpus大丈夫そう?🤔)

音声入力で効率化

推奨ツール

1. Superwhisper(おすすめ)

https://superwhisper.com/

  • 文字起こしツールで、その後に Claude Sonnet4 などであと処理ができる
  • 日本語でしゃべったものを、LLMプロンプトで英語翻訳できる
  • 英語での指示の方が精度上がると感じた方は課金してでも使うのがおすすめです

2. WispFlow

https://wisprflow.ai/

  • 喋ったことを精度高く日本語文字起こしするツール
  • フィラー(「えー」など)を除去して、読みやすい日本語にする
  • 無料でも問題なく使える

3. Mac音声認識

https://pc.watch.impress.co.jp/docs/column/macinfo/1550163.html

  • 単一アプリでの利用を前提としており、Figma & VS Code など複数アプリを使う開発では使いづらいやも

なぜ音声入力?

音声入力には明確な利点があります:

  • 入力速度: 平均的な話速は150-200語/分、タイピングは40-60語/分
  • 情報量: 音声では背景・理由・期待結果を自然に含めて話す傾向がある
  • 認知負荷: キーボード操作を考えずに、問題解決に集中できる

タイピングでは「バグ修正」と書くところを、音声では「2ページ目でデータが表示されないバグを修正」のように具体的に伝えやすくなる。結果として、Claude Codeはより正確な解決策を提示できる。

メモリシステムの活用

メモリファイルの種類

ファイル 場所 用途
CLAUDE.md プロジェクトルート チーム共有のルール
CLAUDE.md .claude/ 個人のプロジェクト設定
CLAUDE.md ~/.claude/ 全プロジェクト共通の個人設定
settings.json .claude/ プロジェクトでのClaude Codeの設定
settings.local.json .claude/ 個人&プロジェクトでのClaude Codeの設定

CLAUDE.md は Claude Code の起動時に読み込んでくれるので、プロジェクトの情報や、Claude Code への振る舞いの希望を記述してください。

初期の CLAUDE.md/initで作成できます。

その後は Claude Code や Claude を使いつつ、プロジェクトに合わせてCLAUDE.mdをアップデートしていくのがおすすめです。

https://x.com/naoya_ito/status/1929073291970363545

.claude/CLAUDE.md.claude/settings.local.json などは git の対象外にすることでチームに影響を与えずに設定ができます。

https://docs.anthropic.com/en/docs/claude-code/memory

パーミッション管理で効率化

頻繁に使う安全なコマンドは事前に許可しておくと、作業が中断されない。

settings.jsonのpermissionについて

  • permission.allow: 設定した操作・ファイルは、原則として実行される
  • permission.deny: 設定した操作やファイルは、原則としてClaude Codeは実行しない (allow よりも優先)
  • どちらにもない操作・ファイル: 実行する前に人間に確認を取る

自動承認をするコマンドの設定

.claude/settings.jsonに追加:

{
  "permissions": {
    "allow": [
      "Bash(pnpm test)" 
      "Bash(gh pr view:*)", 
    ]
  }
}

自動承認を避けるべきコマンド

  • npm install 等のパッケージの追加(セキュリティリスク)
  • git commit / push など(破壊的変更を防ぐために、人の確認が必要)
  • env ファイルの読み込み (重要なキーが含まれる場合があるため)
  • rm など (致命的なファイルの削除を防ぐ)

permissions.denyの設定

.claude/settings.jsonに以下のように設定すると自動承認を避けられる:

{
  "permissions": {
    "deny": [
      "Bash(git commit:*)", 
      "Bash(git push:*)" 
      "Bash(rm:*)", 
      "Bash(sudo:*)", 
      "Read(.env.*)" 
    ]
  }
}

理想的には Docker や Dev Container に Claude Code の作業領域を閉じ込めると、より安全に実行できます。(模索中です 🙇)

効果的なワークフロー

1. VS Code/Cursorとの並行利用

VS Code/Cursorを起動して、片側でターミナル => Claude Code を起動、もう片側でVS Code/Cursorのエディタを開き、リアルタイムで変更を確認しながら作業。

Command + Option + K でエディタで開いているファイルを、コンテキストに含めることもできる。

2. Plan mode(Shift+Tab×2)

Shift+Tab を押すと Mode が切り替わる。
Plan Mode で実装前に計画を立てる。コンテキストを最小限に抑えながら、実装方針を整理できる。

3. /clear や /compact

タスクが変わったら必ず/clear。コンテキストの肥大化を防ぎ、精度を維持する。

/compact は今までのコンテキストを圧縮してくれるので、会話が長くなりすぎた時はこちらもおすすめ。

4. 即座の中断と修正

間違った方向に進み始めたら:

  • Escで即座に停止
  • 明確な修正指示を与える
  • 必要なら変更をrevertさせる
  • Esc×2で前のメッセージを編集して再実行

細かいフィードバックを行うのがおすすめ。

5. 画像・スクリーンショットの活用

ターミナルに画像を Shift を押しながらドラッグ&ドロップ、もしくは Control + V (macOS)で貼り付けできる。デザインしたものを画像で渡すと、コンテキストに含めてくれる。

6. git addで頻繁にステージング

良い変更ができたら即座にgit add。Claude Codeが予期せぬ変更を加えても、簡単に元に戻せる。

MCP連携による拡張

Figma MCP

https://help.figma.com/hc/en-us/articles/32132100833559-Guide-to-the-Dev-Mode-MCP-Server

(👆 リンクをコピーして、Claude Codeに貼り付けると認識してくれます)

  • デザインからコード生成
  • SVGアセットの自動ダウンロード
  • コンポーネント仕様の取得

Context7 MCP

https://github.com/upstash/context7

claude mcp add --transport sse context7 https://mcp.context7.com/sse
  • 最新のライブラリドキュメント参照
  • バージョン固有の情報取得
  • 正確なAPIリファレンス

Playwright

https://github.com/microsoft/playwright-mcp

claude mcp add playwright npx @playwright/mcp@latest
  • ブラウザの自動操作
  • E2Eテストの生成
  • スクリーンショット取得

GitHub 連携

https://github.com/github/github-mcp-server

現状、ghコマンドで困っていないので試していないですが、GitHub の公式 MCP を使うと柔軟に GitHub との連携ができそうです。

効率的な使い方のコツ

段階的なアプローチ

  • こまめに実行結果を確認
  • 間違いがあれば即座に指摘
  • 良い結果はgit addで保護

明確な指示

❌ 悪い例:「このコードを改善して」
✅ 良い例:「このコードのパフォーマンスを改善して。特に配列の処理部分で、現在O(n²)になっている部分をO(n)にしたい」

思考モードで深い分析を促す

プロンプトに以下のような言葉を付け加えるとより熟考してくれるようになる。

思考レベル

  • think – 基本的な思考
  • think hard – より深い思考
  • think harder – さらに深い思考
  • ultrathink – 最大限の思考時間

1-2回実行してうまくいかない場合は、ultrathink をつけて依頼すると解決することが多い。

Taskツール(サブエージェント)で多角的分析

Taskツールは、メインのClaude Codeとは別のサブエージェントを起動し、並列で作業させる機能。複雑な問題の調査や、複数の観点からの分析に有効。

メリット

  • メインタスクのコンテキストを保護(トークン節約)
  • 複数の観点から並列で分析できる
  • 各サブエージェントが独立して深い調査を実行

使用例

> Taskツールを使って、このコンポーネントを4つの観点(パフォーマンス、アクセシビリティ、保守性、UX)から分析して

まとめ

Claude Codeは単なるコード生成ツールではなく、開発パートナー。効果的に使うには:

  1. Plan modeで計画を立てる
  2. 音声入力を活用する
  3. 即座にフィードバックする
  4. MCPで機能を拡張する

これらが、現時点での自分がやっているフローです。試行錯誤しているので、良い方法があったらアップデートしていきます。(より良い使い方あったらぜひ教えてください🙇)

その他 Tips

コスト確認

https://github.com/ryoppippi/ccusage

npx ccusage@latest          
npx ccusage@latest blocks   

タスク完了通知の設定例

.claude/settings.local.json または .claude/settings.json に以下のような設定を追加すると通知音が鳴るそうです。

{
  "preferredNotifChannel": "terminal_bell"
}

ただ、なぜか僕の環境ではうまくいきません😭

なので、代わりに~/.claude/CLAUDE.md(全プロジェクト共通の個人設定)に以下を追加しています。

##通知

**条件**: 条件**: クロードコードがタスクを終了したとき。

**アクション**: Action**: 通知を表示するには以下のコマンドを実行します:

\bash
osascript -e 'display notification "${message}" with title "Claude Code" sound name "Glass"'
 ¦コマンドを実行して通知を表示する。

ここで、`${message}` は、Claude Code がユーザーに通知する必要のある内容に基づいて決定する。

display notification 以外でも say コマンド等、使いやすいものでカスタマイズしてみてください。

お願い

Claude Code 使い始めて2週間なので理解不足や、もっと良い使い方等あると思います。よければぜひお気軽にコメント等で教えていただけると嬉しいです 🙇

参考サイト

https://spiess.dev/blog/how-i-use-claude-code

https://www.anthropic.com/engineering/claude-code-best-practices



Source link

Views: 0

RELATED ARTICLES

返事を書く

あなたのコメントを入力してください。
ここにあなたの名前を入力してください

- Advertisment -