Claude Code Tutorial Part 1: Introduction and the Prompt-First Mindset

Part 1 of 8 of Building a Website with Claude Code. See all parts.

Start here: plan first, prompt well, build second

Half of this tutorial is about planning. Writing a brief, drafting prompts, reviewing plans, deciding what not to build. That's deliberate. The teams who get good results from Claude Code don't start by saying "build me a website." They start by writing a one-page brief and a careful first prompt.

A prompt is not a command. It's a conversation opener that tells Claude what you want, why you want it, how big the change should be, and what evidence of success looks like. A plan is what comes back: a description of what Claude would do, in what order, before any code is written. You read it, push back, and only then say "go ahead."

Three sentences that change every project:

Read the brief in BRIEF.md. Don't write any code yet. Ask me clarifying questions, then propose a plan and save it to PLAN.md.

That's bigger than I asked for. Reduce the scope to just X. Don't touch the other files.

Show me what changed. Don't say "done"; show me the diff and run the test.

If you remember nothing else from this tutorial, remember those three.

Foundations

What a website actually is

A website is a collection of pages that visitors view in a web browser. Each page is built from three layers:

• Content: the words, images, and videos.
• Structure and style: how the content is laid out and what it looks like (the colour, type, spacing).
• Behaviour: what happens when the visitor clicks, scrolls, or types.

Behind the scenes, a website can be:

• Static: every visitor sees the same files. Fast and cheap. Good for a marketing site or a portfolio.
• Database-driven (dynamic): pages are assembled from a database when the visitor asks for them. Good for a blog, a shop, or anything where the content changes often or is personalised.

The website you're building will probably be database-driven if you plan to publish articles, manage products, or have user accounts. Otherwise, static is simpler.

What Claude Code is

Claude Code is a tool from Anthropic that runs in your computer's terminal. You describe what you want in plain English. Claude reads your project, writes the code, runs it, fixes problems, and explains what it did.

Think of it as a very capable junior developer who:

• Reads any file you point them at.
• Writes new files or edits existing ones, and shows you the changes before saving.
• Runs commands on your computer (with your permission).
• Searches the web when needed.
• Remembers the conversation, but forgets it when you close the window.
• Doesn't get tired.

It is not magic. It will make mistakes. It needs you to set the direction, review the work, and say when something is wrong. The rest of this tutorial teaches you how to do that.

What you can realistically achieve

In a day or two with Claude Code, a non-technical person can:

• Build a simple multi-page website with custom content and design.
• Deploy it to a real domain.
• Add a basic content management area so non-developers can edit pages.
• Wire up a contact form and a mailing list signup.

In a week or two:

• Build a small blog or news site with categories, tags, and an editor's interface.
• Add user accounts and login.
• Connect to a payment provider.

In a month, with patience and review:

• Build a small product, a directory site, a learning hub, a booking tool, a simple shop.

What you should not expect:

• A complex, scalable enterprise app without any technical help.
• Anything safety-critical (medical, legal, financial) without a developer's review.
• Code you can publish without reading the diffs.

All parts · Part 2 of 8: Set Up Claude Code on Your Computer →