TechLead
Lesson 2 of 25
7 min read
AI-Native Engineering

Getting Started with Claude Code

Install and configure Claude Code, Anthropic's agentic coding CLI that reads your codebase, plans changes, and executes multi-file edits autonomously

What is Claude Code?

Claude Code is Anthropic's agentic coding tool — a command-line interface that connects Claude directly to your development environment. Unlike chat-based AI tools where you copy-paste code back and forth, Claude Code operates in your terminal, reads your files, understands your project structure, runs commands, and makes changes directly to your codebase.

Think of it as having a senior engineer sitting next to you who can instantly read every file in your project, understand the architecture, and make changes across dozens of files — then show you exactly what changed so you can review it.

How Claude Code Differs from Chat AI

  • Direct File Access: Reads and writes files in your project — no copy-paste needed
  • Terminal Integration: Runs shell commands, installs packages, runs tests
  • Codebase Awareness: Understands your full project structure, dependencies, and patterns
  • Agentic Execution: Plans multi-step tasks and executes them autonomously
  • Iterative: If a test fails, it reads the error and fixes the code automatically

Installation

Getting Claude Code running takes about 2 minutes. You need Node.js 18+ installed.

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

# Verify installation
claude --version

# Start Claude Code in your project directory
cd your-project
claude

# On first run, you will authenticate with your Anthropic account
# Claude Code will open a browser window for OAuth authentication

System Requirements

  • Node.js: Version 18 or higher
  • OS: macOS, Linux, or Windows via WSL
  • Account: Anthropic account with Claude Code access (Pro, Team, or Enterprise plan)
  • Terminal: Any modern terminal (iTerm2, Warp, VS Code terminal, Alacritty)

First Run: How It Works

When you launch Claude Code in a project directory, here is what happens:

# Navigate to your project
cd ~/projects/my-nextjs-app

# Launch Claude Code
claude

# You will see a prompt like:
# Claude Code v1.x.x
# Working directory: ~/projects/my-nextjs-app
# Type your request or /help for commands
#
# > _

# Try your first task:
> What is this project? Give me an overview of the architecture.

# Claude will:
# 1. Read key files (package.json, tsconfig.json, directory structure)
# 2. Scan source files to understand the architecture
# 3. Provide a comprehensive overview of your project

The Permission Model

Claude Code operates on a trust but verify model. When it needs to perform actions, it asks for permission. You control what it can do:

Action Type Permission Required Examples
Read FilesAutomatic (allowed by default)Reading source files, configs, package.json
Write/Edit FilesRequires approval (can be auto-approved)Creating files, modifying source code
Run CommandsRequires approval (can be auto-approved)npm install, running tests, git commands
Web RequestsRequires approvalFetching URLs, API calls
MCP Tool CallsRequires approvalDatabase queries, GitHub API, Slack messages
# When Claude wants to edit a file, you will see:
# Claude wants to edit: src/components/Header.tsx
# [Allow] [Deny] [Allow All Edits]

# You can configure auto-approval for trusted operations:
# In your project settings or via CLI flags

# Allow all file edits automatically (for trusted projects)
claude --allowedTools "Edit,Write"

# Run in fully autonomous mode (use with caution)
claude --dangerouslySkipPermissions

Configuration: CLAUDE.md Files

The most important configuration mechanism is the CLAUDE.md file. This is a markdown file you place in your project root that tells Claude about your project, coding conventions, and preferences. Think of it as onboarding documentation specifically for your AI collaborator.

# CLAUDE.md - Example for a Next.js project

## Project Overview
This is a Next.js 14 app with App Router, TypeScript, and Tailwind CSS.
It is a SaaS platform for project management.

## Tech Stack
- Next.js 14 (App Router, static export)
- TypeScript (strict mode)
- Tailwind CSS for styling
- Supabase for auth and database
- Vercel for deployment

## Coding Conventions
- Use functional components with hooks
- Prefer named exports over default exports
- Use server components by default, add "use client" only when needed
- All components go in app/components/
- All lib/utility files go in app/lib/
- Use Tailwind classes, no CSS modules

## Testing
- Run tests: npm test
- Test framework: Vitest + React Testing Library
- Every new component needs a test file

## Common Commands
- Dev server: npm run dev
- Build: npm run build
- Lint: npm run lint
- Type check: npx tsc --noEmit

The .claude/ Directory

Beyond the root CLAUDE.md, Claude Code uses a .claude/ directory for additional configuration:

your-project/
  CLAUDE.md                  # Project-level instructions (committed to git)
  .claude/
    settings.json            # Claude Code settings
    CLAUDE.md                # Additional instructions (can be user-specific)
  .cursorrules               # If also using Cursor (separate config)

Claude Code vs VS Code Extension vs Web App

Feature Claude Code CLI VS Code Extension Claude.ai Web
File AccessFull project accessFull project accessNone (copy-paste)
Terminal CommandsYesYesNo
Multi-File EditsExcellentGoodManual
Background AgentsYesLimitedNo
Best ForComplex tasks, refactoring, CIInline editing, quick changesArchitecture discussions, brainstorming
MCP SupportFullFullNo

Practical Examples: Your First Tasks

Example 1: Understanding a Codebase

# Launch Claude Code in an unfamiliar project
cd ~/projects/inherited-legacy-app
claude

> I just inherited this codebase. Give me a comprehensive overview:
  the architecture, key files, tech stack, and any red flags you see.

# Claude will read through key files and give you a structured overview
# much faster than you could do it manually

Example 2: Fixing a Bug

> Users are reporting that the login form submits twice when they
  click the submit button quickly. Find the bug and fix it.
  The login form is in app/components/LoginForm.tsx.

# Claude will:
# 1. Read LoginForm.tsx
# 2. Identify the missing debounce/disabled state
# 3. Fix the component
# 4. Show you the diff for review

Example 3: Adding a Feature

> Add a dark mode toggle to the app. Use next-themes for the
  provider, add a toggle button in the Header component, and
  make sure all existing Tailwind classes support dark mode.
  Follow the existing code patterns in this project.

# Claude will:
# 1. Install next-themes
# 2. Add the ThemeProvider to the layout
# 3. Create a DarkModeToggle component
# 4. Update the Header to include the toggle
# 5. Show all changes for review

Essential Commands

# Basic usage
claude                          # Start interactive session
claude "fix the failing tests"  # One-shot command
claude -p "explain this code"   # Print mode (no file changes)

# Slash commands inside a session
/help                           # Show all commands
/plan                           # Enter plan mode (think before acting)
/review-pr                      # Review a pull request
/clear                          # Clear conversation history
/compact                        # Summarize conversation to save context

# Useful flags
claude --model opus             # Use a specific model
claude --allowedTools "Edit"    # Pre-approve certain tools
claude --verbose                # Show detailed tool calls

Pro Tip: Start Small

Do not start by asking Claude Code to build an entire feature on day one. Start with small, verifiable tasks: fix a specific bug, write tests for one file, refactor a single function. As you learn to review AI output effectively and build trust in the tool, gradually increase task complexity. Within a week, you will be comfortable directing multi-file changes. Within a month, you will wonder how you ever coded without it.

Summary

Claude Code transforms the development experience from manually writing code to directing an AI agent that understands your entire project. Install it, write a CLAUDE.md file, and start with small tasks. The permission model keeps you in control, and the agentic execution model means Claude handles the mechanical work while you focus on architecture and review. The rest of this course will teach you to use it like a power user.

Continue Learning