How to Set Up Claude Code & Plugins — Step-by-Step Guide

When I first heard about Claude Code I thought it was just another chatbot. Turns out, it's an actual coding assistant that lives in your terminal, reads your entire project, and can make changes to your files. I was skeptical until I tried it. Here's the full walkthrough of everything I did to get it set up and running — plus how I added plugins to make it even more useful.

Step 1: Install Node.js (if you haven't already)

Claude Code is installed via npm, which means you need Node.js first. If you already have it, skip this step.

nodejs.org — grab the LTS version for your operating system

terminal
# Check if you already have Node.js
node --version
→ v20.x.x means you're good to go

# If not installed, download from:
# https://nodejs.org (pick the LTS version)

# On Windows (via winget):
winget install OpenJS.NodeJS.LTS

# On Mac (via Homebrew):
brew install node

# On Linux (Ubuntu/Debian):
sudo apt install nodejs npm

Step 2: Install Claude Code

This is one command. Seriously. I was expecting a complicated setup process and it took about 30 seconds.

terminal
# Install Claude Code globally
npm install -g @anthropic-ai/claude-code

# Verify it installed correctly
claude --version
→ claude-code v1.x.x

Heads up about accounts

You'll need either a Claude Pro/Max/Team subscription or Anthropic API billing set up. The first time you run claude it'll open your browser to sign in.

Step 3: Run Claude Code in your project

Navigate to any project folder and run claude. That's the whole command. Claude reads your project structure, understands the codebase, and starts an interactive session where you can ask it to do things in plain English.

Claude Code reads your entire project automatically when you launch it

terminal
# Navigate to your project
cd ~/my-project

# Start Claude Code
claude

# First time: it opens your browser to authenticate
→ Opening browser for authentication...
→ Authentication successful!

# Now just type what you want:
> explain what this project does
> add a dark mode toggle to the settings page
> fix the bug in the login form

The first thing I asked was "explain what this project does" and Claude gave me a clear breakdown of every file, the architecture, and how things connected. That alone was worth the install — I was working on someone else's codebase and it saved me hours of reading.

Step 4: Connect to VS Code

You can use Claude Code directly in your terminal, but it also works inside VS Code's integrated terminal. That means you can have Claude open right next to the files it's editing. Here's how:

1

Open VS Code and go to your project folder

2

Open the integrated terminal (Ctrl+` on Windows/Linux, Cmd+` on Mac)

3

Type claude and hit Enter

4

Run /terminal-setup to configure Shift+Enter for multiline input

There's also a dedicated VS Code extension you can install from the Extensions marketplace — search for "Claude Code" by Anthropic. It gives you a sidebar panel and some additional integrations.

Step 5: Install your first plugin

Plugins are what took Claude Code from "useful" to "amazing" for me. They add specialized skills, new slash commands, and extra capabilities. Installing one takes about 5 seconds.

The /plugin command opens an interactive browser where you can pick and install plugins

inside Claude Code
# Open the plugin marketplace
/plugin

# Use arrow keys to browse, Enter to install
# Try "frontend-design" first — it's incredible

# After installing, you get new slash commands:
/frontend-design → activates the design skill

# Check installed plugins anytime:
# Look in ~/.claude/plugins/installed_plugins.json

My recommendation: start with the frontend-design plugin. It completely transforms how Claude generates HTML and CSS — instead of generic, cookie-cutter code, it produces genuinely well-designed interfaces with proper typography, color systems, and animations. This entire website was built with it.

Step 6: Set up your first MCP server (optional)

MCP (Model Context Protocol) lets Claude connect to external tools and data. You don't need this to get started, but once you're comfortable, it opens up a ton of possibilities. The easiest way to start is with pre-built servers.

claude_desktop_config.json
// Add to your Claude Desktop config:
// Mac: ~/Library/Application Support/Claude/
// Win: %APPDATA%\Claude\

{
  "mcpServers": {
    "filesystem": {
      "command": "npx",
      "args": [
        "@modelcontextprotocol/server-filesystem",
        "/path/to/allowed/folder"
      ]
    }
  }
}

After saving the config and restarting Claude Desktop, Claude can now read and write files in the folder you specified. There are 500+ pre-built servers for things like GitHub, Google Drive, Slack, and Postgres — check them out at the official MCP servers directory.

Quick reference: commands I use daily

claude

Start a session in the current directory

/clear

Reset conversation context

Escape

Stop Claude mid-response

Ctrl+T / Cmd+T

Toggle Extended Thinking

/plugin

Browse and install plugins

/help

See all available commands

Want to go deeper?

Check out the full Claude Code category page for more tutorials, or take Anthropic's free course.

More Claude Code Tutorials Official Docs

Getting Started with Claude Code & Plugins