← Back to lessons

Working with Files

Understand how Claude reads, creates, and edits files on your computer.

01

How Claude Code Reads

In the last lesson, Claude Code created files for you. Before you build something more complex, you need to understand how it sees your project. This changes how you work with it.

Context is everything

When you open Claude Code in a folder, it can read every file in that folder and its subfolders. It does not memorize them all upfront. Instead, it reads files as needed, using a tool called Read.

You can see this happen in real time. When you ask Claude Code to do something, watch the tool calls. You will see lines like:

Reading file: src/index.html
Reading file: src/styles.css

It reads what it needs, when it needs it.

Try it yourself

Open Claude Code in your my-site folder from the previous lesson:

cd my-site
claude

Now ask:

What files are in this project and what does each one do?

Claude Code will use its Glob tool to find files, then Read to examine each one. It will give you a summary of your project’s structure. This is not a guess. It is reading your actual files.

Why this matters

When you ask Claude Code to make a change, it reads the relevant files first. It sees what already exists before deciding what to do. This means:

  • It will not overwrite your work unless you tell it to
  • It matches the existing code style automatically
  • It understands how your files connect to each other

An empty folder has no context. A project with existing files gives Claude Code a map. The more it can read, the better it works.

02

Creating and Editing

Claude Code does not just read files. It creates new ones and edits existing ones. These are two different operations, and understanding the difference makes you a better director.

Creating files

When Claude Code makes a new file, it uses the Write tool. You will see:

Claude wants to create file: about.html
Allow? [y/n]

The entire file content is new. You can preview what it plans to write before approving. Try it:

Create an about page for my site with a short bio and a link back to the homepage

Claude Code will read your existing index.html to understand your project’s style, then create a new about.html that matches.

Editing files

When Claude Code modifies an existing file, it uses the Edit tool. This is a precise, surgical operation. It does not rewrite the entire file. It changes only the specific lines that need to change.

Claude wants to edit file: index.html
  Replace lines 15-18
Allow? [y/n]

Try it:

Add a link to the about page in the navigation of index.html

Watch how Claude Code reads index.html, finds the navigation section, and makes a targeted edit. The rest of the file stays untouched.

The difference matters

Write creates from scratch. Edit modifies precisely. When you ask Claude Code to “change the header color,” it uses Edit to touch one CSS property. When you ask it to “create a contact page,” it uses Write to make a new file.

You do not need to specify which tool to use. Claude Code picks the right one. But knowing this helps you understand what it is doing and why.

03

Running Commands

Claude Code does more than read and write files. It runs terminal commands on your computer through the Bash tool.

What commands can it run?

Anything you could type in your terminal:

  • Install packages: npm install, pip install
  • Start servers: npm run dev, python -m http.server
  • Run tests: npm test, pytest
  • Git operations: git init, git add, git commit
  • System commands: mkdir, ls, cat

Every command requires your permission:

Claude wants to run: npm install express
Allow? [y/n]

Try it

Ask Claude Code to start a local server for your project:

Start a local web server so I can preview my site at localhost

It might install a lightweight server package, then start it. You will see the URL in the output. Open it in your browser.

When you are done previewing, press Ctrl+C in the terminal where the server is running, or tell Claude Code:

Stop the server

Commands are the glue

Reading and writing files gets you code on disk. Commands make that code do things. Install dependencies, start servers, run builds, execute scripts. Claude Code chains these together automatically.

When you say “build me a React app,” Claude Code does not just write files. It runs npx create-react-app, edits the generated files to match your request, installs additional packages if needed, and starts the dev server so you can see the result. Files plus commands equals working software.

04

Project Awareness

Now you know the building blocks: Read, Write, Edit, Bash. Here is how they work together to make Claude Code understand entire projects.

It searches before it acts

When you say “add a dark mode toggle,” Claude Code does not start writing code immediately. It searches first:

  1. Glob finds all relevant files (HTML, CSS, JavaScript)
  2. Read examines each one to understand the current structure
  3. It plans the approach based on what exists
  4. Edit modifies the files that need changes
  5. Write creates any new files needed

This search-then-act pattern means Claude Code works with your project, not against it. It respects what you already built.

The power of a clean project

Your project folder is Claude Code’s workspace. A few things that make it work better:

  • Keep related files together. Claude Code understands folders. A styles/ folder, a pages/ folder, a components/ folder. Structure helps context.
  • Use descriptive filenames. about.html is clearer than page2.html. Claude Code reads filenames to understand purpose.
  • One project per folder. Do not open Claude Code at your home directory with thousands of files. Open it in the specific project you are working on.

Expanding your site

Go back to your my-site project and try something more ambitious:

Add a projects page that lists three things I have built. Use a card layout with a title, description, and link for each project. Make up placeholder content for now.

Watch how Claude Code reads your existing files, matches the style, creates the new page, and links it into your navigation. It did not ask you which CSS class to use or where to put the link tag. It figured that out from context.

What’s next

You now understand how Claude Code interacts with files and commands. In the next lesson, you will use all of this to build something more substantial: a real command-line tool that solves a problem you actually have.