Course Overview: Reactive State Management in Angular with ngrx
State management is one of the most challenging aspects of building any non-trivial application regardless of the framework. Most developers do a pretty good job of achieving significant functionality through stateful services in an Angular application but find that things get really complicated really fast. In this course, we are going to learn how to convert an Angular application using stateful services to using ngrx for state management. Through this process, we will learn how to set up the ngrx store for a feature, build out the reducer, use typesafe actions, manage collections with ngrx entity, query our state with selectors, use effects for async operations, level up our HTTP calls with NRWL Data Persistence, handle relational data with selectors and hide ngrx implementations details with the facade pattern.
Instructor: [00:01] In this series, we are going to learn how to integrate NgRx into a fully working Angular application. I find that most developers who've worked with Angular for some time, they're very good at creating components, creating services, communicating to a back-end with those services, but I believe that they find very quickly there is a threshold of complexity.
[00:28] As their application starts to grow and they start to manage state across multiple services, that becomes very difficult. What we have in this application is we have a component that is communicating directly with a service, which is then taking that data. It is binding to the view layer of a component.
[00:49] This is a master-detail view, which is a perfectly commendable milestone in terms of application development. But again, as you start to grow in complexity, you need a better way to manage state and to find a way to replace these service calls with something that's a little bit more predictable and simplified.
[01:12] Through this application, we are going to, piece by piece, replace these calls and this pattern with NgRx from actions, effects, reducers, entity, and even the facade pattern, which I am a huge fan of. I went ahead and laid some of the groundwork for us by introducing the top-level reducer, store dev tools, as well as even a basic effects component here.
[01:42] We go over every piece and how to put this together, so that as a developer you will have all the tools you need to take a stateful service Angular application and integrate NgRx and understand what those components are as you start to build your application out.
Thanks, Oscar! And yes... I intend to add some testing videos soon. Stay tuned! As for the comment blocks, I use live templates for most of my auto-expansion stuff. Occasionally, I put some shortcuts into a text expander (Typinator in my case) so I can use them across programs. Hope that helps!
Hi Lukas, thank you very much for the course it's great. Wanted to ask if you will add Unit tests to this course and a bit more of NX ? Also when you are adding comment blocks, is that a plugin ?
THANK YOU Oscar