Customized frontend testing APIs with realistic data
Mock API endpoints effortlessly with fully customizable data structures for frontend testing and development — all served by Vite, no backend needed.
Everything you need to get up and running
Simple Configuration
Get your first mock API up and running with just a few lines of code.
Realistic Data
Uses Faker.js to generate example names, addresses, images, and more that looks like real data.
Custom Endpoints
Define your own API endpoints and response structures with simple configuration.
Pagination
Your data is paginated by default. Easily configure default page size and total count, or override with each request.
Fast Development
Develop your frontend request logic without waiting for backend APIs to be ready.
Open Source
Fully open source and free to use in any project under the MIT license.
Get Started
Get up and running in minutes. See the full documentation for more configuration options and advanced usage.
1. Installation
1npm install vite-plugin-fakery @faker-js/faker --save-dev
2. Configuration
Add the plugin to your Vite config:
1// vite.config.js
2import { defineConfig } from 'vite'
3import vitePluginFakery from 'vite-plugin-fakery'
4
5export default defineConfig({
6 // … other Vite options
7 plugins: [
8 vitePluginFakery({
9 endpoints: [
10 {
11 url: '/api/users',
12 responseProps: {
13 first_name: 'person.firstName',
14 last_name: 'person.lastName',
15 },
16 },
17 ],
18 }),
19 ],
20})
3. Make Requests
Fire up the Vite dev process and fetch from your new mock API:
1// In your frontend code
2fetch('/api/users')
3 .then(response => response.json())
4 .then(users => {
5 console.log(users);
6 // {
7 // "total": 100,
8 // "per_page": 10,
9 // "data": [
10 // { id: 1, first_name: "John", last_name: "Doe" },
11 // { id: 2, first_name: "Jane", last_name: "Smith" }
12 // ]
13 // }
14 });