tutorial

How to Monitor Hoppscotch with Vigilmon (HTTP, SSL, and API Health Checks)

Hoppscotch is a popular open-source API client — a self-hosted Postman alternative your team can run on your own infrastructure. But running it yourself mean...

Hoppscotch is a popular open-source API client — a self-hosted Postman alternative your team can run on your own infrastructure. But running it yourself means you're responsible for keeping it available. If the Hoppscotch UI goes down or the backend API becomes unreachable, your developers are blocked from testing their own APIs.

This tutorial walks you through setting up external monitoring for a self-hosted Hoppscotch instance using Vigilmon — free tier, no credit card.


Why monitoring matters for self-hosted Hoppscotch

When you run Hoppscotch yourself, you own the availability SLA. Failures that affect your team include:

  • Frontend goes down — the React SPA is unresponsive or returns a blank page; developers can't load the tool
  • Backend API unreachable — the hoppscotch-backend service fails; collections sync and team features stop working
  • SSL certificate expires — browsers block HTTPS access entirely with an "insecure connection" warning
  • Database disconnection — the backend boots but can't reach Postgres, causing 500 errors on every authenticated action

External monitoring catches all of these from outside your network — the same vantage point your developers use.


What you'll need

  • A self-hosted Hoppscotch instance (frontend + backend + database)
  • A free Vigilmon account (sign up in under a minute)

Step 1: Verify your health endpoints

Hoppscotch backend exposes a health endpoint out of the box. Confirm it's reachable:

curl https://api.yourdomain.com/health
# Expected: {"status":"ok"} or similar 200 response

If you're running the all-in-one Docker Compose deployment, the frontend (port 3000) and backend (port 3170) are separate services. Check both:

# Frontend availability
curl -I https://hoppscotch.yourdomain.com
# Expect: HTTP 200

# Backend health
curl https://api.hoppscotch.yourdomain.com/health
# Expect: HTTP 200 with JSON body

If the backend returns a non-200 status or the frontend returns a blank page, resolve that before setting up monitoring — monitoring an already-broken service just gives you immediate alerts.


Step 2: Monitor the web UI availability

The frontend is what your developers interact with daily. An HTTP monitor ensures the page actually loads.

  1. Log in to vigilmon.online and go to Monitors → New Monitor
  2. Choose HTTP / HTTPS
  3. Set the URL to your Hoppscotch frontend: https://hoppscotch.yourdomain.com
  4. Check interval: 1 minute
  5. Expected status code: 200
  6. (Optional) Response body contains: Hoppscotch or any known string in your page title
  7. Save the monitor

This monitor fires if the frontend container crashes, nginx fails to proxy the request, or the static files fail to serve.


Step 3: Monitor the backend API service

The backend handles team workspaces, collection sync, and authentication. Set up a separate HTTP check targeting the health endpoint:

  1. Monitors → New Monitor → HTTP / HTTPS
  2. URL: https://api.hoppscotch.yourdomain.com/health
  3. Check interval: 1 minute
  4. Expected status code: 200
  5. Response body contains: ok
  6. Save the monitor

Keeping this separate from the frontend monitor means you can tell at a glance whether the problem is the UI layer or the API layer — which narrows your debugging time significantly.


Step 4: Add SSL certificate monitoring

An expired SSL certificate takes down Hoppscotch completely for all users — browsers refuse to load any HTTPS resource without a valid cert.

  1. Monitors → New Monitor → SSL Certificate
  2. Domain: hoppscotch.yourdomain.com
  3. Alert when certificate expires in fewer than: 14 days
  4. Save the monitor

Repeat for api.hoppscotch.yourdomain.com if it's a separate domain. With 14-day advance warning you have time to renew through Let's Encrypt or your CA before anything breaks.


Step 5: Configure alert channels

Dead monitors are useless — make sure someone gets paged when a check fails.

  1. Alert Channels → Add Channel
  2. Choose Slack, email, Discord, or webhook
  3. For Slack: paste your incoming webhook URL
  4. Assign the channel to all three monitors (frontend, backend API, SSL)

A concise Slack alert looks like:

[DOWN] Hoppscotch Backend API
https://api.hoppscotch.yourdomain.com/health
Status: 502 Bad Gateway
Down for: 3 minutes

Set up a 5-minute escalation window if you don't want paged on transient 30-second blips — Vigilmon waits for N consecutive failures before triggering an incident.


Step 6: Build a status page for your team

If you run Hoppscotch for a larger engineering org, a status page lets everyone self-serve answers instead of filing tickets.

  1. Status Pages → New Status Page
  2. Name it "Hoppscotch Status"
  3. Add monitors: Frontend, Backend API, SSL
  4. Publish

Post the URL in your team's #tools Slack channel or your internal developer portal. When something breaks, developers check the status page before pinging ops.


Monitoring summary

| Monitor | Type | What it catches | |---------|------|-----------------| | https://hoppscotch.yourdomain.com | HTTP | Frontend down, nginx failure, blank page | | https://api.hoppscotch.yourdomain.com/health | HTTP | Backend crash, DB disconnection, 5xx errors | | hoppscotch.yourdomain.com | SSL | Certificate expiry before browsers block it |


What's next

  • Heartbeat monitoring — if you run scheduled jobs that sync Hoppscotch data to other tools, heartbeat monitors alert you when those jobs stop running
  • Response time tracking — Vigilmon records response time history so you can spot backend performance degradation before it turns into downtime

Get started free at vigilmon.online — no credit card, your first monitors are live in under two minutes.

Monitor your app with Vigilmon

Free plan — 5 monitors, no credit card required. Up and running in 60 seconds.

Start free →