Autoplay

    Redux: Adding a Fake Backend to the Project

    Dan AbramovDan Abramov

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

    reactReact
    ^15.0.0
    reduxRedux
    ^3.0.0
    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    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.

    Discuss

    Discuss