Build a website
Build a website in a folder with Benchy Desktop or your own agent, and tell Benchy where the output is.
A website is an ordinary folder of files on your computer, hand-written or built with a framework; publishing is the same either way. A website designed on a canvas needs no folder: see Publish a canvas.
The Website section of BENCHY.md
The project’s BENCHY.md names its website, so every agent and tool publishes the same folder to the same address:
## Website
- Name: olive-prints
- Output: site/
- Build: npm run buildNameis the address, hereolive-prints.benchy.site.Outputis the folder to publish, relative to the project: the one holdingindex.html, or a framework’s build folder.Buildis a note for people and agents. Benchy never runs it.
Add the section once the name is reserved. The benchy site commands read it, so in the project’s folder they need no name or folder.
Build with Benchy Desktop
Desktop treats a project as a website when it finds an index.html at the top or one folder down, or a package.json using a web framework such as Vite, Astro or Next.js. Benchy, Claude Code and Codex can then read and change that project’s files, and nothing else on your Mac.
- Say what you want. “Add an About page with our opening hours” is enough.
- Approve the edits. Each file change asks first, and the card offers Allow edits in this project for this chat. In a folder you opened yourself, the first edit asks Let agents edit files in this folder?; the project’s menu changes the answer later.
- Undo anything. Every change shows in the chat with the file and lines changed, and Undo restores the file.
- Watch it in the page viewer, then publish the folder with
benchy site deployor your agent. See Publish from the CLI.
Agents never change package.json, lockfiles, hidden files such as .env, node_modules/, Made by Benchy/ or the project’s top-level config files.
The page viewer
The page viewer shows your site beside the chat: local pages, this project’s published pages on benchy.site, and reference pages an agent opens.
Screenshot: the page viewer beside the chat, showing a local page at 390 px.
- Its title is the page’s address, such as
localhost:5173, with Back and Reload; its menu holds the width (Full width, 768 px or 390 px), Open in browser and Clear preview data. - For a site with no build step, Benchy serves the folder holding
index.htmlitself. When the viewer is empty, it offers a server you already run on this Mac. - Agents can read the page, click and type in it, take screenshots and read its console. On this project’s own pages they need no approval; any other site asks once per chat. The header says “Codex is using this page” while one does, and typing into a password field takes the page back.
- An agent never uses a printer’s web page.
Dev servers
A project with a package.json can run its dev, start, preview or serve script: choose Start in the page viewer, which shows the script’s exact text first. An agent can ask to start one too, every time, showing the same text.
- Benchy never installs packages. If
node_modulesis missing, the viewer names the command to run in Terminal. - A dev server can’t reach the internet or your local network or read outside the project, and is stopped at once if it opens to the network. A font or API fetched at start-up fails, and its log says why.
- A server stops when you choose Stop, quit Desktop, or leave the project for ten minutes. Settings → Data lists the ones running.
Build with your own agent
Claude Code, Codex, Cursor or any other agent works in the folder as on any project. Once connected to your workspace, it can also check and reserve a name, publish a preview, go live and check what is live. Ask it to preview first and go live only when you say so. Benchy never runs a build: you or your agent run it, and the output folder is published.
Framework builds
Any tool that writes static files works:
| Tool | Output folder | Note |
|---|---|---|
| Vite | dist/ | Works as it is |
| Astro | dist/ | The default static output |
| Next.js | out/ | Set output: "export" in next.config |
| SvelteKit | build/ | Use adapter-static |
| Eleventy | _site/ | Works as it is |
A single-page app that routes in the browser needs a file for each deep link, or routes after a #. See App routing.