Slide 1

Slide 1 text

Claude Code のすすめ 話題のClaude 4とClaude Codeに入門! 2025年6月4日 ぬこぬこ 1 / 28

Slide 2

Slide 2 text

はじめに 「〇〇する方法」という切り口で Claude Code の一次情報をまとめてみました Claude Code は Terminal 上で動作するエージェント型のコーディングツール インストールはたったのコマンド一行(Node.js 環境が必要) ほぼ毎日アップデートが続いており、機能が増えることはもちろん減ることもあるので注意 公式ドキュメントが開発に間に合っていないので、半信半疑で読むことをお勧めします 今日は何を話さないか Claude の理論的な話(手を動かしていただきたいのですっ飛ばします) Claude Code Action(お話しできるほど使い込んでいません) Codex や Devin などのコーディングエージェントツールとの比較 追い付き追い越されの時代にどれが良いか決めるのは不毛、翌週には変わります 1 / 28

Slide 3

Slide 3 text

まず何からやればいいの? 1. Claude Code のセットアップ Claude Max プランは必須ではありません。もしまだ Claude Code を使ったことがないよ、という方は今 すぐ Anthropic Console から $5 課金して Anthropic API 経由で Claude Code を使ってみてください。 2. Claude Code Tutorial セットアップが終わったら、騙されたと思ってとりあえずこちらの公式チュートリアルをやってくださ い。 https://docs.anthropic.com/en/docs/claude-code/tutorials brew install node # Node.js をインストールする npm install -g @anthropic-ai/claude-code # Claude Code をインストールする claude "/login" # Claude Code を実行、ログイン 1 / 28

Slide 4

Slide 4 text

チェックリスト ✔︎ /init を使ってみる ✔︎ 画像入力を使ってみる ✔︎ ultrathink を使ってみる ✔︎ --dangerously-skip-permissions を使ってみる ✔︎ CLAUDE.md を作ってみる ✔︎ VS Code から使ってみる ✔︎ カスタムスラッシュコマンドを作ってみる ✔︎ Claude Desktop に入れた MCP をインポートしてみる ✔︎ Claude Code をアップデートしてみる ✔︎ Git worktree を使ってみる 1 / 28

Slide 5

Slide 5 text

CLAUDE.md を設定する方法 Claude Code が起動時に読みにいくファイルが CLAUDE.md 。 CLAUDE.md がプロジェクト内あるいは ~/.claude 内に存在すれば読み込んでくれます。Anthropic の GitHub リポジトリの幾つかは CLAUDE.md が入っているので、書き方など参考になります。 CLAUDE.md に @ パス の形式でファイルを指 定するとその先も読み込んでくれます。セッション中でも /init で作成することができ、 /memory で追 記することができます。 種類 ファイルパス 用途 プロジェクトメモリ ./CLAUDE.md チーム内で共有する指示 ユーザーメモリ ~/.claude/CLAUDE.md プロジェクトを跨いで反映されるユーザーの 指示 プロジェクトメモリ(ローカ ル) ./CLAUDE.local.md プロジェクトを跨がないユーザーの指示 (Gitignore の対象、非推奨) 1 / 28

Slide 6

Slide 6 text

画像を入力する方法 方法は三つあります。画像は複数枚でも入力可能です。 1. スクリーンショットをペースト(Mac の場合) 1. Cmd + Ctrl + Shift + 4 でスクショをそのままクリップボードに保存できます 2. Ctrl+v でペースト( Cmd ではない点に注意) 2. ドラッグ&ドロップ 画像ファイルを Claude Code のテキスト入力エリアに直接ドラッグ(ただし、Terminal 上だと問題ない のですが、VSCode 上の Claude Code だと私の環境ではうまくいきませんでした) 3. ファイルパスを指定 ファイルの参照時と同様に @path/to/image.png で画像ファイルを指定。 1 / 28

Slide 7

Slide 7 text

スラッシュコマンド 1 /bug フィードバックを送信する /clear 会話履歴をクリアして、コンテキストを空にする /compact [ 指示] 要約をコンテキストに維持しつつも、会話履歴をクリアする /config 設定パネルを開く /cost 現在のセッションの総コストと期間を表示 /doctor Claude Code のインストールに関するヘルスチェック /exit REPLを終了 /help ヘルプとコマンド一覧表示 /ide IDE 統合を管理、状態を表示 /init コードベースドキュメントと共に新しい CLAUDE.md ファイルを初期化 /install-github-app リポジトリに Claude Code Action を設定 /login Anthropicアカウントを切り替え 1 / 28

