A simple query like this
[GET] https://customjsonbuilder.com/api/{name:string,email:email}
will respond with json like:
{
"name": "Alexa",
"email": "[email protected]"
}All the methods are supported in the same API: GET, POST, PUT, PATCH, DELETE
Example: https://customjsonbuilder.com/api/<THE PATTERN GOES HERE>
It is like writing regular json
{THE_KEY_THAT_I_WANT : THE_DATA_TYPE}
I want an object with a key name and a random word as value
{name: string}
The server will respond with data like
{
"name": "vm2sgdbmf2e7mmbc8502w8q"
}Now I need a json response with id, name and email
{id:number, name:string, email:email}
The server will respond with data like
{
"id": 49994,
"name": "Mission",
"email": "[email protected]"
}I want an object with a userId, a name and a nested object contact which contains phone and email.
The pattern should be:
{userId: number, name: firstname, contact: {phone: number, email: email}}
The server will respond with data like
{
"userId": 94781,
"name": "Maria",
"contact": {
"phone": 88885,
"email": "[email protected]"
}
}Lets try something more complex.
I want an object with userId, name, a nested object with contact that contains phone and email with nested content personal_email and company_email
{userId: number, name: firstname, contact: {phone: number, email: {personal_email: email, company_email: email}}}
(better visualization)
{
userId: number,
name: firstname,
contact: {
phone: number,
email: {
personal_email: email,
company_email: email
}
}
}
The server will respond with data like
{
"userId": 7316,
"name": "discrete",
"contact": {
"phone": 14357,
"email": {
"personal_email": "[email protected]",
"company_email": "[email protected]"
}
}
}I want 3 posts with id and title
To get an array response just add key _times:NUMBER, were number is the number of elements that i want in the array.
{posts: {id: number, title: string, _times: 3}}
And the server will respond with data like
{
"posts": [
{
"id": 65450,
"title": "vs4brxz5497yggxg80wvy"
},
{
"id": 11251,
"title": "v6tfhr591s3isajey067j3l"
},
{
"id": 89704,
"title": "vs3q84xh8nmdcp87w2c9ax8"
}
]
}post title
{
postTitle: title
}
will generate
{
"postTitle": "Rerum odio quam."
}user email
{
user_email: email
}
will generate
{
"user_email": "[email protected]"
}In the current version we support these data types:
- string
- number
- boolean
- null
- undefined
- empty (empty string "")
- true (always generate true)
- false (always generate false)
- name
- firstName
- lastName
- age (number between 1-99)
- age18 (number between 18-99)
- agekid (number between 1-18)
- username
- password
- uuid
- title
- text
- word
- words
- paragraph
- paragraphs
- date
Install via npm
npm install customjsonbuilder --save-dev
import customjsonbuilder from 'customjsonbuilder'
const pattern = `
{
posts: {
title: string,
_times: 3
}
}
`
const fakePosts = customjsonbuilder(pattern)
export function Posts() {
const [posts] = useState(fakePosts.posts)
return (
<div>
{posts.map((p) => (
<div>{p.title}</div>
))}
</div>
)
}// index.js
let customjsonbuilder = require('customjsonbuilder')
let fake = customjsonbuilder('{name:string}')
console.log(fake)
// run on terminal "node index.js"Create your own custom fake server and use customjsobuilder to generate fake data
let express = require('express')
let app = express()
let customjsonbuilder = require('customjsonbuilder')
app.get('/posts', (req, res) => {
let posts = `
{
posts: {
id: number,
title: string,
_times: 3
}
}
`
let response = customjsonbuilder(posts)
res.json(response)
})
app.listen('8200', '0.0.0.0')
console.log(`Running on http://0.0.0.0:8200`)Clone the project or download the zip file
Go to the folder
cd customjsonbuilder
Install dependencies
npm install
Launch the server
npm start
// or with a custom port
PORT=4545 npm start
It will prompt
Running on http://0.0.0.0:6500
Open the browser and visit the link http://0.0.0.0:6500
Now query some fake data from your React, Angular, Vue or any external project.
http://0.0.0.0:6500/{name:string,email:email}
- Basic
{
name: string
}
{
"name": "Ergonomic Concrete Pants"
}- User information
{
userId: number,
username: username,
name: firstname,
email: email
}
{
"userId": 89330,
"username": "Filomena_Bogisich",
"name": "port",
"email": "[email protected]"
}- User last 3 posts
{
data: {
user_id: number,
posts: {
post_id: number,
title: title,
post_resume: paragraph,
views_number: number,
comments_number: number,
_times: 3
}
}
}
{
"data": {
"user_id": 26027,
"posts": [
{
"post_id": 7375,
"title": "Velit enim et quod distinctio.",
"post_resume": "Quo dolores ...",
"views_number": 13545,
"comments_number": 20335
},
{
"post_id": 25141,
"title": "Consequatur ut illum nobis et.",
"post_resume": "Temporibus ut ...",
"views_number": 70492,
"comments_number": 80291
},
{
"post_id": 18477,
"title": "Debitis odio sunt laudantium aut eum aut laudantium.",
"post_resume": "Voluptatem culpa ut dol...",
"views_number": 23572,
"comments_number": 80794
}
]
}
}- Shopping card example
{
data: {
shopId: number,
finished: boolean,
catId: number,
clientId: number,
items: {
id: number,
name: word,
quantity: number,
_times:3
}
}
}
Will generate
{
"data": {
"shopId": 56079,
"finished": false,
"catId": 60197,
"clientId": 39134,
"items": [
{
"id": 94476,
"name": "facere",
"quantity": 85981
},
{
"id": 14435,
"name": "ut",
"quantity": 45225
},
{
"id": 52692,
"name": "rerum",
"quantity": 99475
}
]
}
}- true, false example
{
valid: true,
erros: false
}
Will generate
{
"valid": true,
"errors": false
}We are thinking and working on adding more data types like city, uuid, date, time and the capability to add default values to the json response.
Especial thanks to faker that is used behind the scenes to generate the fake data. Also thanks to the other opensource projects.
Feel free to collaborate with this project.
X: @rollrodrig Github: rollrodrig Youtube: RollTheCoder Instagram: rollthecoder Tiktok: @rollthecoder