Building a Personal Dashboard with Claude Code (No Experience Needed)

12minute read

TLDR: Claude Code is an AI coding assistant you run from your terminal. You describe what you want, it writes the code, you run it. If you’re willing to type a few commands and paste some instructions, you can build a personal dashboard that actually fits your life. I’ll walk you through exactly what I did.

Three weeks ago I had a browser with eleven tabs open, a Notion page I kept forgetting to check, a training spreadsheet from 2024, and a sticky note on my monitor that said “check Garmin.” Every morning I pieced together my own situation from five different places.

I’m a software developer. I have no excuse for that. But “build a dashboard” always felt like a Saturday project that never made the cut. Too many decisions, too much setup, easier to just open the tabs.

Then I spent forty-five minutes with Claude Code and had a working dashboard running locally. I haven’t opened those eleven tabs since.

Why Claude Code Instead of Just… Asking Claude

If you’ve used Claude on the web, you know it can write code. But you’re still the one who has to take that code, figure out where to put it, install the right libraries, debug why it won’t run. That gap between “Claude gave me code” and “this thing works on my computer” is where most people quit.

Claude Code lives in your terminal and closes that gap. It doesn’t just write code. It writes files, runs commands, installs dependencies, reads error messages and fixes them, and iterates until the thing actually runs. You describe what you want in plain language, and it handles the whole loop.

I’ve been using it for side projects for a few months now, and the best way I can describe it: it’s like pairing with a developer who’s faster than you, never frustrated, and doesn’t judge you for not knowing what a `package.json` is.

What I Built

My dashboard is a single webpage that opens in my browser and shows me:

  • Today’s date and the next 7 days with my Google Calendar events pulled in
  • My current week’s training plan (static text I update once a week, takes two minutes)
  • A to-do section that persists between refreshes
  • My weekly mileage from Garmin (this part took an extra twenty minutes because Garmin’s API is annoying, but we’ll get to that)
  • A weather block for Pittsburgh that updates automatically

It’s not fancy. It’s a dark-mode HTML page that runs off a simple local server. It loads in half a second and has exactly the information I care about and nothing else.

That’s the point.

Getting Claude Code Set Up

You’ll need two things: Node.js installed on your computer, and a Claude API key from Anthropic. If you don’t have Node.js, go to nodejs.org and download it. Takes about three minutes.

For the API key, go to console.anthropic.com, make an account, and grab a key from the API Keys section. There’s a free tier with usage limits that’s plenty for this.

Once you have both, open your terminal (Terminal on Mac, PowerShell or Command Prompt on Windows) and run:

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

Then set your API key:

export ANTHROPIC_API_KEY=your-key-here

That line only persists for the current terminal session. To make it permanent, add it to your `.zshrc` or `.bash_profile`. If you don’t know what that means, ask Claude Code once it’s running. It’ll handle it.

Now navigate to a folder where you want your dashboard to live:

mkdir my-dashboard cd my-dashboard claude

That last command launches Claude Code. You’ll see a prompt. You’re in.

How to Tell It What You Want

This is where people overthink it. You don’t need to know how to code. You need to know how to describe what you want like you’re explaining it to a person.

I started with:

I want to build a personal dashboard that runs in my browser. 
It should be a single HTML page with a dark background. Show 
me today's date and a 7-day calendar view. Add a to-do list 
that saves between page refreshes. Add a weather widget that 
shows current weather for Pittsburgh, PA using the Open-Meteo 
API (which is free and needs no key). Make it look clean and 
minimal.

Claude Code responded by creating the files, installing what it needed, and telling me how to run it. I ran npx serve . like it told me, opened localhost:3000 in my browser, and had a working dashboard.

It wasn’t perfect. The to-do list styling was off, the calendar was too small on my monitor, and I wanted the weather more prominent. So I told it that, in plain English, and it fixed each thing. This back-and-forth took about twenty minutes.

Personal dashboard running in dark mode, showing calendar, weather, and to-do sections against a deep navy background with electric blue accents and clean geometric layout

Adding the Calendar Integration

The built-in calendar I started with was just a static 7-day grid. Getting real events from Google Calendar took a few more steps, but Claude Code walked me through every one of them.

I said: “I want to pull in events from my Google Calendar. How do I do that?”

It explained that I’d need a Google Cloud project with the Calendar API enabled and an OAuth client. Then it said, “want me to write the code to handle the OAuth flow and pull your events once you have the credentials?” Yes. Obviously yes.

The credential setup is manual. You go to console.cloud.google.com, create a project, enable the Calendar API, download a credentials.json file, and drop it in your project folder. Takes about ten minutes if you follow Claude Code’s step-by-step instructions, which it gave me unprompted.

After that, it wrote an auth flow that handles the OAuth login in your browser, caches your token locally, and fetches your events on page load. Once I dropped the `credentials.json` file in the right place, it worked on the first try.

The Garmin Part (Skippable But Worth It)

I wanted my weekly running mileage visible on the dashboard. Garmin doesn’t have a clean public API, which is exactly the kind of thing I used to see and close the browser tab over.

I told Claude Code: “I want to show my weekly mileage from Garmin. I know their API is not easy. What are my options?”

It gave me three options with pros and cons for each. I went with the Garmin Connect scraper approach using a community Python library. It wrote a small Python script that logs in with my Garmin credentials, pulls my weekly activity summary, and dumps it to a JSON file my dashboard reads. I run the script manually each morning (takes two seconds), and the dashboard displays whatever’s in the file.

Not elegant. Works perfectly.

I didn’t have to figure any of that out myself. I told Claude Code what I wanted, it gave me options, I picked one, and it built it.

What Surprised Me

I’ve been coding for over ten years and I still found Claude Code faster than doing this myself. Not because I couldn’t build it, but because the number of small decisions required to set something like this up is genuinely exhausting. What framework? Which calendar library? How should the to-do list persist? What’s the cleanest way to handle the OAuth token cache?

Claude Code made every one of those calls, explained why when I asked, and moved on. I spent my time deciding what I wanted, not how to build it. That’s the right division of labor.

If you don’t code at all, the experience is a little more disorienting at first. There are moments where Claude Code will tell you to run a command and you won’t fully understand what it does. Run it anyway. It knows. And if something breaks, it will fix it. That’s the whole point.

Blueprint-style technical schematic of a dashboard system architecture on dark navy background, showing connected components including calendar, weather, and training data modules in electric blue geometric linework

The Honest Limitations

It’s not magic. There are a few things worth knowing going in:

Claude Code works best on self-contained projects. Building a local dashboard is ideal. The more your project depends on external services with complicated auth flows, the more manual setup you’ll hit. It’ll guide you through all of it, but you should expect that.

Hosting is a separate problem. What I built runs locally on my computer. If you want this accessible from your phone or another device, you’d need to host it somewhere. Claude Code can help you do that too, but it’s another conversation.

It uses API credits. The free tier covers a lot of experimentation, but if you’re iterating heavily on something complex, watch your usage. I’ve spent maybe three dollars building and tweaking this dashboard over a few weeks.

Your Turn

Here’s what I’d actually do if I were you: open your terminal, install Claude Code, and ask it to build you a simple to-do list app that saves to a file. That’s it. Don’t start with the dashboard. Start with something that takes fifteen minutes and works. Once you’ve seen it work, you’ll know how to have the bigger conversation.

The barrier isn’t your technical knowledge. It’s the first five minutes of not knowing where to start. You’ve just read two thousand words about where to start. That excuse is gone.