Slide 8

Slide 8 text

スラッシュコマンド 2 /logout Anthropicアカウントからサインアウト /mcp MCPサーバーの接続状況表示(MCP サーバの登録はできない) /memory Claudeメモリファイルを編集 /migrate-installer グローバルnpmインストールからローカルインストールに移行 /model Claude CodeのAIモデルを設定 /permissions ツール許可・拒否の権限ルール管理(旧 /allowed-tools) /pr-comments GitHubプルリクエストからコメントを取得 /release-notes リリースノートを表示 /review プルリクエストをレビュー /status バージョン、モデル、アカウント、API接続、ツール状態を含むClaude Code状態表示 /vim VimモードとNormalモードを切り替え new! /upgrade レートリミットのゆるい Claude Max プランにアップグレードするページを開く 1 / 28

Slide 9

Slide 9 text

カスタムスラッシュコマンド プロジェクト共有コマンド 引数付きコマンド ユーザーコマンド mkdir -p .claude/commands echo " このコードのパフォーマンスを分析し、3 つの最適化案を提案してください" > .claude/commands/optimize.md /project:optimize echo "Issue #$ARGUMENTS を分析して修正してください。手順: 1. 問題の理解 2. 関連コードの特定 3. 解決策の実装 4. テスト追加 5. PR 説 /project:fix-issue 123 mkdir -p ~/.claude/commands echo " セキュリティ脆弱性の観点からコードレビューを実施" > ~/.claude/commands/security-review.md /user:security-review 1 / 28

Slide 10

Slide 10 text

モデルを切り替える方法 claude コマンドの引数にて 環境変数で指定 ユーザー設定ファイル( ~/.claude/settings.json )に記載 スラッシュコマンド claude --model sonnet ANTHROPIC_MODEL='claude-opus-4-20250514' { "model": "sonnet" } /model 1 / 28

Slide 11

Slide 11 text

claude コマンドの使い方 1 claude -d, --debug デバッグモード有効化 claude --verbose 詳細モード設定 claude -p, --print レスポンスを表示して終了(パイプ処理などに使う) claude --output-format 出力形式(text/json/stream-json) claude --mcp-debug 非推奨になった。代わりに claude --debug を使う。 claude --dangerously-skip-permissions あらゆる権限を与えて自律的に実行 1 / 28

Slide 12

Slide 12 text

claude コマンドの使い方 2 claude --allowedTools 許可するツール名リスト claude --disallowedTools 拒否するツール名リスト claude --mcp-config JSONファイルまたは文字列からMCPサーバーを読み込み claude -c, --continue 最新の会話を継続 claude -r, --resume [sessionId] 会話を再開 claude --model セッション用モデル指定 claude -v, --version バージョン番号を出力 claude -h, --help コマンドのヘルプを表示 1 / 28

Slide 13

Slide 13 text

IDE 統合 サポート済みの IDE Visual Studio Code(Cursor、Windsurf を含む) JetBrains IDEs(PyCharm、WebStorm、IntelliJ、GoLand) 恩恵 クイック起動: Cmd+Esc (Mac)/ Ctrl+Esc (Win/Linux) diff 表示: IDE 内でコードの変更差分をハイライト表示 開いているファイルをチャットに: Cmd+Option+K (Mac)/ Alt+Ctrl+K (Win/Linux) シンタックスエラーの共有: IDE 側で発見されたエラーを自動的に Claude Code に共有 選択部分の共有: 選択している範囲の文字列や開いているタブを自動的に共有 Claude Code から /ide をすれば紐付けられるので、実は IDE 上で Claude Code を開かずとも良い 1 / 28

Slide 14

Slide 14 text

セッション中のショートカット ! - bash モード開始(例: !ls -la ) / - スラッシュコマンドの実行(例: /config ) @ - ファイルの参照(例: @src/main.py ) # - メモリー機能(例: #Python のパッケージマネージャにはuv を使いなさい。) CLAUDE.md へ内容を追記してくれる ESC を 2 回連続 - 直前の操作の取り消し Shift + Tab - 編集や提案を自動で承認する Ctrl + r - 詳細出力モードへ切り替え \ + Return - 改行の入力 1 / 28

Slide 15

Slide 15 text

