VS Code 設定 & 使い方ガイド
Windows / VS Code 版 - ステップ 4/4
VS Code 拡張機能のインストール
Claude Codeと日本語化の拡張機能をインストールします。
Claude Codeの推奨設定
Claude Codeをより快適に使うための設定を行います。特に技術的な判断に慣れていない方向けの推奨設定です。
Bypass Permission（自動許可）の設定
Claude Codeはファイルの作成・編集・コマンドの実行など、操作のたびに「許可しますか？」と確認を求めてきます。 技術的な内容を判断するのが難しい場合、この確認が作業の妨げになることがあります。 Bypass Permissionを有効にすると、これらの確認が自動的に許可されるようになります。
設定手順
この設定をオンにすると、Claude Codeがファイルの変更やコマンドの実行を自動的に行えるようになります。 一人で学習用・開発用に使う場合は問題ありませんが、重要なプロジェクトで使う場合は、 慣れてきたら設定をオフに戻すことも検討してください。
Bypass Permissionを有効にすると、AIが自動的にファイルの変更やコマンドの実行を行います。AIが誤った操作をする可能性はゼロではありません。あくまで自己責任でご利用ください。
重要なファイルがある場合は、事前にバックアップを取ることをお勧めします。
Plan Mode の使い方
Plan Mode（プランモード）は、Claude Codeに「まず計画を立ててから実行する」よう指示する機能です。いきなりコードを書き始めるのではなく、まず何をするかの計画を見せてくれます。
Plan Modeを使うと、Claude Codeが「これからこういう作業をします」という計画を先に提示してくれます。 内容を確認してから実行に移れるので、予期しない変更を防ぐことができます。
基本的な使い方
VS Code右上のClaudeアイコンをクリックし、チャットパネルに指示を入力します。
通常のEnterではなく、Shift + Enterで送信すると、Plan Modeになります。または、チャット欄に /plan と入力してからメッセージを送信します。
Claudeが「こういう手順で作業を進めます」という計画を表示します。ファイルの作成・変更内容を事前に確認できます。
計画に問題がなければ「実行してください」「お願いします」などと返信します。修正したい場合は「○○を変更してください」と伝えます。
Shift + Enterで送信するとPlan Modeになります。
使用例
ポイント：Plan Modeでは計画の段階で修正を依頼できるため、やり直しの手間が減ります。 特に大きな作業を依頼するときに活用してください。
セットアップ完了
以下のツールとサービスの準備が整いました：
- Claude Code — AIアシスタント（VS Code内で利用可能）
- Vercel — Webアプリケーションのホスティング（トークン取得済み）
- Neon / Turso — データベース（Vercel経由で接続済み）
- GitHub — コード管理（gh CLIで認証済み）
- VS Code — エディタ（Claude Code拡張機能設定済み）
これで、Claude Codeを使ってWebアプリケーションの開発を始める準備が整いました。
困ったときは
セットアップや使い方で困ったことがあれば、画面右下の「AIに質問」ボタンをクリックしてください。このガイドの内容を理解したAIが、あなたの質問にお答えします。
また、各ページの下部にある「前へ」「次へ」リンクで、他のセットアップ手順を確認することもできます。