*Article posted using bloggu.io. Try it for free.*For some recent interviews with React, I found myself in the necessity to build an API to perform CRUD operations.

It's possible to have directly fake data mocked in the React application, but I find the idea of showcasing how you handle requests from a remote server fascinating. But how do you make it fast?

It can take literally hours to set up a good API server and deploy it. Well, not really. Let's learn how to build a quick fake REST API server for CRUD operations.

## Requirements

You need to have Nodejs installed on your machine and also a Heroku account.

Setup

Let's create a working directory and init a Nodejs project.

mkdir fake-server && cd fake-server
yarn init

You'll be asked some questions for some entries in the package.json. Here's the structure of the package.json for this project.

{
  "name": "fake-server",
  "version": "1.0.0",
  "license": "MIT",
  "main": "server.js",
  "scripts": {
    "start": "node server.js"
  }
}

Let's install json-server in the project.

yarn add json-server

Great! We can now move to write the server.js file.

Writing the server

The server.js will contain the logic to run the launch the server and load the json-server middlewares.

const jsonServer = require('json-server');
const server = jsonServer.create();
const router = jsonServer.router('db.json'); // <== Will be created later
const middlewares = jsonServer.defaults();
const port = process.env.PORT || 3200; // <== You can change the port

server.use(middlewares);
server.use(router);

server.listen(port);

Next, we need to create the db.json file. It's a file containing JSON data. json-server will automatically create routes and schema for resources with the structure of the JSON files, then will allow CRUD operations on the resources.

The data for this article comes from Mockaroo.

The structure of db.json comes like this.

{
  "resources1": [
     // JSON data
  ],
  "resources2": [
     // JSON data
  ]
}

Here's an example of user data for our project.

{
  "users": [
    {
      "id": 1,
      "name": "Aurelie Cheyne",
      "email": "acheyne0@simplemachines.org",
      "city": "Male",
      "username": "acheyne0",
      "website": "Redhold"
    },
    {
      "id": 2,
      "name": "Dael Leppo",
      "email": "dleppo1@mapy.cz",
      "city": "Non-binary",
      "username": "dleppo1",
      "website": "Cardify"
    },
    {
      "id": 3,
      "name": "Elnar Brahm",
      "email": "ebrahm2@wunderground.com",
      "city": "Female",
      "username": "ebrahm2",
      "website": "Matsoft"
    },
    {
      "id": 4,
      "name": "Shelby Feaver",
      "email": "sfeaver3@dion.ne.jp",
      "city": "Female",
      "username": "sfeaver3",
      "website": "Cardguard"
    },
    {
      "id": 5,
      "name": "Anthe Ivanishev",
      "email": "aivanishev4@va.gov",
      "city": "Female",
      "username": "aivanishev4",
      "website": "Bitchip"
    },
    {
      "id": 6,
      "name": "Shermy Clinton",
      "email": "sclinton5@abc.net.au",
      "city": "Male",
      "username": "sclinton5",
      "website": "Fixflex"
    },
    {
      "id": 7,
      "name": "Alma Romaint",
      "email": "aromaint6@sciencedirect.com",
      "city": "Male",
      "username": "aromaint6",
      "website": "Keylex"
    }
  ]
}

With the db.json written, we can now run the server.

yarn start

The server will be available at http://localhost:3200.

And let's check the users resource at http://localhost:3200/users/.

Data is available but we want to deploy it. Interestingly, you might not need to deploy at all if you are only doing read-only operations. Push the code to Github, your data will automatically be available at: https://my-json-server.typicode.com/your_github_username/project_name.
For example, you can find the remote server for the repository of this mini-project here.

You can go full CRUD but warning: data is not persisted when executing write operations. To avoid this, you can deploy on Heroku.

Deploying on Heroku

Deploying on Heroku is a quick and straightforward process. Before that, make sure to have a .gitignore file.

node_modules

Then, make sure to log in.

heroku login

After that, create a new project and push the code.

heroku create
heroku buildpacks:set heroku/nodejs

And let's push the code to Heroku:

git push heroku master

And you have your application ready and running. You can also make persistent CRUD operations.🤟‍

You can find the code of this project here and directly use it as a template if you are in hurry.😁

Want to add something or have some comments? Let's discuss this in the comments section.