Workflow Observability UI
npm install @workflow/webObservability Web UI Package bundled in the Workflow DevKit.
While this UI is bundled with the Workflow CLI, you can also self-host it.
There are multiple approaches:
1. Run npx workflow web --noBrowser on a server
2. Clone this repo and deploy as a normal Next.js app
3. Deploy the published @workflow/web package
All options require the environment to be configured with the right environment variables for the World you're using.
``bash`
npx workflow web --noBrowser
This will start the web UI on the default port 3456.
- Build and deploy like any Next.js app.
- Configure the backend via environment variables (same variables the CLI writes).
The published @workflow/web package contains a prebuilt .next directory and package.json.next start
You can install it and run from the package directory.
Example (Node server / container):
`bash
mkdir workflow-observability-ui
cd workflow-observability-ui
npm init -y
If you prefer, you can set a
start script in your host package.json like:`json
{
"scripts": {
"start": "cd node_modules/@workflow/web && next start -p $PORT"
}
}
`$3
The UI reads configuration on the server via environment variables.
- Vercel (remote observability):
-
WORKFLOW_TARGET_WORLD=vercel
- WORKFLOW_VERCEL_TEAM
- WORKFLOW_VERCEL_PROJECT
- WORKFLOW_VERCEL_ENV (optional; defaults to production)- Local (filesystem-backed observability):
-
WORKFLOW_TARGET_WORLD=local
- WORKFLOW_LOCAL_DATA_DIR (absolute path to the workflow data dir, e.g. /path/to/project/.workflow-data)
- WORKFLOW_MANIFEST_PATH (optional; enables the Graph tab)- Postgres:
-
WORKFLOW_TARGET_WORLD=postgres
- WORKFLOW_POSTGRES_URLFor a complete list and CLI flags, see
npx workflow inspect --help and npx workflow web --help.If you're deploying this to Vercel, setting
WORKFLOW_TARGET_WORLD to vercel` is enough