NgRx stands for Angular Reactive Extensions. In short, it is a state management system based on the Redux pattern. This will help you to manage the application state in a bigger angular application.
It will work as expected as all the components can get or set the required data from a specific service. But, the actual problem is if we refresh the page we will lose the application state stored in the angular service.
So, If we use the angular services to keep the application state, it is necessary to use a backend to save the application state.
Then, we should fetch the state (persistent state) from the backend when the page reloads again.
As we all know, the state is not just data as user data, it will decide what should be visible on screen. For smaller applications, it is fine to use components and services for application state management. But, it would become difficult to manage the application state when our application gets complex and big.
Redux is a state management pattern and a library to implement that
pattern into any application.
The main idea behind the management of the state using the Redux
pattern is that we have a single central store to keep all
applications state.
We can consider this store as a large javascript object that holds all
the data of different parts of our application needs.
Our components and services can communicate with each other. But they
receive their states from this central store.
We can say the store is the single source of truth that manages the
entire application state.
For more, click here.
Ref: https://www.c-sharpcorner.com/article/state-management-in-angular-using-ngrx/