A simple query like this
http://localhost:6500/{name:string,email:email}
will respond with json like:
{
"name": "Alexa",
"email": "Champlin@gmail.com"
}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.
export function Posts() {
const [posts, setPosts] = useState([])
useEffect(() => {
const pattern = `
{
posts: {
title: string,
_times: 3
}
}
`
axios.get(`http://0.0.0.0:6500/${pattern}`).then((res) => {
setPosts(res.data.posts)
})
}, [])
return (
<div>
{posts.map((p) => (
<div>{p.title}</div>
))}
</div>
)
}import cjb from 'customjsonbuilder'
const pattern = `
{
posts: {
title: string,
_times: 3
}
}
`
const fakePosts = cjb(pattern)
export function Posts() {
const [posts] = useState(fakePosts.posts)
return (
<div>
{posts.map((p) => (
<div>{p.title}</div>
))}
</div>
)
}Install via npm
npm install customjsonbuilder --save-dev
// 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`)Example: http://localhost:6500/<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": "Eula_Deckow@yahoo.com"
}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": "Eladio_Brown44@hotmail.com"
}
}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
}
}
}
The server will respond with data like
{
"userId": 7316,
"name": "discrete",
"contact": {
"phone": 14357,
"email": {
"personal_email": "Rowena_Homenick@yahoo.com",
"company_email": "Caesar52@hotmail.com"
}
}
}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"
}
]
}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
post title
{
postTitle: title
}
will generate
{
"postTitle": "Rerum odio quam."
}user email
{
user_email: email
}
will generate
{
"user_email": "Heber1@hotmail.com"
}- 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": "Valentin.Buckridge@hotmail.com"
}- 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
}Now it only works on localhost but we are working to launch a hosted app and create a public API.
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.
on twitter @rollrodrig