Set up Claude Code

What is Claude Code?

Claude Code is a command-line tool from Anthropic. Instead of copy-pasting code between claude.ai and your editor, you run claude in your terminal inside a project folder. Claude can then read your files, run commands, write code, and commit to git — all by talking to it in plain English.

Think of it as: claude.ai in chat window → good for questions. Claude Code in terminal → good for actually building software.

💡 Why the terminal?

Because Claude Code can touch your actual files, run your tests, commit to git, and iterate. A browser chat can only show text. Terminal-based Claude is the closest thing to working with a real junior developer who happens to be very fast.

Prerequisites

Before you start, make sure you have these. Most are one-time setup.

💻

A Mac or Windows laptop

Running macOS 12+ or Windows 10/11. Linux works too (not covered here).

🌐

Internet connection

For installing tools and talking to Claude's servers.

🔐

A claude.ai account

Free tier works for the first few prompts. A Pro subscription ($20/mo) is recommended — it unlocks Claude Code access without needing a separate API key.

⌨️

Comfort pasting commands

You'll copy-paste ~8 commands into a terminal. That's it. No writing code required for setup.

1

Open Terminal

Press Cmd + Space to open Spotlight, type Terminal, press Enter.

A black (or white) window with a blinking cursor appears. That's your terminal. You'll type / paste commands here.

2

Install Homebrew

Homebrew is a package manager — it installs command-line tools for you. It's the de-facto standard on Mac. Paste this into Terminal and press Enter:

Terminal — install Homebrew

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

It will ask for your Mac password — type it (you won't see the letters, that's normal) and press Enter. Then it'll install for 5-10 minutes.

⚠ When it finishes

At the very end Homebrew prints 2-3 lines starting with ==> telling you to run some extra commands to "add Homebrew to your PATH". Copy those exact lines from YOUR terminal output and run them. They look something like:

(echo; echo 'eval "$(/opt/homebrew/bin/brew shellenv)"') >> ~/.zprofile
eval "$(/opt/homebrew/bin/brew shellenv)"

This is the #1 thing that trips up beginners — if you skip these lines, the brew command won't be found later.

3

Install Node.js

Claude Code runs on Node.js (a runtime for JavaScript). Install it via Homebrew:

Terminal — install Node

brew install node

Takes 2-3 minutes. When done, verify it installed correctly:

node --version
# Expected output: v22.x.x (or newer)

npm --version
# Expected output: 10.x.x (or newer)

If you see version numbers (starting with v), you're good. If you see "command not found", go back to Step 2 and make sure you ran the eval lines.

4

Install Claude Code

Now the main event. npm (which comes with Node) installs Claude Code globally on your system:

Terminal — install Claude Code

npm install -g @anthropic-ai/claude-code

Takes about 30 seconds. Verify:

claude --version
# Expected: 1.x.x (or newer)

5

First run + sign in

Make a folder for your first project, go into it, then run claude:

Terminal — first run

mkdir ~/my-first-claude-project
cd ~/my-first-claude-project
claude

The first time you run claude, it opens your browser for sign-in. Click the link in the terminal output — it'll take you to claude.ai — sign in with your account, click "Authorize", then close the browser tab.

Back in terminal: you now see a cursor waiting for your first prompt. You're in. 🎉

✅ Mac setup complete

Skip ahead to Your first prompt.

1

