Redux: Adding a Fake Backend to the Project

Dan Abramov
InstructorDan Abramov

Share this video with your friends

Send Tweet
Published 6 years ago
Updated 3 years ago

We will learn about fake backend module that we will be using throughout the next lessons to simulate data fetching.

[00:01] In the next lessons, we won't be dealing with persistence anymore. Instead, we're going to add some asynchronous fetching to the app. This is why I'm removing all the code related to the localStorage persistence, and I'm going to delete the localStorage.js, as well.

[00:20] I also added a new module that implements a fake remote API. It's not really remote. I keep all the todos in memory, but I also added an artificial delay. I have methods that return promises just like a real API implementation. But instead, it just pretends that it calls the server and returns the todos from the in memory database.

[00:47] This approach lets us explore how Redux works with asynchronous detection without writing a real backend for the app. Now I can open any other module of my app and I can import fetchTodos from the API module.

[01:03] We will learn how to put these todos into the Redux chore later. But for now, let's just make sure that calling fetchTodos with a filter argument returns a promise that results through an array of todos just like a REST backend would return an array.

[01:21] The fake API waits for half a second to simulate the network connection, and then resolves the promise to an array of todos that we will treat as if they were retrieved from a remote server.