👋 Welcome, Angular Enthusiasts

Welcome to the 33rd edition of the Angular Addicts Newsletter, a monthly digest of hand-picked Angular content that has captured my interest. (You can browse the 32nd 31st, and 30th editions as well)

📢 Version updates and launches

📢 NgRx 19 is here: SignalStore enhancements, Action Signals, and beyond!

Brandon Roberts unveils the newest iteration of NgRx, highlighting several standout additions:

  • The SignalStore gains the withProps feature, enabling developers to define static properties or observables at the time of store creation.
  • A fresh signalMethod utility arrives, offering the advantages of rxMethod while relying exclusively on signals.
  • Development-mode validation has been integrated into the patchState function to guarantee state immutability throughout development.
  • The NgRx Store can now react to Signal changes by dispatching actions automatically.

💎 Angular highlights from December 2024

📰 An Evolved Angular Coding Approach

Kevin Kreuzer recently undertook a substantial refactoring effort, modernizing a large codebase with Signals and contemporary Angular APIs. In his write-up, he details the coding conventions and patterns that surfaced during this process. Among the notable takeaways are the normalization of standalone components, a shift toward Signals for managing reactivity, and a departure from conventional lifecycle hooks.

📰 Integrating the Resource API with the NgRx Signal Store

Manfred Steyer demonstrates how to pair the SignalStore's withProps feature with the Resource API. His article also walks through connecting template-driven forms via linkedSignal and signalMethod.

📰 Applying the Page Object Model pattern in Angular projects

Francesco Borzì explores how to bring the Page Object Model (POM) design pattern into Angular applications. With POM, tests can concentrate on the "what" while the page object manages the "how" of DOM interaction, resulting in more readable and maintainable test suites. Francesco also presents his new library, ngx-page-object-model, built to streamline POM adoption in Angular component testing, with support across multiple testing tools.

📰 Build a Micro-Frontend architecture in 15 minutes using Vite!

In his piece, Meidi Airouche walks through assembling a micro-frontend setup powered by Vite, bringing together Vue.js, Angular, and React components within a modular news platform. The configuration features:

  • A Vue.js Header handling navigation
  • A React Trending section displaying recent articles
  • An Angular Highlights area showcasing popular content

📰 A Deep Dive into Angular Component Communication

Michał Grzegorczyk offers an extensive examination of the strategies available for enabling communication between Angular components. The topics addressed include:

  • Input, Output, Setter, and the ngOnChanges lifecycle hook
  • @Injectable Services
  • Component and Directive injection
  • Template variables designated with (#)
  • Content Projection techniques (@ContentChild / contentChild() / @ContentChildren / contentChildren())
  • View and Query List access (@ViewChild / viewChild() / @ViewChildren / viewChildren())
  • Routing mechanisms (parameters, queries, withComponentInputBinding(), state objects)

👨‍💻 About the author

I'm Gergely Szerovay, having spent years as a data scientist and full-stack developer before stepping into my current role as a frontend tech lead with a focus on Angular. In this position, I stay on top of the latest shifts in both Angular and the wider frontend ecosystem. This drove me to establish the Angular Addicts newsletter and publication in 2022, with the goal of sharing the most valuable resources I encounter every month. Whether you're just starting out or have years of experience, there's something here for you. If you'd like to contribute as a writer, just let me know. Let's dive into Angular together! Sign up here 🔥

Given how quickly Angular has advanced recently, and how generative AI has transformed our development practices over the last year, I've begun building AI tools openly and documenting my journey on AIBoosted.dev. Come along with me on this path: Subscribe here 🚀

Connect with me on Substack (Angular Addicts), Substack (AIBoosted.dev), Medium, Dev.to, Twitter, or LinkedIn for more on Angular and building AI applications with AI, Typescript, React, and Angular!

🕹️ Past editions

If you've missed any earlier newsletters, you can catch up here. Here are the most recent three:

📨 Share your Angular finds

Have you come across or written an interesting Angular-related article, tweet, or resource recently? Drop a note in the comments or reach me on Twitter! It might be featured in an upcoming Angular Addicts issue!