Mock API Studio

I built the first version of this because I was tired of frontend work getting blocked on a backend endpoint that didn't exist yet — you either stub it with a hand-written JSON file that goes stale, or you wait. Mock API Studio generates realistic fake datasets with a real CRUD surface on top, entirely in your browser, so you can build against something that behaves like a REST API before the real one is ready.

How it works

The core design decision is that everything is seeded, not random. When you pick a dataset (say, "users") and a seed value, the generator produces the exact same rows every time for that seed — same names, same emails, same IDs. This matters more than it sounds: if your test suite asserts against specific field values, or your frontend snapshot tests compare rendered output, random mock data breaks them on every run for no reason. Change the seed and you get a different but equally consistent dataset. Underneath, requests to the generated endpoints go through an in-memory router that actually implements filtering, sorting, pagination, and nested relations — hitting /api/mock/users?country=Germany&sort=-createdAt really filters and sorts the generated rows rather than returning a canned response.

A real example

Say you're building a product listing page and the real backend won't have pagination and price filtering ready for two more weeks. Pick the "products" dataset, set a seed, and you immediately have a working endpoint at /api/mock/products?page=2&limit=20&price_gt=50 that returns real pagination metadata and actually respects the price filter — not a static JSON file you'd have to hand-edit every time you need a different scenario. Build the whole UI against it, and when the real backend ships, you're swapping a base URL, not rewriting logic that only worked against fake static data.

Common mistakes

• Confusing Simulate mode with Live endpoint mode. Simulate runs entirely client-side with zero network calls — good for offline work, but only visible in your own browser tab. Live endpoint mode hits a real hosted URL at forgeplug.com/api/mock/... with CORS enabled, which is what you actually need if you're calling it from a separate app or a teammate needs to hit the same data. Using Simulate mode when you actually needed a real network-reachable URL is the most common confusion I see.
• Expecting imported CSV/JSON data to behave exactly like the built-in datasets. Field-type detection on imported data is automatic but not perfect — a column of numeric-looking strings can get inferred as numbers when you needed strings (or vice versa). Check the inferred schema before building filters against it.
• Assuming realtime (WebSocket/SSE) events fire on a fixed schedule matching your production system. The Realtime tab streams synthetic create/update/delete events at an interval you control — it's for testing that your client-side event handling works, not for simulating your actual backend's real event cadence.