Claude Code Tutorial: Complete Beginner's Guide (2026)

Introduction

If you have been hearing about AI coding agents and want to get started, this claude code tutorial is exactly where you should begin. Claude Code is the most capable agentic coding tool available today, and it is transforming how people build software. Whether you are a complete beginner who has never written a line of code or an experienced developer looking to move faster, Claude Code gives you the ability to describe what you want and watch real, working software appear in front of you.

This is vibe coding at its best. You bring the ideas, the product sense, and the direction. Claude Code handles the implementation. But unlike a basic chatbot that spits out code snippets for you to copy and paste, Claude Code operates directly in your project. It reads your files, understands your codebase, writes code, runs commands, fixes errors, and iterates until things work.

In this guide, we will walk through everything from installation to building your first project. By the end, you will have Claude Code running on your machine and a clear understanding of how to use it effectively.

What is Claude Code?

Claude Code is Anthropic's agentic coding tool. It runs directly in your terminal and connects to Claude, one of the most advanced large language models in the world. But calling it a "coding assistant" undersells what it actually does.

Here is what makes Claude Code different from regular AI chat interfaces:

• It lives in your terminal. You run it inside your project directory, and it has direct access to your files, your folder structure, and your development environment.
• It reads and writes files. Claude Code does not just suggest code. It creates files, modifies existing ones, and organizes your project structure.
• It runs commands. Need to install a package, run a build, or execute tests? Claude Code can do that directly.
• It understands your entire codebase. When you ask it to make a change, it considers how that change interacts with the rest of your project. It reads related files, follows imports, and understands dependencies.
• It iterates on errors. If something breaks, Claude Code reads the error output and fixes the problem, often without you needing to say anything.

Think of it this way: Claude chat is like texting a developer for advice. Claude Code is like having that developer sitting next to you, hands on the keyboard, building your project in real time.

Claude Code is powered by Claude Opus and Claude Sonnet, Anthropic's most capable models. It uses an agentic loop where it plans, executes, observes results, and adjusts. This is why it can handle complex, multi-step tasks that would require dozens of back-and-forth messages in a regular chat interface.

Prerequisites

Before installing Claude Code, make sure you have the following ready:

1. A terminal or command line

Claude Code runs in the terminal. On macOS, you can use the built-in Terminal app or a tool like iTerm2. On Windows, use Windows Terminal or WSL (Windows Subsystem for Linux). On Linux, any terminal emulator works.

If you have never used a terminal before, do not worry. This tutorial will give you every command to type.

2. Node.js (version 18 or higher)

Claude Code is installed via npm, the Node.js package manager. You can check if Node.js is installed by opening your terminal and running:

node --version

If you see a version number like v20.11.0 or higher, you are good to go. If not, download Node.js from nodejs.org and install the LTS version.

3. An Anthropic API key or Claude Max subscription

You need a way to authenticate with Anthropic's API. You have two options:

• Anthropic API key: Sign up at console.anthropic.com, add credits, and generate an API key. You pay per usage.
• Claude Max subscription: If you have a Claude Pro or Max subscription, you can connect Claude Code to your subscription for included usage.

Either option works. The API key approach gives you more control over costs, while the subscription approach is simpler if you already pay for Claude.

Installing Claude Code

Let's get Claude Code installed on your machine. This takes about two minutes.

Step 1: Install Claude Code globally

Open your terminal and run:

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

This installs Claude Code as a global command-line tool. The -g flag means you can run it from any directory on your system.

Step 2: Verify the installation

After the installation completes, verify it worked:

claude --version

You should see output showing the installed version, something like:

Claude Code v1.x.x

If you see a version number, the installation was successful.

Step 3: Authenticate

The first time you run Claude Code, it will walk you through authentication. Simply run:

claude

Claude Code will prompt you to either enter your Anthropic API key or connect your Claude subscription. Follow the on-screen instructions. The process is straightforward, and your credentials are stored securely on your machine.

Once authenticated, you will see the Claude Code prompt, ready for your first command. But before we start building, let's set up a proper project.

