Vercel

Deploy chmonitor to Vercel using the legacy Next.js build. Vercel auto-deploys on every push to main and inlines client env vars at build time.

Prerequisites

Setup

Use the one-click button, or follow the manual steps.

Configure

Set environment variables in Vercel dashboard → Project → Settings → Environment Variables.

Client vs server vars on Vercel

On Vercel (Next.js), client-side vars use NEXT_PUBLIC_*. These are inlined at build time. Server-side vars are plain names. This differs from the TanStack app which uses VITE_*. For dual-surface settings you set the canonical CHM_* name once and the client var is derived from it at build time.

ClickHouse connection

For multiple hosts, all four variables must have the same count:

CLICKHOUSE_HOST=https://ch1:8443,https://ch2:8443
CLICKHOUSE_USER=monitoring,monitoring
CLICKHOUSE_PASSWORD=pass1,pass2
CLICKHOUSE_NAME=primary,replica

Query / pool tuning

Feature permissions

Add to Vercel env vars:

CHM_DISABLED_FEATURES=peerdb,actions
CHM_AUTH_REQUIRED_FEATURES=agent,settings,mcp
CHM_FEATURE_AGENT_ACCESS=authenticated
CHM_FEATURE_SETTINGS_ENABLED=false

For a config file, set CHM_CONFIG_FILE to a path readable by the Vercel function runtime and include the file in the repo.

Feature ids: overview, agent, insights, health, queries, tables, metrics, dashboard, security, logs, settings, cluster, operations, actions, mcp, docs, about.

Authentication

CHM_AUTH_PROVIDER=none

CHM_API_KEY_SECRET=a-long-random-secret

CHM_AUTH_PROVIDER=clerk
CLERK_SECRET_KEY=sk_live_...

# Client-side (NEXT_PUBLIC_ prefix; inlined at build)
NEXT_PUBLIC_AUTH_PROVIDER=clerk
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_live_...

CHM_AUTH_PROVIDER=proxy
CHM_CF_ACCESS_TEAM_DOMAIN=https://yourteam.cloudflareaccess.com
CHM_CF_ACCESS_AUD=<audience-tag>

CHM_AUTH_PROVIDER=proxy
CHM_PROXY_AUTH_HEADER=X-Forwarded-User
CHM_PROXY_AUTH_SECRET=a-long-random-secret

AI agent

LLM_API_KEY=sk-...
LLM_API_BASE=https://openrouter.ai/api/v1
LLM_MODEL=openrouter/free
AGENT_API_TOKEN=bearer-token-for-agent-api
AGENT_ENABLE_CONTROL_TOOLS=false

Conversation store

The default is browser localStorage — no server config needed. On Vercel (Next.js v0.2), use postgres for server-side persistence. D1 and Durable Object stores are Cloudflare-only.

Postgres is recommended on Vercel:

CONVERSATION_STORE_BACKEND=postgres
DATABASE_URL=postgresql://user:pass@host:5432/dbname

Vercel Postgres, Neon, and Supabase all work. Add DATABASE_URL in the Vercel dashboard.

Health alerting

The health sweep endpoint is GET /api/cron/health-sweep. Trigger it from a Vercel Cron Job or an external cron.

In vercel.json:

{
  "crons": [
    {
      "path": "/api/cron/health-sweep",
      "schedule": "*/5 * * * *"
    }
  ]
}

HEALTH_ALERT_ENABLED=true
HEALTH_ALERT_WEBHOOK_URL=https://hooks.slack.com/services/...
HEALTH_ALERT_MIN_SEVERITY=warning
CRON_SECRET=a-random-secret

Branding

NEXT_PUBLIC_TITLE_SHORT=MyCluster
NEXT_PUBLIC_LOGO=/logo.png
NEXT_PUBLIC_MEASUREMENT_ID=G-XXXXXXXXXX
NEXT_PUBLIC_POSTHOG_KEY=phc_...

Verify

• Open the assigned Vercel URL — you should land on the overview page.
• To upgrade, push to main (or merge a PR) and Vercel auto-deploys. For environment variable changes, update them in the dashboard and trigger a redeploy (Deployments → Redeploy).

For breaking changes between major versions, see Migrating to v0.3.

Troubleshooting

Related