Skip to main content
CodeLint.Dev Dev Tools

API Status Page Generator

Produce a self-contained status page from a list of endpoints — a single HTML file you can host anywhere static, with no backend and no subscription.

Checking services…

Services

2 endpoints
  • GitHub API

    https://api.github.com

    Pending
  • My Website

    https://codelint.dev

    Pending

Add endpoint

Page Settings

Customize the generated status page

Theme

Export Status Page

Download a standalone HTML file — host it anywhere

Zero dependencies — single HTML file, works offline

Auto-checks each endpoint on load and every 60s

CORS note — browsers restrict cross-origin reads; the page detects reachability via connection success/failure

Generated HTML Preview

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>API Status</title>
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#f8fafc;color:#1e293b;min-height:100vh}
.wrap{max-width:720px;margin:0 auto;padding:3rem 1.5rem}
header{text-align:center;margin-bottom:2.5rem}
header h1{font-size:1.875rem;font-weight:700;margin-bottom:.375rem}
header p{color:#64748b}
.banner{border-radius:.75rem;padding:1rem 1.25…

What you get

The generator emits one HTML file with the CSS and JavaScript inlined. Drop it on any static host — GitHub Pages, Cloudflare Pages, S3, a folder on an existing server — and it works. There is no build step, no runtime dependency and nothing to keep patched.

Checks run in the visitor's browser against the endpoints you list. That is the design's strength and its limitation, and it is worth being clear about both.

The strength: no infrastructure. No monitoring service, no cron job, no database, no monthly bill. For a side project or an internal tool, that is often exactly the right trade.

The limitation: a browser-side check reports whether that visitor can currently reach the endpoint. It cannot distinguish your service being down from the visitor's network being broken, it keeps no history, and it will not notify anyone. For anything with a real availability commitment you need server-side monitoring from multiple regions.

The problems you will hit, and how to handle them

Every endpoint shows as down, but they work in a browser tab

Cause:CORS. A page on your status domain making a fetch to api.example.com is a cross-origin request; without permissive CORS headers on the response, the browser blocks it and the fetch rejects — indistinguishable from the service being unreachable.

Fix:Add a dedicated health endpoint that returns Access-Control-Allow-Origin for your status page origin. A minimal /healthz returning 200 with that header is enough, and is safer than opening CORS on the real API.

A check reports up while the service is broken

Cause:The endpoint returns 200 for the HTTP request but the service behind it is failing — a database connection is down, a queue is backed up, a dependency is timing out.

Fix:Make the health endpoint actually exercise its dependencies and return a non-2xx status when any of them fail. A health check that only proves the web server is running proves very little.

Checks fail intermittently for some visitors only

Cause:Corporate proxies, ad blockers and privacy extensions frequently block cross-origin requests to unfamiliar hosts, and mobile networks time out more aggressively.

Fix:Set a generous timeout, retry once before marking a service down, and state on the page that results reflect the visitor’s own connection.

The health endpoint becomes an attack surface

Cause:A public endpoint that queries the database on every request is trivially abusable as an amplification vector, and verbose health output can disclose internal hostnames and versions.

Fix:Cache the health result for 10–30 seconds server-side, rate-limit the endpoint, and return only an overall status publicly. Keep detailed component output on an authenticated path.

What makes a status page useful

Mostly a communication problem rather than a technical one. The things that matter to someone who arrives during an incident:

  • Host it somewhere independentA status page on the same infrastructure as the service goes down with it, precisely when it is needed. Use a different provider, and a different domain if you can.
  • Say what is affected, not just that something is"Degraded" tells a user nothing actionable. "Uploads are failing; the API and dashboard are unaffected" tells them whether to keep working.
  • Timestamp everything, in a stated timezoneRelative times ("20 minutes ago") go stale on a cached page. Absolute times with a zone do not.
  • Post updates even when there is no newsA note every 30 minutes saying the team is still investigating prevents the support queue filling with people asking whether you know.
  • Publish a short post-mortemWhat broke, what the impact was, what changes prevent a repeat. This is the part that rebuilds trust after an outage, and the part most often skipped.

About

The API Status Page Generator lets you define your API and service endpoints, verify their reachability directly in the browser, and export a polished, zero-dependency HTML status page you can host anywhere — on GitHub Pages, S3, Netlify, or any static host. The generated page auto-refreshes at a configurable interval and shows each service as Operational, Degraded, or Down based on connection latency. You can customise the page title, subtitle, colour theme (light or dark), and the auto-refresh interval before exporting. Note on browser CORS: browsers restrict cross-origin reads for security, so the live checker uses fetch with mode: no-cors. This lets it reliably detect whether a server is reachable (connection succeeds or fails) but cannot read the HTTP status code. For full status-code monitoring, run the generated HTML page on a server with a backend proxy or use a dedicated monitoring service.

How to use

  1. 1 Add your service endpoints by entering a name and URL in the "Add endpoint" form and pressing Add.
  2. 2 Click "Check Now" to run a live reachability check on all endpoints from your browser.
  3. 3 Adjust page settings — title, subtitle, theme (light/dark), and auto-refresh interval — to customise the exported page.
  4. 4 Click "Download HTML" to save a standalone status page file, or "Copy HTML" to paste it into your hosting pipeline.
  5. 5 Host the downloaded file anywhere static — GitHub Pages, Netlify, S3, or your own server.
What is an API status page?
An API status page is a public-facing page that shows whether your services, APIs, and infrastructure are operational, degraded, or down. It gives users and customers real-time visibility into outages and incidents, reducing support load and building trust. Examples include statuspage.io, Atlassian Status, and GitHub's status page.
Why does the live check show "Operational" even when my API is down?
Browsers enforce CORS (Cross-Origin Resource Sharing) policies that prevent reading response bodies from cross-origin requests. The tool uses mode: no-cors to bypass this restriction, meaning it can detect whether a connection succeeds but cannot read the HTTP status code. If the connection succeeds quickly the service is marked Operational. For accurate HTTP status monitoring, deploy the HTML page with a backend proxy or use a server-side monitoring solution.
Where can I host the downloaded status page?
The exported HTML file is completely self-contained — no server-side code, no npm packages, no build step. You can host it on GitHub Pages, Netlify, Vercel, Cloudflare Pages, AWS S3 + CloudFront, or any static web host. Simply upload the file and share the URL with your users.
How often does the generated page check endpoint status?
The generated page checks all endpoints on load and then repeats at the interval you select in Page Settings (30 seconds, 1 minute, 2 minutes, or 5 minutes). You can change the interval before exporting. The current status is shown alongside a "Last checked" timestamp so visitors know how fresh the data is.
Is this tool free and private?
Yes — completely free and entirely client-side. No account required. The live status checks are made from your browser directly to the target URLs; no data passes through our servers. The generated HTML file is built in your browser and downloaded directly to your machine.