SaaS · React
Error monitoring
Dark developer-focused site for an error tracking tool with a live issues mock, SDK steps and pricing.

What you get
A dark, developer-first product site for an error monitoring service: an issues feed mock, stats, features, a release-tracking split, three setup steps, usage-based monthly pricing, quotes and an FAQ. All content lives in src/site.ts.
Files
Exactly what is copied into a new project: 13 files, nothing generated.
Explorer 13
import type { Site } from "./types"; /** Everything this site shows. Edit freely. */export const site: Site = { "brand": "Faultline", "nav": [ { "label": "Features", "href": "#features" }, { "label": "Setup", "href": "#setup" }, { "label": "Pricing", "href": "#pricing" }, { "label": "FAQ", "href": "#faq" } ], "navCta": { "label": "Get an API key", "href": "#start" }, "sections": [ { "kind": "hero", "variant": "center", "eyebrow": "Error monitoring for small engineering teams", "title": "Know what broke, for whom, and which deploy did it.", "text": "Faultline groups exceptions into issues, attaches the stack trace and the request that caused it, and pings the person who last touched the code.", "primary": { "label": "Start sending errors", "href": "#setup" }, "secondary": { "label": "See pricing", "href": "#pricing" }, "visual": { "type": "mock", "title": "checkout-api · production · last 24h", "rows": [ { "label": "TypeError: cannot read 'total' of undefined cart.ts:88", "value": "1,204 events", "tone": "#f87171" }, { "label": "TimeoutError: payments upstream exceeded 10s", "value": "312 events", "tone": "#fbbf24" }, { "label": "ValidationError: postcode format address.ts:41", "value": "96 events", "tone": "#fbbf24" }, { "label": "Regression in v2.14.0: 404 on /api/orders/:id", "value": "41 events", "tone": "#f87171" }, { "label": "Resolved in v2.14.1: null session on refresh", "value": "0 since deploy", "tone": "#a3e635" } ], "footer": "Assigned to @ana by code ownership · alert sent to #oncall" }, "note": "5,000 events a month free. SDKs for JavaScript, Python, Go, Ruby and PHP." }, { "kind": "stats", "items": [ { "value": "< 1 min", "label": "From exception to alert" }, { "value": "5", "label": "Official SDKs" }, { "value": "90 days", "label": "Event retention on Team" }, { "value": "1 line", "label": "To initialise most SDKs" } ] }, { "kind": "features", "id": "features", "eyebrow": "Features", "title": "Less noise, more context", "columns": 3, "items": [ { "title": "Smart grouping", "text": "Fingerprints by stack frame, not message text, so one bug is one issue.", "icon": "box" }, { "title": "Source maps and symbols", "text": "Upload at build time and read minified traces as your original code.", "icon": "code" }, { "title": "Breadcrumbs", "text": "See the clicks, requests and logs that led up to the crash.", "icon": "arrow" }, { "title": "Alert rules", "text": "Alert on new issues, regressions or spikes, to Slack, email or a webhook.", "icon": "bolt" }, { "title": "Data scrubbing", "text": "Passwords, tokens and card numbers are stripped in the SDK before anything is sent.", "icon": "shield" }, { "title": "Performance traces", "text": "Slow endpoints and database queries sit next to the errors they cause.", "icon": "chart" } ] }, { "kind": "split", "eyebrow": "Releases", "title": "Tie every error to a deploy", "text": "Tag releases from CI and Faultline marks which issues are new, which came back, and which a deploy fixed.", "bullets": [ "Suspect commits from your Git history", "Auto-resolve when a fix ships", "Release health by crash-free sessions" ], "visual": { "type": "mock", "title": "Release v2.14.1", "rows": [ { "label": "New issues", "value": "0", "tone": "#a3e635" }, { "label": "Regressions", "value": "1", "tone": "#fbbf24" }, { "label": "Resolved by this release", "value": "4", "tone": "#a3e635" }, { "label": "Crash-free sessions", "value": "99.82%", "tone": "#a3e635" } ] }, "reverse": true }, { "kind": "steps", "id": "setup", "eyebrow": "Setup", "title": "Three steps, one deploy", "items": [ { "title": "Install the SDK", "text": "npm install @faultline/node, or the package for your language." }, { "title": "Initialise with your key", "text": "Faultline.init({ dsn }) at startup. Unhandled errors are captured from then on." }, { "title": "Upload source maps in CI", "text": "Add one step to your build so traces point at real files and lines." } ] }, { "kind": "pricing", "id": "pricing", "eyebrow": "Pricing", "title": "Priced by events, not seats", "text": "Every plan includes unlimited team members. Monthly billing; spike protection on by default.", "plans": [ { "name": "Hobby", "price": "$0", "period": "/month", "text": "Side projects and evaluation.", "features": [ "5,000 events / month", "7-day retention", "Email alerts" ], "cta": { "label": "Start free", "href": "#start" } }, { "name": "Team", "price": "$29", "period": "/month", "text": "Production apps with a small team.", "features": [ "100,000 events / month", "90-day retention", "Slack and webhook alerts", "Release tracking" ], "featured": true, "cta": { "label": "Start a 14-day trial", "href": "#start" } }, { "name": "Business", "price": "$99", "period": "/month", "text": "Several services and on-call rotations.", "features": [ "500,000 events / month", "Performance traces", "SAML single sign-on", "Audit log" ], "cta": { "label": "Choose Business", "href": "#start" } } ] }, { "kind": "quotes", "eyebrow": "From engineers", "title": "Quieter on-call weeks", "items": [ { "quote": "We went from 400 alerts a day to about a dozen real issues once grouping kicked in.", "name": "Priyanka S.", "role": "Backend lead" }, { "quote": "Suspect commits means the right person sees the bug before standup.", "name": "Dmitri L.", "role": "Engineering manager" }, { "quote": "Setup was literally two lines and a CI step. I expected an afternoon.", "name": "Grace T.", "role": "Solo founder" } ] }, { "kind": "faq", "id": "faq", "eyebrow": "FAQ", "title": "Before you install", "items": [ { "q": "What happens if I go over my event quota?", "a": "Extra events are rate-limited, not billed, unless you turn on pay-as-you-go. You get an email at 80%." }, { "q": "Where is event data stored?", "a": "Choose a US or EU region when you create a project. Data stays in that region." }, { "q": "Can I keep personal data out?", "a": "Yes. The SDKs scrub common sensitive fields by default and you can add your own rules." }, { "q": "Is there a self-hosted version?", "a": "Not today. Export via the API if you need a copy of your data." } ] }, { "kind": "cta", "id": "start", "title": "Catch the next bug before a customer reports it", "text": "Create a project, copy your key, and send a test error in under five minutes.", "primary": { "label": "Follow the setup", "href": "#setup" }, "secondary": { "label": "Compare plans", "href": "#pricing" } } ], "footer": { "text": "Error monitoring and release health for small engineering teams.", "columns": [ { "title": "Product", "links": [ "Issues", "Releases", "Performance" ] }, { "title": "Developers", "links": [ "Docs", "SDKs", "API", "Status" ] } ], "legal": "© Faultline. Sample content: replace it in src/site.ts." }};Remix
Remix this template
Describe what to change and the agent starts from Error monitoring's files. The box is already started for you: finish “Start from Error monitoring and …”
Dependencies
Documented from the template's package.json. The runtime has a prebuilt dependency set for Vite + React + TypeScript, so installs are fast.
- react^19.1.0
- react-dom^19.1.0
- vite^6.3.0
- @vitejs/plugin-react^4.4.0
- tailwindcss^4.1.0
- @tailwindcss/vite^4.1.0
- typescript^5.8.0
How it runs
- Framework
- Vite + React + TypeScript
- Dev command
- npm run dev
- Build command
- npm run build
- Output directory
- dist
- Port
- 5173
- Entry route
- /
Projects run in an isolated sandbox with a live preview. Read the projects documentation for settings, snapshots and deployment.
Keep browsing
All templates
Product analytics
Crisp site for a product analytics tool with a funnel mock, retention features, event pricing and FAQ.
- Featured

SaaS starter
Marketing pages, sign-in and sign-up screens, and an authenticated app area with a mocked session you replace with real auth.

Appointment scheduling
Marketing site for a booking-link tool with a live calendar mock, pricing, setup steps and an FAQ.
Build on Error monitoring
Create a free account, start from this template, and ask the AI agent to turn it into your app.