Install Windows Terminal (if you don't have it)

Windows Terminal is Microsoft's modern terminal app — way nicer than cmd.exe. On Windows 11 it's usually pre-installed. On Windows 10, install it from the Microsoft Store:

Open Microsoft Store
Search for Windows Terminal
Click Install

Open it after install. You'll see a dark window with a PowerShell prompt (PS C:\Users\you>).

2

Install Node.js

Two easy paths — pick one:

Path A — Installer (simpler for first-timers)

Go to nodejs.org
Download the LTS version (big green button)
Run the installer, click Next through all defaults
Close and reopen Windows Terminal after install

Path B — Via winget (if you like the command line)

PowerShell

winget install OpenJS.NodeJS.LTS

Verify install in Windows Terminal:

node --version
# Expected: v22.x.x

npm --version
# Expected: 10.x.x

⚠ If commands aren't found

You probably didn't close + reopen Windows Terminal. The installer adds Node to your PATH but existing terminal windows don't pick it up automatically. Close, reopen, try again.

3

Install Claude Code

In Windows Terminal:

PowerShell

npm install -g @anthropic-ai/claude-code

Takes about 30 seconds. Verify:

claude --version
# Expected: 1.x.x

4

Create a project folder

In Windows Terminal, create a folder anywhere you like and navigate into it:

mkdir $env:USERPROFILE\my-first-claude-project
cd $env:USERPROFILE\my-first-claude-project

This creates C:\Users\<you>\my-first-claude-project and moves into it.

5

First run + sign in

claude

The first time you run it, it opens your browser. Sign in at claude.ai, click Authorize, come back to the terminal. You're ready to prompt. 🎉

✅ Windows setup complete

Continue to Your first prompt.

Your first prompt with dt-site-creator

You're in the Claude Code prompt. Let's use the dt-site-creator archetypes library to build your first site.

Option A — Use the archetypes library directly

Tell Claude what you're building and point it at an archetype:

Claude Code prompt

I want to build a [marketing site / payment app / internal tool / quiz / game].

Use the dt-site-creator methodology (derrickteo.com) — pick the matching
archetype from the 5 available, and follow its 5-file contract
(CLAUDE.md, prompt.md, examples.md, mechanic-fit.md, pitfalls.md).

Claude will fetch the library, scope your project, and start building.

Option B — Copy a prompt from the archetypes page

Open the archetypes page on this site
Click Show prompt ▾ on the archetype that fits your project
Click 📋 Copy prompt
Paste into Claude Code, replace {{project_description}} with your actual project
Press Enter

💡 Tip: start small

Your first prompt doesn't have to be ambitious. Try something concrete like: "Build me a single-page marketing site for a coffee shop called Orbit. Dark theme, warm amber accents." Watch how Claude reads files, writes code, and asks questions along the way. That's the vibe-coding loop.

🔌 Power-ups

Recommended plugins

Claude Code is great out of the box. These plugins make it great at specific things — rigor, design, security. Install them once, they teach Claude to behave differently on every future task.

💡 How to install any plugin

Inside Claude Code, type /plugin and hit Enter. A menu opens. Browse the official marketplace, pick a plugin, install — Claude restarts with the new skills loaded. You can also manage plugins via ~/.claude/settings.json, but the /plugin menu is much easier.

Claude Code · plugin menu

/plugin
# → Browse marketplaces
# → claude-plugins-official
# → pick plugin → Install

The plugins that matter most

A battle-tested suite of discipline skills that make Claude behave like a senior engineer. Forces brainstorming before coding, TDD before writing, systematic debugging instead of guess-and-check, planning before executing, verification before "it's done."

brainstorming — Claude asks clarifying questions before building anything
test-driven-development — test first, then code (not the reverse)
systematic-debugging — no fixes without root-cause investigation
writing-plans / executing-plans — break work into task-by-task plans with review checkpoints
verification-before-completion — never claim "done" without running the verification command

Default LLM-generated UIs all look the same — centered cards, muted gradients, Inter fonts, rounded corners. Frontend Design breaks that pattern. It creates distinctive, production-grade interfaces with real aesthetic sensibility.

Generates components, full pages, or apps with intentional visual identity
Avoids the generic "AI aesthetic" that makes every vibe-coded site look identical
Pairs perfectly with dt-site-creator archetypes — feed it an archetype's palette, it produces a unique treatment every time

Vibe-coded apps ship fast — and often leak secrets, miss RLS policies, use hardcoded passwords, or violate OWASP basics. Security Review plugins audit your codebase for these failures before you ship.

Secrets archaeology — finds API keys, tokens, passwords committed in history
Dependency supply chain — checks packages for known vulnerabilities
OWASP Top 10 — SQL injection, XSS, CSRF, insecure auth patterns
STRIDE threat modeling — systematic risk assessment on new designs
CI/CD hardening — GitHub Actions, secrets management, branch protection

An independent second-pair-of-eyes reviewer skill. Runs on your diff, finds bugs, suggests improvements, flags anti-patterns — the kind of review a senior engineer would give on a PR.

An MCP (Model Context Protocol) server that generates design systems and screen mockups. Pair with Frontend Design: Stitch produces the visual direction, Frontend Design codes it up.

Dozens of other plugins exist — for benchmarking, learning, deploy pipelines, domain-specific work. Browse them inside Claude Code with /plugin.

⚠ Plugin hygiene

Each plugin adds to what Claude thinks about on every turn. More plugins = more context spent describing capabilities you may not need on this task. Start with 2-3 high-leverage plugins (Superpowers, Frontend Design, Security). Add others only when you find yourself manually doing the thing the plugin automates.

Common issues & fixes

"command not found: brew" (Mac)

You skipped the post-Homebrew eval commands in Step 2. Scroll up in your Terminal — Homebrew printed the exact lines you need. Usually:

(echo; echo 'eval "$(/opt/homebrew/bin/brew shellenv)"') >> ~/.zprofile
eval "$(/opt/homebrew/bin/brew shellenv)"

"command not found: node" or "npm"

Either Node isn't installed, or your terminal hasn't picked it up yet. Quit and reopen Terminal / Windows Terminal. On Windows also try: $env:PATH to see if Node's path is listed.

"EACCES: permission denied" when installing Claude Code (Mac)

npm is trying to write to a system folder. Don't use sudo — that causes more problems. Instead, run:

mkdir -p ~/.npm-global
npm config set prefix ~/.npm-global
echo 'export PATH=~/.npm-global/bin:$PATH' >> ~/.zprofile
source ~/.zprofile
npm install -g @anthropic-ai/claude-code

Sign-in browser tab doesn't open

Copy the URL from the terminal output and paste it into your browser manually. After signing in, paste the code back into the terminal.

"Claude is slow / rate-limited"

Free-tier claude.ai has daily message limits. Upgrade to Pro ($20/month) on claude.ai for 5× the limit plus access to Claude Code without a separate API key.

How do I exit Claude Code?

Type /exit or press Ctrl + C twice.

Where are my files saved?

In the folder you were in when you ran claude. Claude Code edits files on your disk — open the folder in Finder (Mac) or Explorer (Windows) to see them. It also runs git commands if you ask.

What is Claude Code?

💡 Why the terminal?

Prerequisites

A Mac or Windows laptop

Internet connection

A claude.ai account

Comfort pasting commands

Mac setup

Open Terminal

Install Homebrew

⚠ When it finishes

Install Node.js

Install Claude Code

First run + sign in

✅ Mac setup complete

Windows setup

Install Windows Terminal (if you don't have it)

Install Node.js

Path A — Installer (simpler for first-timers)

Path B — Via winget (if you like the command line)

⚠ If commands aren't found

Install Claude Code

Create a project folder

First run + sign in

✅ Windows setup complete

Your first prompt with dt-site-creator

Option A — Use the archetypes library directly

Option B — Copy a prompt from the archetypes page

💡 Tip: start small

Recommended plugins

💡 How to install any plugin

The plugins that matter most

⚠ Plugin hygiene

Common issues & fixes

You're ready. What now?

📚 Browse archetypes

❓ Not sure what to build?

⚠ Learn from mistakes