Claude Code を安く使う方法 そもそも利用する上でどのくらいかかるか? Anthropic 曰く、開発者ひとりあたりの一日の平均利用コストは $6(9 割は $12 以下)。Claude Max プ ランの場合、Claude Code の費用はサブスクリプションに含まれます。API 経由だと Sonnet 4 が標準、 Max プランだと Opus 4 が標準(レートリミット 50% 以降 Sonnet 4)。使用した料金をカウントするパ ッケージもありますが、個人的にはそんなに気にしなくて良いと考えています。私は API クレジットがあ るのでしばらく Max プランは契約せずいきます。 Development Partner Program Claude Code セッションのデータ共有に同意すること(=学習 OK の許可)で割引を受けられるプログラ ム。Claude Sonnet 4 で入力トークンが 30% 割引、Claude Opus 4 で入力トークンが 6% 割引。2025 年 7 月 31 日まで。 1 / 28

Slide 16

Slide 16 text

Claude Code の更新情報はどこで確認できる? npm 基本的にはここが最速 https://www.npmjs.com/package/@anthropic-ai/claude-code CHANGELOG バージョンと紐付く変更点 https://github.com/anthropics/claude-code/blob/main/CHANGELOG.md /release-notes コマンド CHANGELOG の内容に同じ 1 / 28

Slide 17

Slide 17 text

claude config コマンドの設定方法 claude config get 設定値を取得 claude config set 値を設定 claude config remove [values...] 設定値または項目を削除 claude config list すべての設定された値を一覧表示 claude config add 設定配列に項目を追加 claude config help [command] コマンドのヘルプを表示 例: claude config set -g theme dark Deprecated claude config commands in favor of editing settings.json 直近のアプデで上記のようにあり、今後縮小されるようですので、基本は設定ファイルを直書きするもの が良いかと思われます。 1 / 28

Slide 18

Slide 18 text

claude mcp コマンド claude mcp serve Claude Code MCPサーバーを開始 claude mcp add [args...] サーバーを追加 claude mcp remove MCPサーバーを削除 claude mcp list 設定済みMCPサーバーを一覧表示 claude mcp get MCPサーバーの詳細を取得 claude mcp add-json JSON文字列でMCPサーバーを追加 claude mcp add-from-claude-desktop Claude Desktop から MCP サーバーをインポート Claude Desktop の提供は Mac と WSL のみなので、Linux は非対応 claude mcp reset-project-choices プロジェクト内の承認・拒否されたプロジェクトスコープサ ーバーをリセット claude mcp help [command] コマンドのヘルプを表示 1 / 28

Slide 19

Slide 19 text

その他の claude コマンド claude migrate-installer グローバルnpmインストールからローカルに移行 claude doctor Claude Code自動更新機能の健全性チェック claude update アップデートのチェックとインストール 1 / 28

Slide 20

Slide 20 text

Model Context Protocol(MCP)の設定の方法 具体で言うと Playwright と Firecrawl の場合こうなります。それぞれローカル MCP サーバ&リモート MCP サーバをユーザースコープとしています(次のページで解説)。 # MCP サーバーの追加(Stdio ) claude mcp add [args...] # SSE サーバーの追加 claude mcp add --transport sse # 設定済みサーバーの一覧表示 claude mcp list # サーバーの削除 claude mcp remove claude mcp add playwright -s user npx @playwright/mcp@latest claude mcp add firecrawl -s user --transport sse https://mcp.firecrawl.dev/fc-XXXXXXXXXX/sse 1 / 28

Slide 21

Slide 21 text

MCP のスコープの指定方法 スコープは三つあります。 local(デフォルト)現在のプロジェクトのユーザー設定 project チーム全体で共有(.mcp.json ファイルに保存される) user 全プロジェクトで利用可能なユーザーー設定 プロジェクト内で共有の MCP の場合 自分だけで使いたい MCP の場合 個人的には、MCP サーバを毎回入れるのは大変なので、基本的には -s で入れておくのをお勧めします。 claude mcp add shared-tool -s project /path/to/tool claude mcp add my-tool -s user /path/to/tool 1 / 28

Slide 22

Slide 22 text

Claude Code を閉じる方法 /exit コマンド スラッシュコマンドに用意されています。 Ctrl + C を 2 回連続で押す すぐに押さないといけません。 1 / 28

Slide 23

Slide 23 text

