Have you heard about Envirotechnical? Let's fight climate change one byte at a time :) Learn More →

logo
Published on

Fast prototyping RESTful API with json-server

Authors
Table of Contents

TL;DR - Package json-server

npx json-server --watch database.json to start a prototyping RESTful server to play with without scaffolding an entire backend.

Link to documentation here

RESTful API prototyping superfast

Welcome back to 404answernotfound and let's finally talk about json-server, or, as the authors of the package on github like to define it, full fake REST API with zero coding in less than 30 seconds (seriously).

This package can be easely installed through npm, like so npm install -g json-server.

That's it, that's actually really it.

The RESTful server is ready to be used, along with all CRUD operations out-of-the-box. Sweet powerful open source.

Don't want to install it globally? Just npx json-server --watch database.json and you're all set, no installation needed.

If you already read the docs you already know that you can have a starting json file to init your database, but don't worry, in case you forgot to do that or you were lazy enough not to read anything, the json-server command will initialize a database json file for you.

Just to give you a hint about it, check out the output of my console:

$ npx json-server --watch database.json
# npx: installed 182 in 10s

#   \{^_^}/ hi!

#   Loading database.json
#   Oops, database.json doesn't seem to exist
#   Creating database.json with some default data

#   Done

#   Resources
#   http://localhost:3000/posts
#   http://localhost:3000/comments
#   http://localhost:3000/profile

#   Home
#   http://localhost:3000

#   Type s + enter at any time to create a snapshot of the database
#   Watching...

Now we're all set, if we check the folder where we started the process (or where we decided to watch the database file for), we should have a brand new database json file to start messing around with.

If the file was created by the json-server process, you will find some basic data to get started and it can also help you as an example.

{
  "posts": [
    {
      "id": 1,
      "title": "json-server",
      "author": "typicode"
    }
  ],
  "comments": [
    {
      "id": 1,
      "body": "some comment",
      "postId": 1
    }
  ],
  "profile": {
    "name": "typicode"
  }
}

Installed it globally, didn't you? Run it like so json-server --watch database.json

What can you do with json-server?

  1. Routing for each CRUD request (GET, POST, PUT, PATCH, DELETE )
  2. History of changes
  3. Add middleware (in the express way)
  4. Filtering
  5. Pagination
  6. Sorting
  7. Slicing
  8. Operators
  9. Full Text Search
  10. Relations between data (includes)

I take that can be enough for fast prototyping quite a few applications so go out there and have fun with this shiny toy you might have yet not known.

Configurations for json-server

  1. You can add a middleware from CLI in the style of express.js
// hello.js, from the official github README
module.exports = (req, res, next) => {
  res.header('X-Hello', 'World')
  next()
}
  1. Yuo can start the json-server from a different port using the CLI --port or -p flag, or you can create a json-server.json configuration file
// very useful if you are using web apps that boot up on that port already
{
  "port": 3001
}
  1. Since it's built on express, you can pretty much extend it at will by just using json-server as a module instead of a CLI application
// from the official github README
const jsonServer = require('json-server')
const server = jsonServer.create()
const router = jsonServer.router('database.json')
const middlewares = jsonServer.defaults()

server.use(middlewares)
server.use((req, res, next) => {
  if (isAuthorized(req)) {
    // add your authorization logic here
    next() // continue to JSON Server router
  } else {
    res.sendStatus(401)
  }
})
server.use(router)
server.listen(3000, () => {
  console.log('JSON Server is running')
})

The goodbye

I hope you found this article useful and to your liking and if you have any requests, drop a message on one of my social media accounts or open an issue/start a discussion on github, on this repository!

As always you can find me on Twitter, listen to my Podcast on Spotify and add me on LinkedIn to talk professionally (yeah, right)