Claude Code for non-programmers: a calm beginner's guide (2026)

Claude Code is Anthropic's coding agent. You describe what you want in plain language, and it reads the files in your project, writes and edits code, runs commands and tells you what it did. You approve, correct or undo. Anthropic's guide for first-time terminal users opens with the sentence many beginners need: "You can use Claude Code even if you've never used a terminal before."

That is true, and it is where the real work starts. A first page on screen takes minutes. Something you can trust takes a few habits: plan before you change things, read what changed, save versions with Git, test, keep secrets out of reach and look at every command before you allow it.

I came to this as a designer, not a programmer. I build and ship my own products with Claude Code as a tool in my hand, and I built this bilingual portfolio site with it. This guide walks through each of those habits in order. If building software by talking to AI is new to you, read what vibe coding is first.

What Claude Code is, in plain words

In a chat window, you copy code out and paste it somewhere. Claude Code works inside a project folder instead: it opens files, changes them, creates new ones and runs the commands a developer would type. That also means it changes real things on your computer. Most of this guide is about staying in control.

Two words come up often: a project (developers say repository), one folder holding everything for one site or app, and a session, one conversation inside it. The documentation says "each Claude Code session begins with a fresh context window", so it knows only what is in the project's files and what you tell it.

Where Claude Code runs (October 2026)

The documentation lists four main places. All share one engine, so a project's rules work in each.

If the terminal makes you nervous, start with the desktop app or a free code editor such as VS Code. If you are still choosing between Claude Code and browser app builders such as Lovable or Bolt, read my comparison of vibe coding tools.

Installing it and your first session

Follow Anthropic's quickstart for current details.

1. Get an account. The quickstart lists a Claude Pro, Max, Team or Enterprise plan, a Claude Console account with prepaid API credits, or a supported cloud provider.
2. Install from the official page only. Copy Anthropic's one-line install command from its documentation, never from a video, a forum or a blog post, this one included. On Windows, the docs also recommend Git for Windows. The desktop app needs no command: download it, sign in, open the Code tab.
3. Check it worked. In a new terminal window, type claude --version. A version number means you are ready.
4. Make a project folder. Create an empty folder such as my-first-site, open the terminal inside it and type claude. The first time, you log in through your browser.
5. Answer the trust question with care. Say yes only to your own project folders, never your home folder or a whole drive. In Manual mode it asks before its file tools reach outside the starting folder, so a small folder keeps its reach small.

Ask questions before you ask for changes. Then ask for something small, such as one HTML page with your name and three links, and open it in your browser. Four keys help: Esc stops it mid-task, /help lists commands, /clear starts a fresh conversation, exit leaves.

How to ask: plans first, small steps

Start in plan mode

In plan mode, Claude Code reads your files and answers questions but does not edit them. In the terminal, press Shift+Tab until the status line shows plan mode. The desktop app and VS Code have a mode selector. Ask for a plan, correct it, and only then let it make edits.

Anthropic's best-practices page gives a simple rule: "If you could describe the diff in one sentence, skip the plan." A typo needs no plan. A new page, a form or anything touching several files does.

A good request has four parts

• What: one change, in one or two sentences.
• Where: the page, section or file.
• Limits: what must not change, the languages, the reading direction.
• The check: how you will both know it works.

Compare "make the contact page better" with this:

"On the contact page, add a form with name, email and message fields. Labels in Arabic and English, right to left in Arabic. Don't change the header or footer. When you finish, list the files you changed and tell me how to test the form."

When it goes the wrong way

Press Esc as soon as it heads somewhere you didn't ask for. Press Esc twice or type /rewind to restore the conversation and code to an earlier point. The catch, in the docs' words: "changes made through Bash commands or external processes are not captured." A command that moves or deletes files is not covered. That is what Git is for.

CLAUDE.md: the project's rules

CLAUDE.md is a plain text file in your project's main folder. Claude Code reads it at the start of every session, so it holds what you would otherwise repeat every day. Type /init and it drafts a first version from the project. Then edit it yourself.

Keep it short. Anthropic suggests staying under 200 lines and asking of every line: "Would removing this cause Claude to make mistakes?" If not, cut it. A starting point for a small bilingual site:

# Project: studio website

## Languages
- Arabic and English, each at its own address (/ar and /en).
- Arabic is right to left. Use logical CSS properties (margin-inline-start, not margin-left).

## Design
- Colours and fonts live in styles/tokens.css. Never write a colour value anywhere else.

## Commands
- Check before every commit: npm run build

## Ask me first
- Before adding a package, deleting files or moving folders.

## Never
- Never put keys or passwords in the code. They live in .env, which Git ignores.

One thing to know: the docs say Claude treats CLAUDE.md "as context, not enforced configuration". It is strong guidance, not a lock. For things that must never happen, such as reading your secrets file, use the permission settings below.

