Mock Data for React Components

Generate realistic placeholder data for React lists, tables and cards — copy the array into your component or a fixture file.

Stop typing fake users by hand. Generate a realistic array below, paste it into a fixtures file, and map over it in your component. Avatars, names and emails all line up so your UI looks real in Storybook and demos.

Generate now

Get this data from the API
curl "https://mock.wrapper-agency.com/api/v1/mock?type=person&count=10&locale=en"

Free mock-data API — no key during beta, up to 100 records per call. Need bulk (up to 10,000)? Use the paid endpoint. Data is fully synthetic — no real PII.

Example output

A small sample of the JSON this generator returns (person):

[
  {
    "id": "0fd32248-6492-4457-8c38-90921ffc41a7",
    "firstName": "Tracy",
    "lastName": "Miller",
    "fullName": "Tracy Miller",
    "sex": "female",
    "email": "tracy.miller15@example.com",
    "username": "tracy_miller",
    "phone": "292.735.5197 x985",
    "birthDate": "2003-10-14",
    "jobTitle": "Senior Implementation Associate",
    "avatar": "https://avatars.githubusercontent.com/u/32533033",
    "address": {
      "street": "3832 Connelly Springs",
      "city": "Fort Olinberg",
      "state": "Alabama",
      "zipCode": "77703-1863",
      "country": "Azerbaijan"
    }
  },
  {
    "id": "c786010a-58e3-46c3-8142-ecadc2e8ce51",
    "firstName": "Gail",
    "lastName": "Nienow",
    "fullName": "Gail Nienow",
    "sex": "female",
    "email": "gail_nienow47@example.com",
    "username": "gail_nienow",
    "phone": "1-880-642-1393 x573",
    "birthDate": "2006-12-05",
    "jobTitle": "Principal Functionality Analyst",
    "avatar": "https://avatars.githubusercontent.com/u/30087831",
    "address": {
      "street": "16502 E Center Street",
      "city": "South Winonaburgh",
      "state": "North Dakota",
      "zipCode": "27366-5083",
      "country": "Christmas Island"
    }
  },
  {
    "id": "e251ee4a-d883-41ee-8a55-beeca12e901a",
    "firstName": "Lorena",
    "lastName": "Armstrong",
    "fullName": "Lorena Armstrong",
    "sex": "female",
    "email": "lorena_armstrong@example.com",
    "username": "lorena.armstrong69",
    "phone": "1-666-372-3768",
    "birthDate": "1987-02-19",
    "jobTitle": "Global Security Coordinator",
    "avatar": "https://avatars.githubusercontent.com/u/26520237",
    "address": {
      "street": "93867 Mayer Locks",
      "city": "Lake Dylantown",
      "state": "North Carolina",
      "zipCode": "99930",
      "country": "Uganda"
    }
  }
]

Use it in code

Fetch the same data from the free API — no key needed during beta, up to 100 records per call:

curl "https://mock.wrapper-agency.com/api/v1/mock?type=person&count=10"

Need thousands of rows at once? The bulk API returns up to 10,000 records per call.

FAQ

Is the mock data for react components data real?
No. Every value is synthetic, generated with @faker-js/faker. There is no real personal data, so it is safe for testing, demos and committing to a repo (GDPR-friendly).
How do I get this data in my code?
Call the free API: GET https://mock.wrapper-agency.com/api/v1/mock?type=person&count=10. It returns a JSON array of records. Use ?seed=123 for deterministic output.
How many records can I generate?
Up to 100 per call for free, or up to 10,000 per call via the paid bulk API for agents and CI pipelines.

Other generators

MockForge generates fully synthetic data — no real personal information, ever.