█
LastWrite
  • > Curriculum
  • > Pricing
  • > For Educators
  • > About
  • > Contact
Log InGet Started

Questions, concerns, bug reports, or suggestions? We read every message, write to us at [email protected].

More ways to reach us →
LastWrite

Structured computer science lessons for aspiring developers and security professionals.

[email protected]

(201) 785-7951

Mon–Fri, 9 AM–5 PM EST

Learn

  • Curriculum
  • Pricing

Company

  • About
  • For Educators & Schools
  • Contact Us

Legal

  • Terms of Service
  • Privacy Policy
© 2026 LastWrite. All rights reserved.
Curriculum/Web Development/AI Application: Web Development/Claude Code: AI-Powered Development from the Terminal
50 minIntermediate

Claude Code: AI-Powered Development from the Terminal

After this lesson, you will be able to: Use Claude Code from the terminal to read, write, and refactor code across an entire project, and know when to drive it manually vs. agentically.

Claude Code is Anthropic's terminal-based AI coding agent. It can read your whole project, edit multiple files at once, run commands, and iterate based on what it sees. This lesson walks through installing it, using it well, and avoiding the mistakes most beginners make.

Prerequisites:AI in Web Development: The New WorkflowIntroduction to the Terminal and Linux

Install and authenticate

Claude Code is a CLI tool, installs in one command if you have Node.js.

  1. 1

    Install Node.js (nodejs.org) if you don't have it

  2. 2

    In a terminal, run: npm install -g @anthropic-ai/claude-code

  3. 3

    Navigate into a project: cd ~/projects/my-website

  4. 4

    Run: claude

  5. 5

    Follow the prompt to authenticate with your Anthropic account

How Claude Code thinks

Claude Code reads your code, plans, edits files, and runs commands, the same way a human developer would. It's an agent, not just an autocomplete. When you ask it to add a feature, it explores the codebase, makes a plan, edits multiple files, and reports back. You confirm or redirect.

Effective prompts

The more context you give, the better the result. Be specific.

tsx
# Bad, too vague
"add a login page"
# Better, specific, scoped
"Add a /login page that posts to /api/auth/login. Use the existing
styles.css. Show validation errors inline. Don't change the navbar."
# Best, references real files and behavior
"In src/app/login/page.tsx, build a login form that calls
/api/auth/login. Match the visual style of /signup. On success,
redirect to /dashboard. On 401, show the inline error from the response."

ℹ️ Tip, review every diff before you accept

Claude Code is fast and confident, but it can make incorrect changes. Always read the diff, especially for security-sensitive code (auth, payments, file uploads). Treat it like a junior developer's pull request.

When to use it vs. when not to

Great for: scaffolding boilerplate, refactoring, fixing TypeScript errors, writing tests, explaining unfamiliar code, generating migrations. Less great for: architectural decisions, deeply contextual business logic, security-critical code, anything where the wrong choice has consequences you can't easily reverse.

Try it: refactor your bio page

Open the bio page from wd-08 in Claude Code and use it for a real task.

  1. 1

    cd into your bio-page project

  2. 2

    Run claude to start a session

  3. 3

    Ask: "Read styles.css and refactor it to use CSS variables for the color palette. Don't change any visual styles."

  4. 4

    Review the diff before accepting

  5. 5

    Ask a follow-up: "Now add a dark-mode toggle that swaps the variables when a button is clicked."

  6. 6

    Test the result in the browser

Quick Check

Why do experienced devs review every Claude Code diff carefully?

Hint: even good agents are not perfect.

Sign in and purchase access to unlock this lesson.

Sign in to purchase
←AI in Web Development: The New Workflow
Back to AI Application: Web Development
GitHub Copilot: AI Pair Programming→