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
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
Fake Person Data Generator
person
Fake Email Address Generator
email
Fake Name Generator
fullName
Fake Company Data Generator
company
Fake Address Generator
address
UUID Generator
uuid
Fake Product Data Generator
product
Fake Credit Card Number Generator (Test)
creditCardFake
MockForge generates fully synthetic data — no real personal information, ever.