Refactoring to Set Initial State from the Reducer

Firstly, please have a look at the creation of the store in store/index.js. In particular, consider this line of code:

const store = createStore(reducer, { contacts });

The initial state object is passed directly into createStore. Remember that the store is created with the signature, createStore(reducer, initialState). In this case, the initial state has been set to the object, {contacts: contacts}.

Even though this approach works, this is typically used for server side rendering (don’t bother if you don’t know what this means). For now, understand that this approach of setting an initial state in createStore is more used in the real world for server side rendering.

Right now, remove the initial state in the createStore method.

We’ll have the initial state of the application set solely by the reducer. Trust me, you’ll get the hang of this.

Here’s what the store/index.js file will look like once you remove the initial state from createStore: