• Anti-patterns of NgRx

    Mike Ryan is one of the author of NgRx. He has a YouTube video “You might not need NgRx”, which showcases when you can use NgRx. Some people just don’t care about those use cases, and use it in the wrong scenarios, writing unnecessary complex code, which make others hate NgRx more. While it is important to document when to use it, and how to use it, it is equally important to document when you should not to use it. In this post, I am trying to document some of the anti-pattern in using NgRx.

  • Reintroduce NgRx - A more complex example(part 3)

    In the counter example, action and reducer is one to one mapping. It does not show the flexibility of decoupling action and reducer. I need to use a more complex example to showcase that. In the following, I will build sales app with store. Here is the features of the app. After login, the app will load your recent orders and you preferences, and you can logout from there. After login, the session will timeout and logout if screen is idle for 10 seconds. If you move your mouse, session will be renewed. After session timeout or user logout manually, the session tracking will be turn off.

  • Reintroduce NgRx - ComponentStore vs Store (part 2)

    Observable is pushed-based architecture. NgRx has two observable-based implementation, Store and ComponentStore. Store is more flexible and scalable, but you need deal with multiple objects such actions and reducers, selectors. ComponentStore is also powerful but much simpler to use. It involves less concepts and requires less coding.

  • Reintroduce NgRx - Observable (part 1)

    NgRx has been around as long as Angular. It is a very popular and so highly praised, if you don’t use it, you will feel you are missed out. NgRx is also controversial. There are lots of articles advocating NgRx or asking people stop using it. I have used it for a long time in various projects, and I have seen good code and bad code in using NgRx. In the post, I would like reintroduce NgRx from a new perspective. All the source code of the post can be found here. The live demo is here

  • Angular signal - a new reactivity primitive.

    Angular 17 has brought lots of new features. One of them is Signal. If you’re an Angular user, you surely know that zone.js as the underlying mechanism of change detection in Angular. It is simple, elegant, and sufficent in terms of performance in most of cases. The beauty of zone.js is that you can use any kind of data stucture to for state, you can use plain old javascript object, observable, now you have one more option, signal. To understand signal, I will review what we have. In this post, I will use the following application to demonstrate the different ways to represent state in Angular. The source code of the app is hosted at github

  • 1
  • 2