Mock Bolt

Posted on Apr 20

Stop setting up json-server for every prototype. There's a faster way.

#webdev #javascript #testing #devtools

You're building a frontend. The backend isn't ready. You need one endpoint that returns a list of users.

So you do what you always do:

npm install -g json-server
mkdir mock-server && cd mock-server
touch db.json

Then you write the JSON, configure the routes, figure out why CORS is blocking your React app, fix it, run the server — and 15 minutes later you finally have a GET /users endpoint returning fake data.

For something you'll throw away tomorrow.

I've done this probably 200 times. Every single time I think: there has to be a faster way.

What I actually tried first

Postman mock servers — require an account, a workspace, a collection. Too much setup for a throwaway endpoint.

Beeceptor — requires signup. Gets in the way.

Mockoon — great tool, but runs locally. Useless when you want to share the endpoint with a teammate or test from a mobile device.

RequestBin — receives requests, doesn't respond with data.

A quick Express server — still requires Node, a file, and remembering to kill the process later.

None of these solve the actual problem: I want to paste JSON and get a URL. Right now. From any machine. Without installing anything.

What I built

I spent a weekend building MockBolt — paste JSON, get a live API endpoint instantly.

No account. No install. No CLI. No local server.

Here's the full flow:

Go to mockbolt.com
Paste your JSON response
Pick which HTTP methods it should accept
Optionally set a custom status code, response delay, or custom headers
Click Generate

You get a URL like https://mockbolt.com/b/abc123. That's your live API. Takes about 10 seconds.

Using it from a React app

useEffect(() => {
  fetch('https://mockbolt.com/b/abc123')
    .then(res => res.json())
    .then(data => setUsers(data.users));
}, []);

No proxy config. No CORS headers to set. Access-Control-Allow-Origin: * is open by default.

Things I use it for constantly

Testing error handling

Set the status code to 500 or 503, point your app at it, verify your error boundary actually works.

fetch('https://mockbolt.com/b/your-endpoint')
  .then(res => {
    if (!res.ok) throw new Error(`Server error: ${res.status}`);
    return res.json();
  })
  .catch(err => console.error('Caught:', err));

Frontend before backend is ready

Share the mock URL with your team. Everyone points at the same endpoint. When the real API is ready — swap one URL.

Demoing to clients

Spin up a mock with realistic data, build the UI on top of it, demo without any backend running. Works from their browser, their phone, anywhere.

Workshops and tutorials

I've run internal workshops where I needed everyone to hit the same API instantly. Creating a mock took 10 seconds. No one installed anything.

Testing Postman collections

Point a collection at a mock endpoint to verify request structure and headers before the real endpoint exists.

Simulating a slow API

Set response delay to 2000ms and your mock simulates a slow server:

// Your loading skeleton should show for 2 seconds
// Your timeout logic should kick in at the right time
// This exercises real fetch lifecycle — not a fake setTimeout
fetch('https://mockbolt.com/b/your-slow-endpoint')

Way more realistic than wrapping mock data in setTimeout inside your component. It exercises actual fetch lifecycle including cancellation and AbortController behavior.

Competitor comparison

Feature	MockBolt	Beeceptor	Mockoon	json-server
No signup	✅	❌	✅	✅
No install	✅	✅	❌	❌
Live in < 10s	✅	❌	❌	❌
Open CORS	✅	✅	✅	❌
Response delay	✅	✅	✅	❌
Custom headers	✅	✅	✅	❌
Shareable URL	✅	✅	❌	❌

Tech stack

Backend: FastAPI + PostgreSQL, async SQLAlchemy
Frontend: React 18, TypeScript, Tailwind CSS, Vite
Hosting: AWS Lightsail behind Cloudflare
Payments: Lemon Squeezy (HMAC-signed webhooks)

The webhook validation was the most interesting part to build — mode-aware HMAC secrets, idempotent payment recording, atomic upgrade transactions. Worth a separate post if anyone's interested.

What's missing (honest)

No request logging — you can't see incoming requests to your mock
No conditional responses — always returns the same JSON
No sequences — can't return different data on 1st/2nd/3rd call
No webhooks — can't have the mock call your server back

These are on the roadmap. For most prototyping use cases, a static JSON response is all you need.

Try it: mockbolt.com
No signup. Takes 10 seconds. Let it expire or delete it when you're done.

Happy to answer questions in the comments — especially if you have use cases I haven't thought of.

DEV Community