# Build a website

> Build a website in a folder with Benchy Desktop or your own agent, and tell Benchy where the output is.

Canonical: https://benchy.world/docs/websites/building
Last updated: 2026-10-09

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](https://benchy.world/docs/websites/publish#canvas).

## The Website section of BENCHY.md [#benchy-md]

The project’s [BENCHY.md](https://benchy.world/docs/benchy-md) names its website, so every agent and tool publishes the same folder to the same address:

BENCHY.md

```
## Website
- Name: olive-prints
- Output: site/
- Build: npm run build
```

- `Name` is the address, here `olive-prints.benchy.site`.
- `Output` is the folder to publish, relative to the project: the one holding `index.html`, or a framework’s build folder.
- `Build` is 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]

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.

1. **Say what you want.** “Add an About page with our opening hours” is enough.
2. **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.
3. **Undo anything.** Every change shows in the chat with the file and lines changed, and **Undo** restores the file.
4. **Watch it in the page viewer**, then publish the folder with `benchy site deploy` or your agent. See [Publish from the CLI](https://benchy.world/docs/websites/publish#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 [#preview-pane]

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.

- 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.html` itself. 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 [#project-scripts]

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_modules` is 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 [#your-agent]

Claude Code, Codex, Cursor or any other agent works in the folder as on any project. Once [connected to your workspace](https://benchy.world/docs/connect-your-agent), 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 [#frameworks]

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](https://benchy.world/docs/websites/hosting#app-routing).
