Rapid API Prototyping with Synthetic Data from MockHero

The Problem

You need to demo an API to a client, present a proof-of-concept to stakeholders, or build a frontend while the backend team is still designing the schema. In all these cases, you need realistic API responses now, but the real API does not exist yet. The usual workaround is to hardcode JSON files with three or four records, which looks unconvincing and does not test pagination, filtering, or error handling.

Mock servers like JSON Server or MSW solve the routing problem but not the data problem. You still need to create the data yourself, and hardcoded fixtures do not scale when you want to demonstrate search, sorting, or paginated lists with hundreds of results.

The Solution: MockHero as Your Prototype Data Layer

MockHero generates large, realistic datasets that you can use as mock API responses. Define your API's data shape as a MockHero schema, generate the data, and serve it through a simple static server or integrate it into your mock server. The result is an API prototype that looks and feels like a production system.

Quick Setup

curl -X POST https://api.mockhero.dev/api/v1/generate \
  -H "x-api-key: mh_your_api_key" \
  -H "Content-Type: application/json" \
  -d '{
  "tables": [
    {
      "name": "products",
      "count": 200,
      "fields": [
        { "name": "id", "type": "uuid" },
        { "name": "name", "type": "product_name" },
        { "name": "description", "type": "paragraphs" },
        { "name": "price", "type": "integer", "params": { "min": 499, "max": 29999 } },
        { "name": "category", "type": "enum", "params": { "values": ["electronics","clothing","home","sports","books"] } },
        { "name": "image_url", "type": "avatar_url" },
        { "name": "rating", "type": "integer", "params": { "min": 1, "max": 5 } },
        { "name": "in_stock", "type": "boolean" }
      ]
    },
    {
      "name": "reviews",
      "count": 800,
      "fields": [
        { "name": "id", "type": "uuid" },
        { "name": "product_id", "type": "ref", "params": { "ref": "products.id" } },
        { "name": "author", "type": "full_name" },
        { "name": "rating", "type": "integer", "params": { "min": 1, "max": 5 } },
        { "name": "comment", "type": "paragraphs" },
        { "name": "created_at", "type": "datetime" }
      ]
    }
  ],
  "format": "json"
}'

Step-by-Step Guide

1. Define your API shape

Start with the API endpoints you need to prototype. For each endpoint, map the response body to a MockHero table. If an endpoint returns nested data (products with reviews), use ref fields to link the tables.

2. Get your MockHero API key

Sign up at mockhero.dev/sign-up and copy your API key.

3. Generate the data and save locally

# Save to a JSON file for your mock server
curl -s -X POST https://api.mockhero.dev/api/v1/generate \
  -H "x-api-key: mh_your_api_key" \
  -H "Content-Type: application/json" \
  -d '{ ... }' > mock-data.json

4. Serve through a mock API

Use Express to create a quick mock API:

import express from "express";
import { readFileSync } from "fs";

const app = express();
const data = JSON.parse(readFileSync("./mock-data.json", "utf-8")).data;

app.get("/api/products", (req, res) => {
  const page = parseInt(req.query.page) || 1;
  const limit = parseInt(req.query.limit) || 20;
  const start = (page - 1) * limit;
  res.json({
    data: data.products.slice(start, start + limit),
    total: data.products.length,
    page,
    pages: Math.ceil(data.products.length / limit),
  });
});

app.get("/api/products/:id", (req, res) => {
  const product = data.products.find(p => p.id === req.params.id);
  if (!product) return res.status(404).json({ error: "Not found" });
  const reviews = data.reviews.filter(r => r.product_id === product.id);
  res.json({ ...product, reviews });
});

app.listen(3001, () => console.log("Mock API running on port 3001"));

5. Build your frontend against the mock API

Your frontend can now fetch paginated product lists, display product details with reviews, and handle empty states. When the real backend is ready, just swap the base URL. The data shapes are already correct.

Why MockHero vs Hardcoded Fixtures

• Volume — 200 products and 800 reviews make pagination, search, and filtering feel real. Five hardcoded records do not.
• Realistic content — product names, descriptions, and reviews look like real data, which makes demos and presentations convincing.
• Relational — reviews are properly linked to products. Your frontend can display review counts and average ratings correctly.
• Fast iteration — change the schema, regenerate, and your prototype has new data in seconds.

Get Started

Ship your API prototype in hours, not weeks. Sign up free at mockhero.dev and generate the realistic data your prototype deserves.