Your First Project with Claude Code

Let's build something real. We will create a personal landing page, the kind of single-page site that showcases who you are and links to your profiles. This is a perfect first project because it is simple enough to complete in one session but substantial enough to see Claude Code's full capabilities.

Step 1: Create a project directory

Open your terminal and create a new folder for your project:

mkdir my-landing-page
cd my-landing-page

Step 2: Start Claude Code

Inside your project directory, start Claude Code:

claude

You will see Claude Code's interface appear in your terminal. It is ready for instructions.

Step 3: Give it your first prompt

Now type your first prompt. Be descriptive about what you want:

Create a personal landing page using HTML, CSS, and vanilla JavaScript.
Include my name "Alex Johnson", a short bio, links to GitHub and LinkedIn,
and a dark/light mode toggle. Make it modern and responsive.

Step 4: Watch it work

This is where the magic of Claude Code becomes obvious. Here is what happens after you press Enter:

1. Planning: Claude Code first thinks about the approach. It might outline the file structure it plans to create.
2. Creating files: It creates index.html, a CSS file, and a JavaScript file. You will see each file being written in real time.
3. Writing code: The HTML structure, styling, responsive design, and dark mode toggle all get implemented.
4. Self-checking: Claude Code often reviews its own work and catches issues before you even see them.

You will see output showing exactly which files are being created and what code is being written. Claude Code asks for permission before writing files, so you stay in control.

Step 5: Review the output

Once Claude Code finishes, check what it built:

ls

You should see your project files. Open index.html in your browser to see the result:

open index.html

On Windows, use start index.html. On Linux, use xdg-open index.html.

Step 6: Iterate with follow-up prompts

Your landing page is working, but maybe you want to change something. This is where Claude Code shines. Just tell it what to adjust:

Add a smooth scroll animation when the page loads. Also add a
"Projects" section with three cards showing placeholder projects.
Each card should have a title, description, and a link.

Claude Code reads the existing files, understands the current state of your project, and makes the changes in context. It does not start over. It modifies what is already there.

You can keep iterating like this, refining the design, adding sections, tweaking colors, until you are happy with the result. This iterative loop is the core of how to use Claude Code effectively.

Understanding CLAUDE.md

If there is one thing in this entire claude code tutorial that will dramatically improve your results, it is the CLAUDE.md file. This is the single most important file for any project that uses Claude Code.

What is CLAUDE.md?

CLAUDE.md is a special markdown file that you place in the root of your project. Every time Claude Code starts a session in your project directory, it automatically reads this file first. Think of it as a briefing document. It tells Claude Code everything it needs to know about your project before it writes a single line of code.

What to include in CLAUDE.md

A good CLAUDE.md file covers these areas:

• Project description: What the project does and who it is for
• Tech stack: Languages, frameworks, and libraries in use
• Architecture: How the project is structured (folder conventions, patterns)
• Coding standards: Naming conventions, formatting rules, preferred patterns
• Build and dev commands: How to run, build, test, and deploy the project
• Important files: Key files that Claude Code should know about
• Rules: Any constraints or preferences (for example: "always use TypeScript strict mode" or "never use inline styles")

Example CLAUDE.md for a Next.js project

Here is a practical example of what a well-structured CLAUDE.md looks like:

# My SaaS App
 
## Project
A project management tool for remote teams. Built with Next.js
and deployed on Vercel.
 
## Stack
- Next.js 15 (App Router)
- TypeScript (strict mode)
- Tailwind CSS v4
- Prisma ORM with PostgreSQL
- NextAuth for authentication
 
## Build & Dev
- `npm run dev` — start development server
- `npm run build` — production build
- `npm run test` — run test suite
- `npm run lint` — check for linting errors
 
## Folder Structure
- `src/app/` — App Router pages and layouts
- `src/components/` — Reusable UI components
- `src/lib/` — Utility functions and helpers
- `src/server/` — Server-side logic and API handlers
- `prisma/` — Database schema and migrations
 
