Set Up and First Build

From nothing to a working page

Think of Claude Code as a fast, well-read junior who never gets tired and still makes confidently dumb mistakes. You say what you want in plain English. It reads the files in a folder, writes new ones and tells you what it did. Everything happens in one folder on your computer, and you can see every file it makes. In this chapter you'll get it running and have it build the first version of a dashboard from a fake sales spreadsheet.

Gabe

I was skeptical after 15+ years of watching miracle tools fade. Claude Code changed my mind once I handed it whole tasks, and I now run my company, Nexrizen, on it.

Build it

1. Install the app

   Download the Claude desktop app from the desktop quickstart, install it and sign in. Then click Code at the top of the sidebar. You don’t need a terminal, and you don’t need to install anything else.
   Stuck?

   It asks me to upgrade.

   Claude Code needs a paid plan. Subscribe, then restart the app.

   I can't find Code. The sidebar is only icons.

   Hover over each icon to see its name.

   I get a 403 error.

   Sign out and back in. If that fails, see the troubleshooting section.

2. Make a folder and add the sample data

   Make a new folder called my-dashboard on your desktop. Download sample-pipeline.csv into it. A CSV is a spreadsheet saved as plain text. This one is 15 made-up deals, so nothing bad happens if it leaks.
   Stuck?

   The file opened in my browser instead of downloading.

   Right-click the link and choose Save Link As, then pick your folder.

3. Point Claude at the folder

   In the row under the prompt box, click the first control and choose Local. Click the folder control beside it, choose Open folder… and pick my-dashboard. Then find the mode selector in the same row and choose Manual. In Manual mode Claude asks before it edits a file or runs a command. You want to see those questions the first time.
   Stuck?

   There's no environment control under the prompt box.

   You have an older layout. Update the app and reopen it.

4. Ask for the first version

   Paste this and press Enter.
   Paste this into Claude Copy

   I have a file called sample-pipeline.csv in this folder. It's a fake sales pipeline. Build me a dashboard in one file called index.html. Show the total value of open deals, and a table of every deal. Won and Lost deals are not open. Put the data directly inside the page, so it works by opening the file, with no server and nothing to install. Don't use outside libraries or services. When you're done, tell me in plain English what you made and how to open it.

   Claude will stop and ask permission to do things. A permission prompt is a question, and you may say no. Read what it wants to do. Creating index.html is what you asked for, so approve it. If you can’t tell what something does, decline and ask: “What would that do, in plain English?”

   Stuck?

   It wants to install Node, npm or something else.

   Decline. Then say: “Nothing to install, please. Make it a single HTML file I can double-click.” You don’t need any of that for this project.

   It's been working a while and I'm not sure it's okay.

   A minute or two is normal. You can click stop at any point, or type a correction and press Enter while it works.

5. Open it and check the number

   Click the index.html path in the chat to open the page in the app’s Browser pane, or double-click the file in your folder. The total should say $331,000, from 11 open deals. I added that up separately, so if yours is different, something is wrong.
   Stuck?

   The page is blank.

   Say: “The page is blank when I open it. Find out why and fix it.” Tell it exactly what you did, and it can usually work out the rest.

   The total isn't $331,000.

   Say: “The total should be $331,000 from 11 open deals. Find what’s wrong and show me what you changed.” Congratulations, you’ve just caught your first confident mistake.

6. Change something, then undo it

   Ask for something silly. This is the most useful minute in the chapter, because it shows you that nothing here is permanent.
   Paste this into Claude Copy

   Make the page title bright green and very large.

   Now undo it. Type /rewind and pick the point before that request, or just ask: “Undo your last change and put the page back how it was.” Rewind only covers changes Claude made in this session, which is why Chapter 5 adds a proper save point before anything goes public.

   Stuck?

   `/rewind` says it isn't available.

   Use the plain English version. Ask Claude to undo its last change, then open the page again to confirm it worked.