Get a full fake REST API with zero coding in less than 30 seconds (seriously)
Created with <3 for front-end developers who need a quick back-end for prototyping and mocking.
- Egghead.io free video tutorial - Creating demo APIs with json-server
- JSONPlaceholder - Live running version
See also hotel 🏨, local .dev domains for everyone and more!
Example
Create a db.json file
{
"posts": [
{ "id": 1, "title": "json-server", "author": "typicode" }
],
"comments": [
{ "id": 1, "body": "some comment", "postId": 1 }
],
"profile": { "name": "typicode" }
}Start JSON Server
$ json-server --watch db.json
Now if you go to http://localhost:3000/posts/1, you'll get
{ "id": 1, "title": "json-server", "author": "typicode" }Also when doing requests, its good to know that
- If you make POST, PUT, PATCH or DELETE requests, changes will be automatically and safely saved to
db.jsonusing lowdb. - Your request body JSON should be object enclosed, just like the GET output. (for example
{"name": "Foobar"}) - Id values are not mutable. Any
idvalue in the body of your PUT or PATCH request wil be ignored. Only a value set in a POST request wil be respected, but only if not already taken. - A POST, PUT or PATCH request should include a
Content-Type: application/jsonheader to use the JSON in the request body. Otherwise it wil result in a 200 OK but without changes being made to the data.
Install
$ npm install -g json-server
Routes
Based on the previous db.json file, here are all the default routes. You can also add other routes using --routes.
Plural routes
GET /posts
GET /posts/1
POST /posts
PUT /posts/1
PATCH /posts/1
DELETE /posts/1
Singular routes
GET /profile
POST /profile
PUT /profile
PATCH /profile
Filter
Use . to access deep properties
GET /posts?title=json-server&author=typicode
GET /posts?id=1&id=2
GET /comments?author.name=typicode
Slice
Add _start and _end or _limit (an X-Total-Count header is included in the response)
GET /posts?_start=20&_end=30
GET /posts/1/comments?_start=20&_end=30
GET /posts/1/comments?_start=20&_limit=10
Sort
Add _sort and _order (ascending order by default)
GET /posts?_sort=views&_order=DESC
GET /posts/1/comments?_sort=votes&_order=ASC
Operators
Add _gte or _lte for getting a range
GET /posts?views_gte=10&views_lte=20
Add _ne to exclude a value
Add _like to filter using RegExp
GET /posts?title_like=server
Full-text search
Add q
Relationships
To include children resources, add _embed
GET /posts?_embed=comments
GET /posts/1?_embed=comments
To include parent resource, add _expand
GET /comments?_expand=post
GET /comments/1?_expand=post
To get or create nested resources (by default one level, add routes for more)
GET /posts/1/comments
POST /posts/1/comments
Database
Homepage
Returns default index file or serves ./public directory
Extras
Static file server
You can use JSON Server to serve your HTML, JS and CSS, simply create a ./public directory
or use --static.
mkdir public echo 'hello word' > public/index.html json-server db.json
json-server db.json --static ./static
Alternative port
You can start JSON Server on other ports with the --port flag:
$ json-server --watch db.json --port 3004
Access from anywhere
You can access your fake API from anywhere using CORS and JSONP.
Remote schema
You can load remote schemas.
$ json-server http://example.com/file.json $ json-server http://jsonplaceholder.typicode.com/db
Generate random data
Using JS instead of a JSON file, you can create data programmatically.
// index.js module.exports = function() { var data = { users: [] } // Create 1000 users for (var i = 0; i < 1000; i++) { data.users.push({ id: i, name: 'user' + i }) } return data }
Tip use modules like faker, casual or chance.
Add routes
Create a routes.json file.
{
"/api/": "/",
"/blog/:resource/:id/show": "/:resource/:id"
}Start JSON Server with --routes option.
json-server db.json --routes routes.json
Now you can access resources using additional routes.
/api/posts /api/posts/1 /blog/posts/1/show
CLI usage
json-server [options] <source>
Options:
--config, -c Path to config file [default: "json-server.json"]
--port, -p Set port [default: 3000]
--host, -H Set host [default: "0.0.0.0"]
--watch, -w Watch file(s) [boolean]
--routes, -r Path to routes file
--static, -s Set static files directory
--read-only, --ro Allow only GET requests [boolean]
--no-cors, --nc Disable Cross-Origin Resource Sharing [boolean]
--snapshots, -S Set snapshots directory [default: "."]
--delay, -d Add delay to responses (ms)
--id, -i Set database id property (e.g. _id) [default: "id"]
--quiet, -q Suppress log messages from output [boolean]
--help, -h Show help [boolean]
--version, -v Show version number [boolean]
Examples:
bin db.json
bin file.js
bin http://example.com/db.json
You can also set options in a json-server.json configuration file.
Module
If you need to add authentication, validation, you can use the project as a module in combination with other Express middlewares.
var jsonServer = require('json-server') // Returns an Express server var server = jsonServer.create() // Set default middlewares (logger, static, cors and no-cache) server.use(jsonServer.defaults()) // Add custom routes // server.get('/custom', function (req, res) { res.json({ msg: 'hello' }) }) // Returns an Express router var router = jsonServer.router('db.json') server.use(router) server.listen(3000)
For an in-memory database, you can pass an object to jsonServer.router().
Please note also that jsonServer.router() can be used in existing Express projects.
To modify responses, use router.render():
// In this example, returned resources will be wrapped in a body property router.render = function (req, res) { res.jsonp({ body: res.locals.data }) }
To add rewrite rules, use jsonServer.rewriter():
// Add this before server.use(router) server.use(jsonServer.rewriter({ '/api/': '/', '/blog/:resource/:id/show': '/:resource/:id' }))
Alternatively, you can also mount the router on another path.
server.use('/api', router)
Deployment
You can deploy JSON Server. For example, JSONPlaceholder is an online fake API powered by JSON Server and running on Heroku.
Links
Video
Articles
- Node Module Of The Week - json-server
- Mock up your REST API with JSON Server
- ng-admin: Add an AngularJS admin GUI to any RESTful API
- Fast prototyping using Restangular and Json-server
Third-party tools
License
MIT - Typicode