React Journey: Part 4 — Working with Web API

There is no app existence without communicating server or at least a fake server. In our React learning journey we will now make our Notesy app to communicate to API even though its fake. In this article, we will make use of json-server to create API endpoint for our Notesy app and make our create, read, delete operation little dynamic.

If you are just started with React and have no idea about what happens at the backend, then don’t scare in this article we will create a backend for us without actually creating a backend. If you already know about backend and the React is the second thing you have taken then you can create your own API for that matter, but for this article will go for a fake one.

For creating a fake API will be using super awesome json-server. The steps for this are super simple and easy to follow. For making API call from our Notesy app we will be using another awesome package called axios.

We will head in this direction:

• Setup JSON Server
• Configure Axios
• Create Service Endpoints
• Invoke API — Get All
• Invoke API — Add
• Invoke API — Remove
• Configure Error Handling
• Configure Loader