Reading a diff before you accept it

A diff shows a change as before and after: removed lines usually in red with a minus sign, added lines in green with a plus sign. The VS Code extension and the desktop app show them side by side. You don't need to understand every line, but you do need five answers:

1. Which files changed, and are they the ones you expected?
2. Was anything removed that you didn't ask to remove?
3. Was a package added? In many web projects that shows as a change to package.json. Ask what it is and why.
4. Does any line look like a password or key?
5. Is the change much bigger than the request? Ask why.

Then ask: "Explain this change file by file, as if I am a designer." For a second opinion, the built-in /code-review command looks over the current change in a fresh context.

Git: your safety net

Git keeps your project's history, like "Save As" with a note attached, for the whole folder at once.

• A commit is a saved snapshot with a short message, such as "add contact form".
• A branch is a parallel copy for trying something risky without touching the working version.
• Pushing to a private repository on GitHub keeps a copy off your laptop.

Ask in plain words: "commit my changes with a clear message". Commit after every step that works, branch before anything risky, push at the end of the day, and on day one ask it to set up .gitignore, the list of files Git must never save, with your secrets file in it.

Testing when you are not a programmer

Decide, before each change, how you will know it worked. Three layers, none needing you to write code:

1. The build check. Most web projects have a command that must pass before publishing. Ask which one checks your project and add it to CLAUDE.md.
2. Automated tests. For anything with rules (a price calculation, a form that rejects empty fields), ask it to write tests, run them and paste the result. The docs advise asking it to "show evidence rather than asserting success". Read the words "passed" and "failed".
3. Your own click-through. Open it on a phone, switch the language, submit the form empty, type a long Arabic name, use only the keyboard, try a slow connection.

If a test fails, ask for the cause before the fix.

Secrets: out of the code and out of the chat

A secret is anything that gives access: API keys, database passwords, payment keys.

• Keep them in an environment file (usually .env), listed in .gitignore, and in your host's secret settings. Ask Claude Code to read each value from an environment variable by name, and type the real value into the file yourself.
• Never paste a secret into the conversation, or share a screenshot with one on screen. The conversation goes to the model and is saved with your session history.
• Block it from reading the file. Anthropic's permissions page shows a rule that stops its file tools reading a path, with Read(./.env) as the example.
• If a key leaks, replace it the same day at the provider.

Permissions: why you review commands

As of October 2026, the docs describe these main permission modes:

In recent versions, auto mode is the starting mode in the terminal and VS Code, and the docs say plainly that "auto mode reduces permission prompts but does not guarantee safety". While you are learning, switch to Manual with Shift+Tab or the mode selector.

Slow down on any command that deletes or overwrites (rm, del, git reset --hard, git push --force), installs packages, downloads and runs something, touches a live database or hosting account, or reaches outside your project folder. Anthropic's security page is clear that reviewing proposed commands is the user's job. And be careful with "Yes, and don't ask again": for a command, that choice is saved permanently for the project. Type /permissions now and then and remove anything you don't recognise.

Cost and plans

No prices here, because they change. Your use counts against your plan's limits, or is billed by usage on an API account, so check the official pricing page on claude.com. Inside a session, /usage shows what you have used, and /clear between unrelated tasks keeps it down, because the whole conversation is resent with every message.

What to learn alongside it

Just enough to read what it makes:

• HTML: headings, links, images, forms, and the lang and dir attributes.
• CSS: spacing, flexbox and grid, custom properties, logical properties for right to left.
• Your project's shape: where pages live, what package.json, .env and .gitignore are for.
• Git: status, commit, log, branch and push.
• Errors and the terminal: reading the first line of an error, moving between folders, stopping a local server with Ctrl+C.

Free companions: Claude Code 101 on Anthropic's Claude Academy, MDN Web Docs for HTML and CSS, and the Pro Git book on git-scm.com. In plan mode, Claude Code is a patient tutor too.

From my work: how I use it

I build and ship my own products this way. CofyTill is an Arabic cashier system for cafés and roasteries that keeps selling offline and syncs to the cloud. MATN is an Egyptian e-learning platform for teachers, with a website and apps for iOS and Android. I founded both, designed their brands and experience, and Claude Code is the tool I direct to write the code. This bilingual portfolio was made the same way.

None of that made me an engineer. It made the distance between a design decision and a working screen short enough for a designer to cross, with plans, diffs, Git and checks along. Where a mistake could cost money or expose personal data, a developer's review is still part of the job.

Conclusion

Claude Code lets someone who has never coded make real software by describing it, as long as they stay in charge. Start in a small project folder, plan before big changes, read every diff, commit after every working step, keep secrets out of the code and the chat, and stay in Manual mode until you know what normal looks like.

If you have a product idea and want a designer who can take it from the brand to a working build, tell me about your project.