Claude Codeに課金して初期設定する
Claude Codeとは
Claude Codeは、Anthropicが提供するAIコーディングエージェントのCLIツール。
単なるコード補完ではなく、ターミナルやVSCodeから自然言語で指示するだけでファイルの編集・作成・テスト実行・Git操作まで自律的にこなしてくれる。
いわゆる「バイブコーディング」（ノリで指示を投げて、AIに実装を任せるスタイル）を本格的にやりたくて課金してみた。
Claude Codeに課金しました
Claudeのチャット画面の左下メニューから「プランをアップグレード」を選ぶと課金ページに移動できる。 プランはProとMaxがあるが、まずはProプランの月間契約にした。月20ドル。 クレカ情報を入力して完了。2026/3/15から課金開始。
Claude Codeをインストール
公式のクイックスタートはこちら: https://code.claude.com/docs/ja/quickstart
インストールは2通りある。
# curlでインストール
curl -fsSL https://claude.ai/install.sh | bash
# Homebrewでインストール（Mac推奨）
brew install --cask claude-codeアップデートも簡単。
brew upgrade claude-codeインストール後、ターミナルで claude コマンドが使えるようになる。初回起動時にブラウザでAnthropicアカウントの認証が行われる。
VSCodeにClaude Code拡張機能をインストール
VSCodeの拡張機能マーケットプレイスで「Claude Code」を検索してインストールする。 インストール後、サイドバーに「Claude.ai Subscription」ボタンが表示されるのでクリックしてサインイン。
これにより、VSCodeのコマンドパレットやエディタ内からClaude Codeを操作できるようになる。
初期設定
VSCodeで初めて起動すると、いくつかの設定を聞かれる。
- Dark Mode — テーマ選択（好みで）
- Claude account with subscription — Proプランのアカウントで認証
- Yes, use recommended settings — 推奨設定をそのまま使う
- Yes, I trust this folder — ワークスペースへのアクセスを許可
起動後に以下のスラッシュコマンドを実行しておくと便利。
/statusline # VSCodeのステータスバーにClaude Codeの状態を表示
/init # プロジェクトのCLAUDE.mdを自動生成/init を実行すると、コードベースを分析してプロジェクト固有の指示書（CLAUDE.md）を自動生成してくれる。これがあるとClaude Codeがプロジェクトの構成を理解した上で作業してくれるようになる。
設定ファイルの構成
Claude Codeの設定ファイルはユーザースコープとプロジェクトスコープの2層構造になっている。
~/
├── .claude/ # ユーザースコープ（全プロジェクトに適用）
│ ├── settings.json # 権限・動作に関する設定
│ ├── CLAUDE.md # AIへの指示書（全プロジェクト共通）
│ ├── skills/ # カスタムスキル
│ └── agents/ # カスタムサブエージェント
│
└── my-project/ # プロジェクトスコープ（このプロジェクトのみ）
├── .claude/
│ ├── settings.json
│ ├── CLAUDE.md
│ ├── skills/
│ └── agents/
├── CLAUDE.md # プロジェクト直下のCLAUDE.mdも有効
└── .mcp.json # プロジェクト内で利用するMCP設定
CLAUDE.mdには「日本語で回答してください」「テストを書いてから実装してください」といった指示を書いておける。ユーザースコープに書けば全プロジェクトに適用されるので、個人の作業スタイルを定義しておくと捗る。
使用方法
ターミナルから使う
claudeインタラクティブなチャットが起動する。自然言語で指示を投げると、コードの修正・ファイル作成・コマンド実行などを自律的にやってくれる。
VSCodeから使う
コマンドパレット（Cmd+Shift+P）から「Claude Code: New Conversation」を選択するとチャットウィンドウが開く。エディタで開いているファイルのコンテキストを自動的に認識してくれるので、「このファイルのここを修正して」といった指示がしやすい。
ブラウザから使う
https://claude.ai/code/
↑こちらから使える。
スマホからもコーディングできて便利そう！
Claudeアプリからも利用可能。
コンテキストを渡す
@md/claude-code-introduction.mdファイル名を @ 付きで指定すると、そのファイルの内容をコンテキストとして渡せる。大きなコードベースで特定のファイルに絞って作業させたいときに便利。
利用量確認
/usage会話を終了する
/exitまたは Ctrl + C で終了。
その他いろんなコマンド
| コマンド | 説明 |
|---|---|
/context |
コンテキストウィンドウの使用状況を確認 |
/clear |
会話履歴をクリアして新たに開始 |
/btw |
Claude Codeのメモリにちょっとした情報をメモ |
/loop |
指定したプロンプトやコマンドを定期実行（例: /loop 5m /debug） |
/batch |
複数タスクをまとめてバッチ処理 |
/simplify |
変更したコードを振り返り、冗長な部分を整理・改善 |
/refactor |
コードのリファクタリングを依頼 |
/debug |
バグの原因調査とデバッグを支援 |
/security-review |
セキュリティ観点でコード変更をレビュー |
/rewind |
直前のClaude Codeによる変更を巻き戻す |
/install-github-app
GitHub連携のセットアップをガイドするコマンド。GitHubアカウントとリポジトリを選択して連携できる。
PRとかIssueでコメントとして「@claude レビューお願い」みたいに残せば、Claude Codeがレビューしてくれるようになる。
Shift + Tab でAuto（自動承認）とManual（確認あり）のモードを切り替えられる。Autoモードにするとツール実行ごとの確認をスキップして作業が速くなるが、意図しない変更が起きやすいので注意。
スキルの使い方
スキルはスラッシュコマンド形式で呼び出せるタスクのこと。自作もできる。
GitHubと連携するものを作っておくと便利かも。
# 新しいIssueを作成
/gh-issue-create <内容>
# IssueからPRまで一貫して処理（ブランチ作成・実装・コミット・プッシュ・PR作成）
/gh-issue-pr <issue番号>
# PRのレビューコメントを確認して修正・返信まで対応
/gh-pr-resolve <PR番号>
# PRをレビューしてコメントを投稿
/gh-pr-review <PR番号>/gh-issue-prは特によく使ってて、Issue番号を渡すだけでブランチを切って実装してPRを出すところまで全自動でやってくれていい感じ。
開発の流れ
新規開発とか追加開発の場合
まずはPlan Modeで計画を出してもらって、承認するだけ。
完成したら未コミットの変更になるので、それに対してClaude Codeに以下でレビューとLinterとテストの実行をしてもらう。
/review
↓
/security-review
↓
/simplify
↓
/lint
↓
/test-unit
出来上がったらローカルGitリポジトリのファイルの変更として出てくるので差分を見る。
OKそうならGitHub Copilotにコミットコメントを自動で入力してもらってからGitにコミット。
mainブランチにコミットされたら自動的にビルドとデプロイが走るようにしている。
E2Eテストはデプロイ済みサイトに対して行う構成になってるので、デプロイ後に以下を実施。
/test-e2e他のパターン
ブラウザからJulesを利用して開発を進める（無料枠）（結構時間かかる） ↓ PRができ、自動でLinter、ユニットテスト、Playwrightのテスト、Lighthouseが走る ↓ 「@claude レビューお願い」でClaude Codeのレビューが走る ↓ 「@jules 指摘の対応お願い」でJulesが指摘に対応してくれる ↓ 目視で確認してマージ
一からバイブコーディングするパターン
- CODEXで：このワークスペースにGitHubリポジトリとREADME.mdと.gitignoreを作成して
- Claude Codeで：XXXを作りたいです。この仕様で、じっくり検討した上でまずは「要件定義書」「設計書」「ADR」のドキュメントを作成してください。わからない部分は私に都度聞いてくださいね。
- Geminiで：シニアフルスタックエンジニアとして、セキュリティ監査、パフォーマンス最適化、アーキテクチャ設計の観点から、ドキュメントを厳しく、でも建設的にレビューしてください。
- Claude Codeで：レビューしてもらったら、以下の指摘をもらいました。これらの指摘が妥当かどうかも調査して検討しながら、直すべきものは直してください。
- docsディレクトリの中身を元に、実装を進めていきます。まずは最新のベストプラクティスなどを調査して検討し、実装計画を立てていってください。今後の作業に備えてPLAN.mdとしてチェックボックスでタスク化していって。まだ実装は始めないでください。
- PLAN.mdをシニアフルスタックエンジニアとして、セキュリティ監査、パフォーマンス最適化、アーキテクチャ設計の観点から、ドキュメントを厳しく、でも建設的にレビューしてください。
- PLAN.mdをマイクロインクリメンタル手法で順番に実装していってください。終わったタスクにはチェックを入れていってください。1タスクごとに確認しますので、終わったら教えてください。
使ってみた感想
単純な機能追加やリファクタリングはかなりの精度でこなしてくれる印象。指示の粒度が細かいほど意図通りの結果になりやすい。
Proプランを契約した初週、楽しくて使いすぎてしまって週の制限に引っかかってしまった…。その上のプラン契約するか…？
とりあえず制限かかってる期間はAntigravityとかGemini CLIとかCodexとかAmazon Qなどのエージェントの無料枠を利用して凌いでいる。
/simplifyとか/reviewとかがトークン消費激しそう…？
CLAUDE.mdへのプロジェクト情報の充実と、スキルのカスタマイズが使いこなしのカギになりそう。 実際にこのブログ自体をClaude Codeで開発し続けた結果、いくつか気づきがあったのでまとめる。
/gh-issue-prが本当に全自動で最高
GitHubのIssue番号を渡すだけで、ブランチ作成 → 実装 → コミット → プッシュ → PR作成まで全部やってくれた。これが一番インパクトがあった。単純な機能追加なら人間がほぼ何もしなくても完結する。
/simplifyが万能
コードを整理してもらおうと/simplifyを実行したところ、検索ハイライトのオフセット計算に誤りがあるのを自力で見つけて修正してくれた。レビュー目的で走らせたら別のバグが取れた形で、期待以上の結果だった。
CLAUDE.mdを育てることの重要性
プロジェクトの構成・テスト方針・コードスタイルを細かく書いておくほど、毎回の指示が短くて済むようになる。たとえば「新機能を追加したらREADME.mdとCLAUDE.mdも必ず更新する」とルールを書いておくだけで、実装後に自動でドキュメントも更新してくれるようになった。
また、ユーザースコープの ~/.claude/CLAUDE.md に「日本語で回答する」「セッション終了時はログを保存する」といった個人の作業スタイルを定義しておくと、全プロジェクトに一貫して適用される。
使いこなしのコツ
Plan Modeを活用する 大きな変更の前はPlan Modeで計画を出してもらい、承認してから実装させると安全。「実装してください」とだけ言うより「まず計画を立ててください」と一言添えるだけで、意図しない変更が減る。
Autoモードは場面を選ぶ
Shift + Tabで切り替えられるAutoモード（自動承認）は作業が速くなる一方、意図しない変更が通りやすい。大きな機能開発の序盤はManualで確認しながら進めて、後半の単純作業をAutoで流すのがちょうどいい。
コンテキストが長くなったら/clear
会話が長くなるほど精度が落ちてくる傾向がある。作業の区切りで/clearして新しい会話から始めると精度が戻ることが多い。ただし/clearすると会話履歴が消えるので、重要な決定事項はCLAUDE.mdに書き残しておくと引き継ぎがスムーズ。
コンテキスト対策
- こまめに/clear
- こまめに/compact
- Sub Agentsを活用する
スマホ連携
Dispatchでスマホからデスクトップを操れるようになる
Claude in Chromeを入れると、Dispatchがブラウザ内でナビゲート、クリック、フォーム入力を行えるようにする
スマホから雑にClaude CodeやJulesに投げられる便利な指示
- このリポジトリ内のプロダクトに対して改善提案をして、GitHubのIssueに追加して
- このリポジトリ内のプロダクトをレビューして、PRを作成して
- README.mdを最新化して
- docsと実装を比較し、差分をGitHubのIssueに追加して
週に一度のレポート出力
/insightsで週次レポートを出力できる。これが結構良くできててすごい。
/recapで会話の要約ができる。