## Code Style
- Use server components by default
- Only add 'use client' when truly needed
- All components use TypeScript interfaces, not types
- Use Tailwind for styling, no CSS modules
- Write tests for all API routes
 
## Important Rules
- Never expose API keys or secrets in client code
- Always validate user input on the server
- Use Prisma transactions for multi-step database ops
- Keep components under 150 lines

Why CLAUDE.md matters

Without a CLAUDE.md, Claude Code has to guess about your preferences. It might use JavaScript when you want TypeScript. It might structure files differently than your convention. It might use a styling approach you do not prefer.

With a CLAUDE.md, Claude Code starts every session with full context. The result is code that fits your project perfectly from the first prompt. It is the difference between getting generic code and getting code that feels like you wrote it yourself.

This is especially important for claude code setup on larger projects. The more context you provide, the better Claude Code performs.

Claude Code Skills and Commands

One of the most powerful features of Claude Code is its extensibility system. You can package expertise into reusable skills and create custom commands that turn complex workflows into simple slash commands.

Skills: Packaged expertise

Skills live in the .claude/skills/ directory of your project. A skill is a collection of instructions, templates, and knowledge that Claude Code can reference when performing specific tasks. Think of skills as giving Claude Code specialized training for your workflow.

For example, you might have a skill that teaches Claude Code your company's specific approach to writing API endpoints, including error handling patterns, validation strategies, and response formats.

Commands: Reusable prompts

Commands live in the .claude/commands/ directory. Each command is a markdown file containing a prompt template that you can invoke with a slash command.

Here is an example. Create a file at .claude/commands/component.md:

Create a new React component with the following requirements:
- TypeScript with proper interfaces
- Tailwind CSS for styling
- Include unit tests
- Add JSDoc comments
- Follow our naming conventions from CLAUDE.md
 
Component name: $ARGUMENTS

Now in Claude Code, you can simply type:

/component UserProfileCard

Claude Code reads the command template, fills in the argument, and executes the full prompt. This is incredibly useful for standardizing how your team creates common patterns.

Installing community skills

The Claude Code ecosystem has a growing library of community-contributed skills. You can install them using:

npx skills add

This launches an interactive picker where you can browse and install skills for common workflows like SEO auditing, accessibility testing, or deployment checklists.

Example: Setting up an SEO audit command

Create a file at .claude/commands/seo-audit.md:

Perform an SEO audit on this project. Check for:
- Missing meta titles and descriptions
- Missing alt text on images
- Broken internal links
- Missing Open Graph tags
- Page load performance issues
- Mobile responsiveness issues
- Missing sitemap.xml or robots.txt
- Heading hierarchy problems (skipped levels)
 
Report findings as a checklist with severity levels
(critical, warning, info) and specific fix recommendations.

Now running /seo-audit in Claude Code gives you a comprehensive SEO review every time, using the same thorough checklist.

10 Pro Tips for Claude Code

After spending hundreds of hours with Claude Code, here are the tips that make the biggest difference.

1. Start with a plan, not code

Before asking Claude Code to build anything, ask it to plan first. Try a prompt like: "Do not write any code yet. Create a detailed plan for building a task management app with these features..." This gives you a chance to review the approach before any code is written.

2. Use CLAUDE.md religiously

We covered this above, but it bears repeating. Every project should have a CLAUDE.md. Update it as your project evolves. The five minutes you spend maintaining this file saves hours of correcting Claude Code later.

3. Be specific in your prompts

Vague prompts produce vague results. Instead of "make a login page," say "create a login page with email and password fields, form validation, error messages below each field, and a forgot password link. Use our existing Button and Input components from src/components/ui."

4. Review code before accepting

Claude Code asks for permission before making changes. Use this moment. Read the code it wants to write. Understanding what your AI agent produces is crucial for maintaining a quality codebase, even in vibe coding.

5. Use git commits frequently

After each successful change, commit your work. This gives you clear checkpoints to return to if a future change goes wrong. Claude Code can even handle git operations for you. Just say "commit these changes with a descriptive message."

