Example of the Store

What is a Store?

So far, we’ve mentioned State and Store, but sometimes it’s difficult to know what the difference between the two is. Let’s try to clear up the distinction between the two.

---

A Store is an Object from NgRx that contains the State of the application. This Store object has an API that allows us to manage the State contained within the Store.

---

The State is the data we create for our application, which is specific to the application we’re building. So, from our apple example earlier, applesCount is the state information, which we keep in a Store object.

To create this State, we first create an interface of the State, defining the properties of the State model. There is an example of this in the ApplesState interface that we defined earlier. This interface says that the ApplesState has a property of applesCount, so when we create the initial state object, we have to add it (TypeScript will throw an error if we don’t).

Finally, we tell the Reducer to return a state object of Type ApplesState. As you can see, the State is created within the associated Reducer (See line 40 of apples-reducer.ts).