TIPS 52 · DASHBOARD

The dashboard with no backend

A page with your app's numbers, published by Claude Code with a link you can share: how to connect the data, what updates on its own and what doesn't, who can see it and how Claude answers comments.

What it is and why it matters

An investor asks for your numbers. Usually you send a screenshot, or a spreadsheet that's out of date a week later. Or you build a real dashboard: a server, a database, a login, a deploy. All of that for one page.

Claude Code can publish a real page, called an artifact: a web page on claude.ai, with its own link, that Claude designs and publishes from your session. There's no server of yours to keep running, no deploy, no code to maintain. And if you connect your services as connectors, for example Stripe for payments and PostHog for analytics, the page reads fresh data every time it opens.

There's a catch, and it's the heart of this guide: live data goes through the account of whoever is viewing the page, not yours. For you and your team that works great. For an investor outside your organization you do it differently: Claude republishes the page with the new numbers, at the same link. You'll find both here.

1. What you need

  • A Claude Pro, Max, Team or Enterprise plan.
  • Claude Code in the terminal or the desktop app, signed in with your claude.ai account (/login). With an API key or a cloud provider such as Amazon Bedrock you can't publish.
  • The latest version of Claude Code: live data and comment replies need recent versions.
  • On Team and Enterprise, artifacts are on by default, but an Owner can turn them off, and connector calls from pages have a separate toggle (Enable artifact connectors).

If you ask for a page and Claude writes a local HTML file with no link, artifacts aren't enabled for your session: go back over these points.

2. Connect the data as claude.ai connectors

Here's the detail that wastes the most time. The published page can only call the connectors on your claude.ai account. MCP servers added locally with claude mcp add help Claude while it builds the page, but the published page can't call them.

  1. Open claude.ai/customize/connectors.
  2. Stripe has an official connector in the directory: search for it, connect it, log in to Stripe and choose which accounts to give access to. On Team and Enterprise an Owner has to add it first.
  3. For PostHog, if you can't find it in the directory, use Add custom connector with the address https://mcp.posthog.com/mcp and log in. PostHog picks the region, US or EU, based on your account.
  4. In Claude Code, type /mcp: the claude.ai connectors show up in the list. If they're missing, check that you signed in with your claude.ai account and not with an API key.

The Stripe connector can also write, not just read: keep tool approval on, as Stripe itself recommends.

3. Ask for the dashboard

The more precise you are about what you want to see, the fewer rounds it takes. Write PostHog events with their real names: if you don't know them, ask Claude to list them from the connector first.

The prompt
Make me an artifact: a dashboard for an investor with my app's numbers.
At the top, four tiles: total signups, signups in the last 7 days, active paying subscribers, monthly recurring revenue.
Below: signups per day over the last 30 days, and the onboarding funnel, with how many people reach each step and where they drop off, as percentages.
Signups and onboarding from PostHog (the signup event is [event], the onboarding steps are [events in order]); subscribers and revenue from Stripe.
Read the data from the claude.ai connectors every time the page opens. In every live section, put a fallback message that names the connector it needs, in case it doesn't respond. Under every number, write where it comes from and when it was read.

Before publishing a page that calls connectors, Claude Code asks you to confirm. Then it gives you the link and opens the browser; /artifacts lists all your pages.

4. How it stays up to date

A page with connectors reads the data when it opens, and it can refresh on an interval or with a button. Responses are cached in the viewer's browser: when they reopen it they see the last numbers right away, and the fresh ones a moment later.

The prompt
Add a “Refresh” button to the dashboard and an automatic refresh every 15 minutes while the page is open. At the top, show the time of the last refresh. If a connector doesn't respond, keep the last numbers and say they're not up to date. Then republish at the same link.

Remember where those calls go through: the viewer's account, and the viewer has to give permission the first time. Two people opening the same page can see different data. Anyone who hasn't connected the connector, or declines, sees the page without its live sections.

For an investor: the same page, republished

For anyone who opens the public link without a claude.ai account, or from outside your organization, connectors don't run. So you make a version with the numbers built in, and keep it fresh by republishing it at the same link: anyone with the page open sees the update right away.

The prompt
Make a copy of the dashboard for the investor, with no connector calls: read the numbers from Stripe and PostHog now and put them in the page, with the date and time they were read. Publish it as a new artifact and give me the link.

To update it, even from a new session, give it the link:

The prompt
Update [artifact link] with today's numbers from Stripe and PostHog. Same structure, only change the numbers and the time they were read.

To do it every morning you can use /loop, as long as the session stays open: a recurring /loop expires after seven days. With a public page, Claude Code asks you to confirm the first time it changes it in each conversation. Cloud scheduled tasks, on the other hand, won't republish a publicly shared page without asking you.

5. Who can see it

  • At first, only you can see it. To share it, open the page in the browser and use Share, at the top.
  • On Pro and Max you share it with a public link: anyone who has it can open it, without signing in.
  • On Team and Enterprise you give it to specific people in your organization, or to the whole organization. The public link is off until an Owner turns on External sharing.
  • Every publish is a version: in Share you choose which one others see, or always show the latest.
  • To take it down: /artifacts, pick the page and press d. It's permanent: the link stops working for everyone, you included.

The rule I'd set myself: in the public version, only put numbers you'd also send by email. Anyone with the link can forward it to anyone.

6. Comments, with Claude answering

When you share the page within your organization, so on Team or Enterprise, the people who see it can leave comments. People who only open it through the public link don't see them and can't write any.

  1. Someone who can edit the page writes a comment and sends it to Claude with Send to Claude, or writes @claude in the comment.
  2. Claude Code watches the pages published in your session: the comment arrives there, Claude reads the thread and replies. The reply shows up as Claude, via you.
  3. If your permission mode lets it post without asking, it replies on its own. Otherwise it asks for your OK before reading the thread and before replying.
  4. To stop it: pressing Ctrl+C once at an idle prompt pauses the replies; in /tasks you stop a single page.

Claude only replies to threads someone sent to it: the others stay open until a person resolves them. You can also ask it for the comments yourself:

The prompt
Read the comments on [artifact link]. Answer the questions about the numbers by explaining where each figure comes from, make the changes they ask for and republish. If a request changes what we show outside the company, ask me first.

Common mistakes

  • Connecting Stripe and PostHog only with claude mcp add. The published page only calls claude.ai connectors.
  • Sending the investor the live version. From outside your organization the connectors don't run, and they see empty tiles.
  • Forgetting the fallback messages. Anyone who hasn't connected a connector sees an empty section without knowing why.
  • Assuming every comment reaches Claude. Only the ones sent with Send to Claude or @claude by someone who can edit the page do.

Checklist

  • I'm on a Pro, Max, Team or Enterprise plan and I ran /login
  • Stripe and PostHog are connectors on claude.ai, and /mcp shows them
  • Every live section has a fallback message
  • Under every number there's the source and the time it was read
  • The investor gets a version with the numbers built in, not the live one
  • I decided who sees it, from the Share button

Frequently asked questions

Is it really backend-free?

Yes: it's a single page, hosted on claude.ai. That's why it can't have its own login or several linked pages, and it only loads libraries from a few public CDNs. For an internal tool with its own server, you need your own infrastructure.

Does it work for the team too?

It's the best case. On Team and Enterprise you share it with the organization, everyone sees live data through their own connectors, and comments with Claude work.

← All guides