6. Let Claude Code run tests

If your project has tests, tell Claude Code to run them after making changes. Say "run the test suite and fix any failures." This catches bugs immediately and creates a tight feedback loop.

7. Use subagents for research

For complex tasks, Claude Code can spawn subagents to research specific questions while the main agent continues working. This is built into the agentic loop and happens automatically for larger tasks.

8. Keep context focused

Claude Code works best when it has clear, focused context. If you are working on the authentication system, do not suddenly ask about the payment integration. Finish one area, commit, and then move to the next.

9. Use /compact when context gets long

During long sessions, the conversation history grows and can slow things down. The /compact command summarizes the conversation so far and clears the context window, keeping you focused and fast.

10. Build iteratively, not all at once

Do not try to build your entire application in a single prompt. Break it into logical pieces. Build the layout first, then add navigation, then implement individual features. Each iteration gives you a working checkpoint and a chance to adjust direction.

Claude Code vs Other AI Coding Tools

Claude Code is not the only AI coding tool available, but it occupies a unique position in the landscape. While tools like Cursor and Windsurf embed AI into a full code editor with visual interfaces and tab-completion features, Claude Code takes a fundamentally different approach by running directly in the terminal as a pure agentic system. This means Claude Code has deeper access to your development environment, can run commands, execute builds, and manage files with more autonomy than editor-based tools.

The tradeoff is that Claude Code has a steeper initial learning curve since you work in the terminal rather than a visual editor. But for users who want maximum power, the ability to handle complex multi-file changes, and an agent that can truly operate across your entire project, Claude Code consistently delivers results that other tools struggle to match.

For a detailed breakdown of how Claude Code stacks up against Cursor, Windsurf, Bolt, and other AI coding tools, read our full comparison guide.

FAQ

Is Claude Code free?

Claude Code itself is free to install. However, you need to pay for API usage through an Anthropic API key (pay-per-use pricing) or through a Claude Pro or Max subscription that includes Claude Code access. The API approach gives you granular control over costs, while the subscription approach provides a predictable monthly fee.

Can Claude Code work with any programming language?

Yes. Claude Code works with virtually any programming language and framework. It is especially strong with JavaScript, TypeScript, Python, Rust, Go, and web technologies, but it can handle everything from C++ to Swift to SQL. Since it operates on files and terminal commands, there is no language-specific limitation.

How is Claude Code different from Cursor?

Cursor is an AI-enhanced code editor, essentially a fork of VS Code with AI features built in. You write code in the editor and get AI assistance through tab completion, inline edits, and a chat panel. Claude Code, by contrast, is a terminal-based agent. You give it instructions and it writes, modifies, and manages files autonomously. Cursor is better for developers who want AI assistance while they type. Claude Code is better for people who want to describe what they want and let the AI build it. Many developers use both.

Do I need coding experience to use Claude Code?

No, you do not need traditional coding experience. This is one of the core promises of vibe coding. You need to be comfortable with a terminal (navigating directories, running commands) and you need to understand what you want to build at a product level. Claude Code handles the implementation. That said, having some programming knowledge helps you review output, debug issues, and make better decisions about architecture.

Can Claude Code deploy my app?

Claude Code can run deployment commands if your project is configured for it. For example, if you use Vercel, Claude Code can run vercel deploy for you. If you use a custom deploy script, it can run that too. It cannot set up hosting accounts or configure DNS for you, but any command-line deployment workflow is fair game.

What models does Claude Code use?

Claude Code uses Anthropic's most capable models. It primarily runs on Claude Sonnet for fast, efficient coding tasks and can use Claude Opus for more complex reasoning. The model selection is handled automatically based on the complexity of your request. You always get the most appropriate model for the task at hand.

Ready to start building? Install Claude Code, set up your CLAUDE.md, and give it your first prompt. The best way to learn is by doing. Start small, iterate often, and do not be afraid to experiment. If you are new to the concept of building software with AI agents, check out our guide on what vibe coding is and why it matters.