sodimo

Chapter 37 / 40

Cloudflare Pages with Claude Code

One of the things Sodimo hands to every team member is the ability to publish their own internal page. If Rani wants a “top of mind” view of her ten warmest accounts, she does not file a ticket — she opens Claude Code on her laptop, describes the page in plain French or English, reviews what it produces, and deploys it to a sodimo.eu URL the rest of the team can open. Same for Paul with a finance summary, same for anyone who finds themselves copy-pasting the same data twice.

Status: Planned — the pattern is proven on Thomas’s own machines and goes live for the Sodimo team once the Framework Desktop is racked and Claude Code is installed on the first laptop. The walk-through below is the shape it will take.

This chapter is a walk-through, not a reference. For the list of tools your page is allowed to read from (the CRM, the warehouse, the email archive), see chapter What the AI can access. For the list of skills already authored as templates you can copy, see chapter Skills library.

What you need, once

Three things, set up once per laptop, by Thomas during the engagement:

  1. Claude Code installed on the laptop and signed in under your @sodimo.eu Google account.
  2. A short allowlist of credentials from the Sodimo vault, dropped into Claude Code’s config — a read-only token for the D1 warehouse, a Cloudflare Pages deploy token, a git credential for the sodimo/* organisation. You never copy or type these; Thomas pastes them from the vault the first time.
  3. A scratch folder on your laptop where your pages live (~/sodimo-pages/, one folder per page). Claude Code uses this as its working directory.

After that, every future page is a ten-minute conversation.

Creating a new page

Open a terminal, cd ~/sodimo-pages/, and start Claude Code. Describe the page you want, in whatever language you think in — French and English both work. Claude Code will clarify, write the page, show you what it built, and iterate with you.

A realistic opening turn:

I want an internal page called “Top of Mind” that lists my ten warmest accounts. Warmest means: a deal is open and moving, or there has been activity in the last ten days. For each account I want the name, the stage, the last contact date, and a one-line summary. I want to open it on my phone during a visit.

Claude Code will do roughly the following, talking you through each step:

  1. Create a folder for the page with an Astro or plain HTML skeleton.
  2. Write a small backend query that asks the D1 warehouse for the ten warmest accounts, using the read-only token from your config.
  3. Build the page (title, table, a responsive layout that works on a phone).
  4. Show you a live preview, locally.
  5. Ask you what to tweak.

You iterate in plain language — “sort by last-contact-date instead of name”, “drop the summary column”, “make the stage a coloured pill”. Every round is a few seconds.

Deploying

When you are happy with the preview, one turn:

Deploy this to topofmind.dash.sodimo.eu.

Claude Code runs the Cloudflare Pages deploy, gates the URL behind Cloudflare Access (same Google-Workspace gate as every other internal tool), and tells you when the URL is live. Ninety seconds, start to finish, for a page nobody has built before.

The URL is permanent. Next time Rani wants to see her top of mind, she opens the bookmark. If the data changes during the day — a deal advances, a contact lands in her inbox — the page reflects it on the next refresh.

Editing a page that already exists

Same flow, lower friction. Open Claude Code in the folder of the page you want to change:

In Top of Mind, add a column showing the number of days until the next scheduled meeting, if any.

Claude Code reads the existing code, drafts the change, previews it, and redeploys when you approve. You do not edit the code yourself. You do not need to know whether the change is in the query, the template, or the CSS — describing what you want in business terms is sufficient.

What to do when something breaks

Three shapes, three responses.

The preview looks wrong but the deploy has not happened yet. Tell Claude Code what is wrong. It will fix the page and re-preview. No harm done — nothing is live.

The deploy succeeded but the live page is empty / showing an error. Two common causes: the D1 token has been rotated and your local config still has the old one (see chapter Key rotation), or the query the page runs against D1 has drifted because a column was renamed upstream. Ask Claude Code to look at the live error and fix it. In most cases it is a one-turn fix.

The deploy itself fails. Cloudflare Pages refused the upload. The usual cause is a quota or an auth issue. Paste the error back into Claude Code and it will explain and fix. If the fix is “an admin has to do X”, Claude Code will say so — message Thomas or, after the handoff, whoever owns Cloudflare admin.

In every case: you do not need to read the code, you do not need to understand the stack trace, and you do not need to message Thomas as a first step. Claude Code is your first line of defence. It will tell you when it cannot fix something and needs a human.

Conventions worth keeping

A few conventions the team adopts together make every page easier to maintain:

  • Name pages after the question they answer. “Top of Mind”, “Who owes us money”, “This week’s agent runs”. Not “Rani’s dashboard v2”.
  • One page, one audience. A page for Rani’s sales view and a page for Paul’s finance view are separate pages, not tabs on the same page. Cheap to build, cheap to throw away.
  • Live data, always. Pages read from D1 at render time. There is no “export once and paste it into the page” shortcut — if it is worth a page, it is worth a live query.
  • If it has held for a month, promote it. A page that everyone opens three times a week is a page that deserves a tile on the launchpad (chapter The launchpad). Tell Thomas; it is a one-line change.

What this is not

This is not a replacement for the CRM, for OpenWebUI, or for Paperclip. Those tools are full applications with their own interfaces and their own chapters. Cloudflare Pages with Claude Code is for the lightweight middle ground — the report that nobody has built, the one-off view for a specific question, the dashboard that answers a recurring question in the team’s own vocabulary.

A good rule of thumb: if you would otherwise ask Rani or Paul “can you screenshot that for me every Monday”, the answer is a page.