← Home | Module 01 — Orientation
0%
Module 01 · Live

Orientation — Claude Code in 20 Minutes

You've used Claude in the browser. Now you're going to use it where professionals do — in your terminal, with your files, building real things. This module gets you from zero to your first working session.

~20 min
🏗 Project: your first CLAUDE.md
Day 1 ready

💡 What is Claude Code — and why does it matter?

Claude in the browser is a conversation. Claude Code is a collaborator that lives inside your project. The difference is fundamental:

CLAUDE.AI (BROWSER)
  • You describe what you want
  • It gives you text / code snippets
  • You copy-paste manually
  • Context resets each conversation
  • Can't see your actual files
CLAUDE CODE (TERMINAL)
  • It reads and writes your files
  • Runs commands on your machine
  • Remembers your project context
  • Understands your codebase
  • Takes actions, not just suggestions
The mental shift: Stop thinking of Claude as something you ask questions to. Start thinking of it as a capable colleague who can do the work — not just describe it.

What you can build from Day 1

  • Web apps and landing pages — fully styled, light/dark mode, deploy-ready
  • Automated workflows — scheduled tasks, file processors, data pipelines
  • Documents and decks — PDFs, PPTX, reports generated from your data
  • APIs and backend logic — REST endpoints, integrations, database queries
  • Multi-agent systems — background agents working while you do other things

⚙️ Installation

Claude Code is a CLI tool that runs on macOS, Windows, and Linux. Before installing it, you need two things: Node.js 18+ and an Anthropic account. Pick your OS below and follow each step in order.

