Skip to main content

Chapter 1: Introduction to NgRx

Preface#

This tutorial was created and is maintained by Armen Vardanyan, an Angular/NgRx enthusiast just like you. The project is open sourced, read about how you can also contribute to is here

I want to help people master skills necessary for WebDev as quick as possible, so I won't be using big words and long introductions here. Just a few sentences about this tutorial

What will you learn?#

After you complete this tutorial, you will

  1. Know the basic and advanced concepts of NgRx
  2. Be able to create applications using NgRx
  3. Understand existing NgRx codebases
  4. Convert existing Angular apps that don't use NgRx to start using NgRx
  5. Understand RxJS better

What will we do?#

I hold a firm belief that in order to learn and understand something thoroughly, one has to put that knowledge to practice as soon as possible. So in this tutorial, we won't be just learning NgRx concepts and exploring small examples; we will be building a (not so large) Angular app on NgRx, that has practical value and real-world challenges. What kind of project is that? Well, to better understand the concepts of state management, we will build a financial logging application, a tool that allows the user to add income and expense logs, monitor their spending, categorize it, and even view charts. We will explore all NgRx concepts during the development of that app. The app already exists, written by me, and can be found at this GitHub Repository (visit it and follow instructions to install and run it on your machine). You can of course view the existing app, but it would be far more beneficial to build it together, step-by-step, grasping all the concepts and using the best known practices.

How is this tutorial structured?#

The tutorial is divided into simple chapters (you are, as you've noticed, reading Chapter 1 right now). After you finish a chapter, you can move on to the next one. Each chapter explores one single, isolated topic, with small examples, and then puts it into use in the application that we are building.

What's next?#

Now, that we know what and why we are doing, let's move on to Chapter 2, where we will actually start doing stuff.