Making our Angular modules configurable is essential in building a reusable architecture. But in the recent past, Angular presented us with its new moduleless future. How does it look now? How can we configure lazy-loaded components? Let’s have a look at how we provide our configurations directly.
Archive: our articles
As someone who enjoys the ComponentStore on an average level, I have written simple reactive CRUD logic several times. While storing a vast number of entities in the component state might not be a frequent use case, I will briefly illustrate the usage of the EntityAdapter with the @ngrx/component-store.
After introducing the @ngrx/entity package, I am often asked how to manage multiple entity types in the same feature state. While I hope
that the previous part of this article series has made this more apparent, I will further focus on
this question in the following.
This three-part series of blogposts is targeted at developers who have already gained experience with NgRx but still manage their collections themselves. In the first part I introduce the Entity Adapter, in the second part I show you how to connect it to NgRx and in the third part how to do it with the Component Store as well.
Implementing Smart and Presentational Components with Angular: Condensed Angular Experiences – Part 4
In this article, we will explore how to apply the concept of smart and presentational components with Angular. We will choose a complex-enough target to see all aspects in action, yet understandable and within the scope of this article. The goal is to teach you how to use this architecture in your way. For that, we will iterate through different development stages, starting with the target selection and implementing it in a naive way. After the first development, we will refactor that naive solution into smart and presentational components that are reusable, refactor-friendly, and testable.
When optimizing the performance of Angular applications, many developers directly associate Angular’s OnPush change detection strategy with it. But, if you don’t know exactly how OnPush works under the hood, it will quickly teach you what you are doing wrong the hard way.
In this article, we’ll look deeper into how the OnPush strategy affects Angular’s change detection mechanism and which pitfalls we should avoid at all costs.
When a company has cross-framework teams, it is a good choice to use Web Components to build a unified and framework-independent component library.
However, some pitfalls are to consider when integrating these components into web forms.
Therefore, for a better understanding, we will look at two possible approaches and try to integrate them into an Angular form as an example.
Notice: All code samples are available on Github!
About Smart and Presentational Components, Architecture Overview & Concepts: Condensed Angular Experiences – Part 3
Modern web technologies enable us to write huge business applications that are performant and easy to use. But with time comes complexity to our projects naturally. That added complexity sums up and makes further app development slow and cumbersome. This article discusses how a simple architectural concept can make every app more maintainable, faster to develop, and extendable in the long run.
Whether to use a Promise or an Observable is a valid question. Let me show you a little hint for deciding when to use what.
Every now and then, we think about optimizing and tuning the performance of our applications. In terms of Angular, one of the first strategies that come to our minds is the OnPush change detection.
But how does it work, and is it worth putting effort into using it? For what use-cases does it make a difference? This article explores precisely that and tries to answer those questions.