Install Claude Code in VS Code in 10 minutes, Quentin IA Marketing

Before you start

Most people use Claude on claude.ai or through Claude Cowork. That's fine for one-off questions, but if you really want to push Claude to its limits, you need to connect it directly to your code editor.

Claude Code inside VS Code means Claude sees your entire project: every file, your structure, your history. It can create, edit and delete files directly. It's a whole other level.

Claude AI Lab

The Claude AI Lab is my Skool community where I share my Claude systems and the more advanced modules. Entry is free.

Join the Lab →

✅What you need

VS Code installed — Download it for free at code.visualstudio.com if you haven't already.

An Anthropic account — That's the company behind Claude. You'll log in with your existing account or create one.

A Claude subscription (Pro, Max or API) — Claude Pro at $20/month is enough to get started. Claude Max ($100 or $200/month) for heavy use. Or pay-as-you-go API credits.

Node.js installed — Required by the Claude Code extension. Download it at nodejs.org (LTS version recommended).

Why VS Code?

VS Code is the most widely used code editor in the world. Claude Code integrates natively, giving you an AI assistant that understands your whole project, not just a snippet pasted into a chat.

Install the Claude Code extension

⚙️5 steps to install Claude Code in VS Code

Open VS Code — Launch Visual Studio Code on your computer. If you don't have it yet, download it at code.visualstudio.com.

Open the extensions marketplace — Click the Extensions icon in the left sidebar, or use the shortcut Cmd+Shift+X (Mac) or Ctrl+Shift+X (Windows/Linux).

Search for "Claude Code" — Type "Claude Code" in the search bar. The official extension is published by Anthropic. Make sure that's the one you pick.

Click "Install" — Click the blue "Install" button. The install takes a few seconds. VS Code downloads and activates the extension automatically.

Verify the install — Once installed, you'll see the Claude Code icon appear in your left sidebar. You can also open the panel with Cmd+Shift+P and then type "Claude".

💡Alternative: install via terminal

→

If you prefer the command line, you can also install Claude Code globally with: npm install -g @anthropic-ai/claude-code. Then type claude in your terminal to launch Claude Code directly.

Connect and get started

⚙️6 steps to launch your first conversation with Claude inside your project

Open the Claude Code panel — Click the Claude icon in the left sidebar of VS Code. The chat panel opens.

Log in to your account — Claude Code asks you to log in. Click the link, sign in with your Anthropic account (the one with your Pro, Max subscription or your API credits).

Authorize access — Accept the permissions in the browser. You'll be redirected back to VS Code automatically. The panel now shows "Connected".

Open your project folder — Go to File → Open Folder and select your project folder. Claude Code works at the folder level: it sees everything inside.

Send your first message — In the Claude Code panel, type your first question. For example: "Explain the structure of this project" or "Build me a landing page".

Approve the actions — Claude Code asks for your permission before creating or editing files. You always stay in control. Approve each action or decline it.

The key difference

Unlike claude.ai, Claude Code sees every file in your project. It understands the structure, the dependencies, the existing code. It doesn't work blind: it knows exactly where it's making changes.

Set up CLAUDE.md

📄What is CLAUDE.md?

CLAUDE.md is an instructions file that Claude reads automatically at the start of every new conversation. It's your project's memory. You put everything Claude needs to know to be relevant: your tech stack, your code conventions, your business rules, your project context.

⚙️How do you create it?

Type /init in the Claude Code chat — That's the magic command. Claude automatically analyzes all your project files (package.json, folder structure, existing code, etc.).

Claude generates a tailored CLAUDE.md — It creates a CLAUDE.md file at the root of your project with the instructions it considers relevant. You can edit and expand it anytime.

Example content

# My Project - Claude Instructions

## Tech stack
- Frontend: React + TypeScript + Tailwind
- Backend: Node.js + Express
- Database: PostgreSQL + Prisma

## Conventions
- React components in PascalCase
- Files in kebab-case
- Tests required for every new feature

## Context
- B2B SaaS for marketing agencies
- MVP launch planned for June 2026

Why it matters

Without CLAUDE.md, Claude starts from scratch in every conversation. With it, Claude knows your project, your stack, your preferences. It's the difference between an intern and a teammate who knows the project by heart.

3 cases where Claude Code crushes the rest

claude.ai and Claude Cowork are fine for chatting. But for building, debugging and refactoring, Claude Code inside VS Code is in another category entirely.

🌐

Build a complete website

Claude Code sees all your files, creates the components, edits the routing, adds the styles, and can spin up the dev server for you. On claude.ai, you have to copy-paste every file one by one. With Claude Code, a single prompt is enough to generate a working site.

🐛

Debug an error in 30 seconds

Paste the error message into the chat. It reads the logs, finds the file involved, identifies the cause, and applies the fix directly. On claude.ai, you have to paste the error, the whole file, the context, then copy the fix back by hand.

🛠️

Refactor an entire project

Claude Code can edit 20 files at once while understanding the dependencies between them. Rename a variable everywhere, migrate from one library to another, restructure a folder. On claude.ai, it's file by file, with no way to compare.

Pro tip