Documentation is great, but sometimes you don’t understand really well how to get involved in a new technology, or you don’t even see real advantages in using it. One thing that confuses me every time I start a new project or check any project in NGRX is how to initialize the store and states.
We are going to walk through some improvements that can be done in a basic project (already done in NGRX) managing its reducers. We will get the state of the art concerning what the documentation says about NGRX reducers. Finally, you will see how we modularize our project, getting the benefits of abstracting certain features.
The use case is a simple to-do list built with Angular and NGRX superpower by someone else (many thanks for whoever built it).
The Use Case
Here our start point is a basic NGRX project with three actions: add Todo, remove Todo, toggle Todo for marking up whether a task is completed or not.
Take time to familiarize yourself with that code and play a little bit with the to-do list.
Introduction
Although our to-do list works perfectly, we can see fast and easy performance improvements here as the next logical step to make it more scalable and modular.
Moving on from here, let’s do the job.
https://github.com/ackuser/ngrx-custom-reducers-todo-list/tree/feature/startPoint
Repo at this point: StackBlitz OR GitHub on branch feature/startPoint.
#programming #javascript #angular #typescript #redux #react
