Open Form

open-form dev

Run the dev server with Studio, hot reload and agent integration.

pnpm dev
# or
pnpm exec open-form dev

Starts a Vite dev server on http://localhost:3000 (or the next free port) and prints Studio's URL and a link for each form:

┃  Studio    http://localhost:3000/studio
┃  Form      http://localhost:3000/f/contact

Only the first six forms get a link; the rest show as … N more. With --host, a Network row gives the address for other devices. A Skills row appears when starting updated the skills, or couldn't.

Run it in your workspace: a folder with open-form.config.ts, or a package.json that depends on @open-form-build/core. Anywhere else it stops with an error instead of writing skills and a secret into that folder. dev loads .env from the workspace when there is one, so OPEN_FORM_ADMIN_PASSWORD and other variables can live there; variables already set in your shell win. It reads .env once at start, so restart dev after changing it.

Flags

FlagDefaultDescription
-p, --port <port>port in config, else 3000Port to listen on.
--host [host]localhost onlyExpose the server on the network, optionally on a specific host.
--openoffOpen Studio in the browser.

What you get

  • Studio at /studio — your forms, Preview with Edit mode, Responses, Schema, Settings and Themes. See Studio.
  • Forms at /f/<id>, as respondents see them. Submissions are stored for real in .open-form/open-form.db, the same database open-form start uses on this machine.
  • Hot reload — saving a form updates it in the browser, and the server re-derives its schema, so validation and Responses follow the code without a restart. Saving open-form.config.ts restarts the server with the new config and reloads open pages; if the file has an error, the server keeps running with the previous config. Press r + Enter to restart by hand.
  • Writes to your source — Studio's changes land in your files: text edits and notes from Edit mode and schedule changes in a form's Settings in the form's file, translated text in its locales/*.json (or inline tables), folders in forms/.folders.json, and token edits, fonts and added starters from the Themes page in themes/. Deleting a form removes forms/<id>/ and its responses; see open-form delete.

Agent integration

  • Skills sync — on start, dev copies the built-in skills from the installed @open-form-build/core into .agents/skills/, overwriting any that differ, and syncs again if the package's skills change while it runs. Set OPEN_FORM_SKIP_SKILLS_SYNC=1 to turn this off. See open-form sync:skills.
  • current.json — as you move around Studio and form pages, dev writes where you are (form, step, the form's own theme, an open reference theme, Edit-mode selection) to node_modules/.open-form/current.json, so your agent knows what "this" means. See /current-form.

Admin access

Without a password, Studio and the admin API answer only direct requests from this machine. Pages served from another origin — another dev server on localhost, say — are refused, and so are requests through the network (--host), a tunnel or a reverse proxy that announces itself.

Set OPEN_FORM_ADMIN_PASSWORD (at least 16 characters) to reach Studio from anywhere else. With a password, Studio requires signing in for every request, including from this machine: a reverse proxy that adds no X-Forwarded-For (nginx's default proxy_pass) or a raw TCP tunnel (ssh -R, socat) makes a remote request look local, so never expose dev without one.

dev ignores OPEN_FORM_TRUST_PROXY. Behind a proxy, only trustProxy in open-form.config.ts makes it read the client's address and protocol from forwarded headers.

Reaching the dev server through a proxied domain and getting a blocked-host error? Add the host to allowedHosts in open-form.config.ts.

On this page