How to Build a Client-Ready Website with Slim Minima

The exact workflow used to build this site: write your copy, nail the design direction, set up your services, then let a CLI agent like Claude Code put it all together.

Slim Minima is built to be handed off. But the real power is in how you build it in the first place. This is the exact workflow used to build this site - five steps you can follow with any CLI agent like Claude Code or Codex.

Step 1: Write your website copy first

Before you open a code editor or fire up an AI agent, write your copy. All of it. Headlines, subheadlines, feature descriptions, FAQ answers, calls to action, and footer text. Put it in a single plain text or Markdown file.

This matters more than it sounds. A CLI agent given a copy document can populate blocks, write meta descriptions, and produce a coherent page in one pass. An agent given nothing produces placeholder text that you have to go back and fix manually, which takes longer than writing the copy yourself.

Keep it tight. One document, clearly sectioned. Something like:

## Hero
Heading: Vibe code the site. Hand off a CMS.
Sub: Slim Minima is an open source CMS...

## Features
- Visual page builder: Reorderable blocks...
- Blog: A clean writing editor...

## FAQ
Q: Is it free?
A: Yes. Open source and self-hosted.

That is your source of truth for everything that follows.

Step 2: Develop your design

Next, work out the visual direction. You do not need a full Figma file. What you need is enough to brief your agent: a color palette, a font pairing, the general feel of the layout.

Tools like Claude Design and Google Stitch are good starting points. Describe the product and the audience, ask for a design direction, and export whatever it produces. These tools typically give you design files as HTML, PNG, or PDF - drop them into your repo and point your agent at them. CLI agents can read all three formats directly, so it picks up the color palette, font choices, and layout references without you having to describe any of it in words.

If you are using Slim Minima, most of the design is already in CSS variables. One file, a handful of values, and the whole theme changes. You do not need a pixel-perfect design up front. You need enough of a direction that the agent is not guessing.

Step 3: Set up your services

Three free accounts, five minutes. This is the only manual step.

Neon - for the database. Go to neon.tech, create a project, and copy the connection string from the dashboard. It looks like: postgresql://user:password@host/dbname?sslmode=require

Cloudinary - for media uploads. Create a free account at cloudinary.com and note your cloud name, API key, and API secret.

Resend - for contact form emails. Create a free account at resend.com and grab an API key. Verify your sending domain while you are there.

You now have everything the agent needs to configure the environment.

Step 4: Give your CLI agent the brief and let it build

I need you to build a website based on this CMS: https://github.com/geraldho81/slim-minima

Clone the repo and read AGENTS.md before you do anything else. It tells you exactly where
to build and what not to touch. Once you have read it, here is everything you need:

COPY: See website-copy.md in this repo. Use it exactly - do not rewrite or summarise it.

DESIGN: See the design files in /design (HTML, PNG, or PDF). Extract the colour palette,
font choices, and layout direction from those files and update the CSS variables in globals.css to match.

SERVICES:
- DATABASE_URL: [your Neon connection string]
- CLOUDINARY_CLOUD_NAME: [your cloud name]
- CLOUDINARY_API_KEY: [your key]
- CLOUDINARY_API_SECRET: [your secret]
- RESEND_API_KEY: [your Resend API key]
- AUTH_SECRET: [any random string]

Add these to .env.local, run the migration and seed, then start the dev server so I can review.

That is the whole brief. The agent reads the schema, builds the blocks, applies the theme, and runs the site. You review what it produces and iterate from there. When you are happy, deploy to Vercel or any platform that runs Next.js and set the same environment variables in your hosting dashboard.

Step 5: Iterate until it is right

This is where most of the real work happens. The agent gets most things right on the first pass, but you will still need to go through the site and refine it. A few things to work through at this stage:

  • Troubleshoot anything that did not render correctly or threw an error during setup.
  • Check the database - make sure all content is seeded and showing up as expected.
  • Refine the copy. Read it out loud, tighten it, make sure it sounds like the client.
  • Go through /admin and confirm every page, post, and setting is editable. This is the handoff interface, so it has to work.
  • Adjust anything else to your liking - colors, spacing, block order, whatever feels off.

At this stage, anything is possible. You have the full codebase, a running CMS, and a CLI agent that can make changes on your instruction. Keep iterating until it is right.

What the client gets

At the end of this process, your client has a site that lives in their own repo and a CMS at /admin they can use without code. Pages are editable block by block. Blog posts use a clean writing editor. Media uploads go to their own Cloudinary account. Contact form submissions land in their inbox.

Your part is done. The handoff is real.

Want to go deeper?

If you want hands-on training with CLI agents like Claude Code, Axecute offers 1:1 sessions that use your actual work, not toy examples. It is the fastest way to get comfortable directing agents rather than just prompting them.

How to Build a Client-Ready Website with Slim Minima | Slim Minima