NGRX https://ngrx.io/guide/store https://www.thisdot.

co/blog/introduction-
to-ngrx https://www.learmoreseekmore.com/2022/06/angular-14-statemanagement-
crud-example-with-rxjs14.html https://www.codemag.com/Article/1811061/Angular-
and-the-Store
NgRx is a framework for building reactive applications in Angular. NgRx Store
provides reactive state management for Angular apps inspired by Redux. NgRx
is inspired by the Redux pattern
@ngrx/store Store is RxJS powered global state management for Angular ap-
plications, inspired by Redux. Store is a controlled state container designed to
help write performant, consistent applications on top of Angular.
Actions describe unique events that are dispatched from components and ser-
vices. State changes are handled by pure functions called reducers that take the
current state and the latest action to compute a new state. Selectors are pure
functions used to select, derive and compose pieces of state. State is accessed
with the Store, an observable of state and an observer of actions.
NgRx Store is mainly for managing global state across an entire application. In
cases where you need to manage temporary or local component state, consider
using NgRx ComponentStore.
Store is RxJS powered global state management for Angular applications, in-
spired by Redux.

Store Architecture
@ngrx/store -Provide Store
(store.select(),store.dispatch,) StoreModule
createReducer on createAction

@ngrx/store -Provide StoreModule ActionReducerMap createSelector Action

Installation
Step 1: Installing NgRx
import the StoreModule.forRoot({}, {}) in your AppModule
import {StoreModule} from ‘@ngrx/store’; import {StoreDevtoolsModule}
from ‘@ngrx/store-devtools’; import {rootReducer} from ‘./reducers’;
import:{ StoreModule.forRoot(rootReducer), StoreDevtoolsModule.instrument({maxAge:
25, logOnly: environment.production}), }
store - rootReducer
import {ActionReducerMap, createSelector} from ‘@ngrx/store’;

1
pnly store
Current Count: {{ count$ | async }}
<button (click)="increment()">Increment</button>
<button (click)="decrement()">Decrement</button>
<button (click)="reset()">Reset Counter</button>

store with effects ng add @ngrx/effects@latest