Step 1 — Install Node.js (if you don't have it)

Open Terminal (press Cmd + Space, type Terminal, hit Enter) and run:

bash — Terminal
# Check if Node is already installed (need v18+)
node --version

# If not installed or below v18, install via Homebrew:
# 1. Install Homebrew first (if you don't have it)
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

# 2. Then install Node
brew install node

# Confirm it worked
node --version   # should show v18.x or higher
npm --version
Alternative: Download the macOS installer directly from nodejs.org → click the LTS version → run the .pkg file.

Step 2 — Install Claude Code

bash — Terminal
npm install -g @anthropic-ai/claude-code

# Verify the install
claude --version
Permission error? If you see EACCES: permission denied, run: sudo npm install -g @anthropic-ai/claude-code and enter your Mac password.

Step 3 — Authenticate

bash — Terminal
# This opens a browser window to log in with your Anthropic account
claude login

Your browser will open the Anthropic login page. Sign in (or create a free account). Once done, return to Terminal — you'll see ✓ Authenticated.

Step 4 — Launch in a project folder

bash — Terminal
# Navigate to any folder (or create a new one)
mkdir ~/my-first-claude-project
cd ~/my-first-claude-project

# Launch Claude Code
claude

# You'll see:
✓ Claude Code — ready
❯ 
All platforms: Always launch claude from inside your project directory. Claude uses that path as its root — it reads and writes files relative to wherever you launched it.

🚀 Your First Session — Anatomy of a Good Prompt

The biggest mistake beginners make is under-briefing Claude. It has full context of your project — use that. A great prompt has three parts:

WHAT What you want Claude to build or do — be specific
CONSTRAINTS Format, style, tech stack, things to avoid
OUTCOME What "done" looks like — file created, feature working, etc.

Weak vs. Strong prompts

✗ WEAK
"Make a landing page"
✓ STRONG
"Create index.html — a landing page for a SaaS productivity tool. Use a dark default with light mode support. Hero section, 3 feature cards, and a CTA button. No frameworks, just HTML/CSS."

Key slash commands to know right now

/helpShow all available commands
/clearClear conversation context (start fresh)
/compactCompress context to save tokens
/modelSwitch between Opus, Sonnet, Haiku
/statusSee current model, costs, session stats
EscapeCancel current generation mid-stream

🧠 CLAUDE.md — Your AI's Permanent Memory

CLAUDE.md is a plain text file in your project root. Claude reads it automatically at the start of every session. It's how you give Claude persistent context so you never re-explain your project, preferences, or rules.

Think of it as onboarding a colleague. Anything you'd tell a new developer joining the project belongs in CLAUDE.md — tech stack, conventions, what to avoid, who the user is.

What to put in it

markdown — CLAUDE.md
# Project: My SaaS App

## Stack
- Frontend: plain HTML/CSS/JS (no frameworks)
- Backend: Node.js + Express
- DB: PostgreSQL

## Conventions
- All files use kebab-case naming
- CSS uses CSS custom properties, no preprocessors
- No jQuery — vanilla JS only

## What to avoid
- Don't install new npm packages without asking
- Don't rewrite files from scratch unless asked

## Me
- I'm Rick — technical background, building solo
- Prefer concise responses, no filler text

CLAUDE.md best practices

  • Be specific about stack — saves Claude from guessing and prevents wrong assumptions
  • State what NOT to do — "don't install new packages" is more valuable than "use npm carefully"
  • Add your preferences — concise vs. verbose, comments in code vs. none, etc.
  • Update it as you learn — every time you correct Claude, consider if that correction should live here permanently
  • Keep it tight — 50–150 lines max. Claude reads all of it, every session
Global vs. Project memory: You can also place a CLAUDE.md in ~/.claude/ for preferences that apply to every project (your name, your general style, never-do rules).
⌨️ Live Terminal Sandbox Interactive
Type a command or click a quick command below
claude
✓ Claude Code v1.x — connected
Model: claude-sonnet-4-6 · Project: my-app
Try a command below, or type your own. Press Enter to run.

🎯 Challenge — Do it for real

Open your actual terminal alongside this page. Complete all three steps in your own Claude Code session.

  1. 1 Launch Claude Code in any project folder on your machine. Type claude and confirm it starts. If you don't have a project, run mkdir test-project && cd test-project && claude.
  2. 2 Run /status and note which model you're on. Then run /help and skim the output — find one command you didn't know existed.
  3. 3 Ask Claude to create a CLAUDE.md for your project. Use this prompt: "Create a CLAUDE.md for this project. Ask me 3 questions first to understand the stack and my preferences."

🏗 Mini Project — Your First CLAUDE.md

Pick your operating system first — the steps will show you exactly what to type for your machine. Check each step off before moving to the next.

Step 1 — Open your terminal The terminal is where Claude Code lives. Here's how to open it.

Press Cmd + Space to open Spotlight, type Terminal, then press Enter. The Terminal app opens — you'll see a window with a blinking cursor.

Prefer a better terminal? Download iTerm2 (free) for a much nicer experience with colors and split panes. But the built-in Terminal works fine to start.

Once open, you'll see a prompt showing your current location — something like ~ (Mac/Linux) or C:\Users\YourName (Windows). That's your home directory. Think of the terminal as a text-based file explorer: you type commands to move around and create things.

Step 2 — Create a project folder and open it Claude needs a folder to work in — everything it reads and writes stays inside it.

Type these two commands, pressing Enter after each one:

macOS — Terminal # Creates the folder inside your home directory
mkdir ~/my-first-project

# Moves you inside it (cd = change directory)
cd ~/my-first-project

Your prompt will now show my-first-project — that means you're inside it. To double-check, type pwd and press Enter — it will print the full path.

Using an existing project? Skip mkdir and just run cd ~/path/to/your/project. For example: cd ~/Documents/my-website.
Step 3 — Verify the install and launch Claude Code One check, then one command to start your first session.

First, confirm Claude Code is installed:

all platforms claude --version

You should see a version number like 1.x.x.

"command not found"? npm didn't add Claude to your PATH. Run: export PATH="$HOME/.npm-global/bin:$PATH" then try again. To make it permanent, add that line to ~/.zshrc and run source ~/.zshrc.

Now launch Claude Code from inside your project folder:

all platforms claude

# Expected output:
✓ Claude Code — ready

That prompt is Claude waiting for your first message. You are now inside a session.

Asked to log in? Type claude login — your browser opens the Anthropic login page. Sign in, return to the terminal, and run claude again.
Step 4 — Ask Claude to create your CLAUDE.md Same on all platforms — Claude prompts work identically everywhere.

At the prompt, type this and press Enter:

claude prompt — type at the ❯ cursor I'm starting a new web project. Ask me 3 short questions to understand my stack and preferences, then create a CLAUDE.md file for this project.

Claude will ask things like "What tech stack are you using?" Answer in plain English. After your answers it writes CLAUDE.md directly to your project folder — a real file on your disk.

To see what it wrote:

claude prompt Show me what's in the CLAUDE.md you just created.
Want to see the file outside Claude? Open Finder, press Cmd + Shift + H to go to your home folder, then open my-first-project — you'll see CLAUDE.md there.
Step 5 — Ask Claude to build one real thing Claude now has your CLAUDE.md context. Watch it use it automatically.

At the prompt, ask for something concrete:

claude prompt — change to suit your project Create a simple index.html homepage for this project. Use the stack and conventions from CLAUDE.md.

Claude will read your CLAUDE.md, then write the file. When done it shows a summary of what was created. Check your project folder — the file is really there.

Not sure what to ask for? Try: "Create a README.md that describes this project" or "Create a styles.css file following the conventions in CLAUDE.md."
Step 6 — Compress context and keep going Learn to manage long sessions without starting over.

/compact summarizes your session history into a tight snapshot so you keep working without burning through your context window. Type it at the prompt:

claude command — all platforms /compact

Claude confirms the compression. Now send a new request — it still knows your project:

claude prompt Add a navigation bar to index.html — keep it consistent with the existing style.
To exit Claude Code: type /exit or press Ctrl + C. Your files stay on disk exactly as Claude left them.