Claude にたくさん考えてもらう方法 他社のモデルでリーズニングと言われるような、推論時に思考過程を含む出力トークン数を増やし、難し いタスクを解きやすくする機能が Claude にもあり、それを Extended Thinking と言います。OpenAI の o のつくモデルのようになんでもかんでも考えるモデルとは打って変わって、Claude はどれだけ考えてくれ るかを調整できるハイブリッドリーズニングモデルです。明示的に指定して初めて思考過程を見せてくれ るモデルです。設計時や難しめのデバッグ、実装計画、分析などによし。 注: リーズニングが有効なタスクとそうでないタスクがあるので濫用は禁物 発動条件と思考に割り当てるトークン数 まず、環境変数 MAX_THINKING_TOKENS が指定されていればキーワードに関係なくその値が優先されま す。MAX_THINKING_TOKENS が指定されておらず、特定のワードが含まれている時に三段階で思考に割 り当てられるトークン数が決定します。現状 8 つの言語に対応。 BASIC(4,000) 「考えて」 「think」 MIDDLE(10,000) 「よく考えて」 「もっと考えて」 「たくさん考えて」 「think hard」 「megathink」 HIGHEST(31,999) 「熟考」 「深く考えて」 「しっかり考えて」 「ultrathink」 「think harder」 1 / 28

Slide 24

Slide 24 text

まとめ 兎にも角にも Claude Code を使ってみてください! 1. npm install -g @anthropic-ai/claude-code 2. 公式チュートリアル https://docs.anthropic.com/en/docs/claude-code/tutorials 3. よく使う操作を何回か使って手に馴染むか判断してください 4. チェックリストができたら次のフェーズに進めます! Claude Code は現在進行形で日々アップデートのあるツールです。正直 unstable で破壊的変更が大きな アプデのタイミングで現れます。公式ドキュメントもまってくもって追いついていません。それでも開発 体験が変わる感覚が味わえるので、ぜひ今日から使ってみてください! Claude Code はいいぞ! 1 / 28

Slide 25

Slide 25 text

チェックリスト(再掲) ✔︎ /init を使ってみる ✔︎ 画像入力を使ってみる ✔︎ ultrathink を使ってみる ✔︎ --dangerously-skip-permissions を使ってみる ✔︎ CLAUDE.md を作ってみる ✔︎ VS Code から使ってみる ✔︎ カスタムスラッシュコマンドを作ってみる ✔︎ Claude Desktop に入れた MCP をインポートしてみる ✔︎ Claude Code をアップデートしてみる ✔︎ Git worktree を使ってみる 1 / 28

Slide 26

Slide 26 text

参考文献 1 https://github.com/anthropics/claude-code https://github.com/anthropics/claude-code-action https://github.com/anthropics/claude-code-base-action https://docs.anthropic.com/en/docs/claude-code/overview https://docs.anthropic.com/en/docs/claude-code/getting-started https://docs.anthropic.com/en/docs/claude-code/common-tasks https://docs.anthropic.com/en/docs/claude-code/cli-usage https://docs.anthropic.com/en/docs/claude-code/ide-integrations https://docs.anthropic.com/en/docs/claude-code/memory https://docs.anthropic.com/en/docs/claude-code/settings https://docs.anthropic.com/en/docs/claude-code/security https://docs.anthropic.com/en/docs/claude-code/team 1 / 28

Slide 27

Slide 27 text

参考文献 2 https://docs.anthropic.com/en/docs/claude-code/monitoring-usage https://docs.anthropic.com/en/docs/claude-code/costs https://docs.anthropic.com/en/docs/claude-code/bedrock-vertex-proxies https://docs.anthropic.com/en/docs/claude-code/github-actions https://docs.anthropic.com/en/docs/claude-code/sdk https://docs.anthropic.com/en/docs/claude-code/tutorials https://docs.anthropic.com/en/docs/claude-code/troubleshooting https://support.anthropic.com/en/articles/9797557-usage-limit-best-practices https://support.anthropic.com/en/articles/11145838-using-claude-code-with-your-max-plan https://support.anthropic.com/en/articles/10186004-api-console-roles-and-permissions https://support.anthropic.com/en/articles/11174108-about-the-development-partner-program https://support.anthropic.com/en/articles/11014257-about-claude-s-max-plan-usage https://support.anthropic.com/en/articles/11408405-claude-4-invite-contest 1 / 28

Slide 28

Slide 28 text

参考文献 3 https://www.anthropic.com/news/claude-4 https://www.anthropic.com/claude-code https://www.anthropic.com/engineering/claude-code-best-practices https://www.anthropic.com/news/Introducing-code-with-claude https://www.youtube.com/watch?v=6eBSHbLKuN0 https://www.youtube.com/watch?v=AJpK3YTTKZ4 1 / 28