How to Monitor Your Typebot Instance with Vigilmon

Typebot is an open-source chatbot builder that lets you create conversational forms and embed them in any website. When you self-host Typebot, you get full control over your data — but you also take responsibility for uptime. A down viewer means broken chat widgets on your production site; a down builder means your team can't make changes. Vigilmon keeps watch over every layer of your Typebot deployment so you know about problems before your users do.

What You'll Monitor

• The Typebot /api/health endpoint (backend health gate)
• The viewer web UI (public-facing chat interface)
• The builder web UI (internal admin interface)
• SSL certificate expiry on both domains

Prerequisites

• A self-hosted Typebot instance (Docker Compose or standalone)
• A free Vigilmon account
• Your Typebot viewer URL (e.g. https://chat.yourdomain.com) and builder URL (e.g. https://builder.yourdomain.com)

Why Monitor Typebot?

Typebot runs as two separate Next.js apps — the viewer (public) and the builder (admin) — backed by a Node.js API server and a PostgreSQL database. Any of these can fail independently:

• The API crashes but the viewer serves cached pages for a few minutes
• The database is down so new submissions silently fail
• An nginx misconfiguration takes down one app but not the other
• An expired SSL certificate breaks all embedded chat widgets

External monitoring from Vigilmon catches every one of these from the outside in, exactly the way your users experience them.

Step 1: Monitor the Health Endpoint

Typebot exposes /api/health on the builder app. This endpoint confirms the API layer and database connection are working.

1. Log in to vigilmon.online and click Add Monitor.
2. Set Type to HTTP / HTTPS.
3. Enter the URL: https://builder.yourdomain.com/api/health
4. Set Check interval to 1 minute.
5. Set Expected status code to 200.
6. Under Expected body contains, enter "status":"ok" — Typebot's health response includes this field when everything is healthy.
7. Name the monitor Typebot – API health and click Save.

A healthy response looks like:

{
  "status": "ok",
  "database": "connected"
}

If the database disconnects, Typebot returns a non-200 status and Vigilmon fires an alert immediately.

Step 2: Monitor the Viewer UI

The viewer serves your public chat widgets. Even if the API is healthy, a broken viewer means broken embeds on every website that uses your bots.

1. Click Add Monitor again.
2. Set Type to HTTP / HTTPS.
3. Enter: https://chat.yourdomain.com
4. Set Expected status code to 200.
5. Set Expected body contains to Typebot — the default page title will contain this, confirming the Next.js app is rendering.
6. Name it Typebot – Viewer UI and save.

Step 3: Monitor the Builder UI

The builder is your team's workspace. Monitoring it separately means you'll know if the admin interface goes down even when the public viewer is still serving cached content.

1. Click Add Monitor.
2. Set Type to HTTP / HTTPS.
3. Enter: https://builder.yourdomain.com
4. Set Expected status code to 200.
5. Name it Typebot – Builder UI and save.

Set the alert sensitivity for the builder to 2 consecutive failures (the Vigilmon default) — this avoids false pages during routine Next.js cold starts.

Step 4: SSL Certificate Alerts

An expired SSL certificate breaks all embedded Typebot widgets silently — browsers refuse the connection and the chat just doesn't appear. Vigilmon can alert you weeks before a certificate expires.

1. Open each monitor you created (Viewer and Builder).
2. Under SSL Certificate, enable Alert before expiry.
3. Set warnings at 30 days and 7 days before expiry.
4. Save.

With Let's Encrypt auto-renewal, certificates rarely expire — but auto-renewal fails when your nginx config changes, your ACME challenge endpoint is blocked, or your server restarts at the wrong time. Getting a 30-day warning gives you plenty of time to fix it manually.

Step 5: Configure Alert Channels

1. In Vigilmon, go to Alert Channels → Add Channel.
2. Choose Email, Slack webhook, or PagerDuty depending on your team's workflow.
3. For Slack: paste your incoming webhook URL and use a payload like:

{
  "text": "🚨 *{{monitor_name}}* is {{status}}!\nURL: {{url}}\nTime: {{timestamp}}"
}

4. Attach the channel to all three Typebot monitors.

Step 6: Test the Setup

Simulate a failure to verify the full alert pipeline:

1. Temporarily change the Expected body contains on the health monitor to something that won't match (e.g. vigilmon-test-string).
2. Wait one check interval — you should receive an alert within 2 minutes.
3. Revert the setting and confirm the recovery notification arrives.

Going Further

• Response time thresholds: Typebot's Next.js apps can slow under load before they fully fail. Set a Warn threshold at 1500ms and Critical at 4000ms on the viewer monitor to catch degradation early.
• Bot submission webhook: If you use Typebot webhooks to forward submissions to another service, add a Vigilmon monitor on that downstream endpoint too — a broken webhook means lost leads.
• Status page: Expose a Vigilmon public status page to your team so they can self-serve status checks during incidents instead of pinging on-call.

Your Typebot instance is now fully covered: API health, both web interfaces, and SSL certificates — with instant alerts the moment anything breaks.