Logo

dev-resources.site

for different kinds of informations.

Angular Addicts #22: Angular 17.1, Signal Inputs, State management tips & more

Published at
1/30/2024
Categories
angular
typescript
ngrx
javascript
Author
gergelyszerovay
Author
15 person written this
gergelyszerovay
open
Angular Addicts #22: Angular 17.1, Signal Inputs, State management tips & more

đź‘‹Hey fellow Angular Addict

This is the 22nd issue of the Angular Addicts Newsletter, a monthly collection of carefully selected Angular resources that got my attention. (Here are the 21st, 20th and 19th issues.)


📢Release announcements

📢What's new in Angular 17.1?

The latest minor version of Angular, was released this month. CĂ©dric Exbrayat summarizes the most important new features in his blog post:

  • Support for TypeScript 5.3
  • Inputs as Signals
  • Zoneless change detection (new private API)
  • Router: new info option in NavigationExtras
  • Control flow migration
  • Angular CLI improvements

đź’ŽAngular Gems of January, 2024

đź“°11 friends of state management in Angular

Alexander Goncharuk suggests 11 rules to follow with "Avoid" and "Prefer" code snippets and detailed explanations:

  • Use dedicated tools for state management
  • Always prefer local state unless you have a good reason to use global state
  • Limit component code to view-related logic only
  • Always separate stateful and stateless services
  • Access state synchronously when it makes sense
  • Do not create "proxy methods" for no good reason
  • Remember to use multicasting observables returned by selectors
  • Use state management APIs, but do not limit yourself to them
  • Embrace pure functions and static methods
  • Make sure you handle errors in effects

đź“°Derivations in Reactivity

Ryan Carniato takes a deep dive into the theory behind reactive systems, highlighting the distinctions between derivation and synchronization. He addresses the challenges of ensuring glitch-free consistency during state updates, and compares three approaches to reactivity: scheduling (pull), events (push) and signals (push-pull).


📰Testing Angular’s Latest Features

In his article, Rainer Hahnekamp covers testing techniques for the latest features of Angular:

  • How to mock services in a standalone component
  • How can we use TestBed.runInInjectionContext() for unit testing code that uses the inject() function
  • Utilizing RouterTestingHarness to simplify the unit test of the routed components

đź“°Angular Signal Inputs

One of the most interesting new features of Angular 17.1 is Signal Inputs. Kevin Kreuzer highlights the benefits of reactive inputs and the differences between the computed signals and the transform property of Signal Inputs. He also explains how required inputs and input aliasing work, demonstrates how to utilize router parameters with Signal Inputs and offers a simple method to trigger side effects when input changes occur.


👨‍💻About the author

My name is Gergely Szerovay, I work as a frontend development chapter lead. Teaching (and learning) Angular is one of my passions. I consume content related to Angular on a daily basis — articles, podcasts, conference talks, you name it.

I created the Angular Addict Newsletter so that I can send you the best resources I come across each month. Whether you are a seasoned Angular Addict or a beginner, I got you covered.

Next to the newsletter, I also have a publication called — you guessed it — Angular Addicts. It is a collection of the resources I find most informative and interesting. Let me know if you would like to be included as a writer.

Let’s learn Angular together! Subscribe here 🔥

Follow me on Substack, Medium, Dev.to, Twitter or LinkedIn to learn more about Angular!


🕹️Previous issues

If you missed the previous issues of the newsletter, you can read them here, these are the latest 3 issues:


📨 Submit your Angular resource

Have you found or written an interesting Angular-related article, tweet or other resource lately? Please let me know here in the comments or send me a DM on Twitter! I might feature it in the next Angular Addicts issue!

ngrx Article's
30 articles in total
Favicon
🚀 Learning Through Experience: A Tale of NgRx Effects
Favicon
Announcing NgRx 19: NgRx Signals Features, Action Signals, and more!
Favicon
NGRX with Angular 16
Favicon
Angular Addicts #31: The new Resource API, effect updates & more
Favicon
Simplify Your Angular Code with NgRx Entities
Favicon
ngRx Store in Angular
Favicon
Angular Addicts #29: Angular 18.2, implicit libraries, the future is standalone & more
Favicon
NgRx Use Cases, Part III: Decision-making
Favicon
Angular Addicts #28: Angular 18.1 (w. the new @let syntax), Component testing, SSR guide & more
Favicon
Angular Router URL Parameters Using NgRx Router Store
Favicon
When to Use `concatMap`, `mergeMap`, `switchMap`, and `exhaustMap` Operators in Building a CRUD with NgRx
Favicon
How to Implement ActionCreationGroup in NgRx
Favicon
A single state for Loading/Success/Error in NgRx
Favicon
How to Debug NgRx Using REDUX DevTools in Angular
Favicon
When and Why to Use REDUX NgRx in Angular
Favicon
Announcing NgRx Signals v18: State Encapsulation, Private Store Members, Enhanced Entity Management, and more!
Favicon
Angular Addicts #27: NgRx 18, New RFC: DomRef API, Web storage with Signals & more
Favicon
Announcing NgRx 18: NgRx Signals is almost stable, ESLint v9 Support, New Logo and Redesign, Workshops, and more!
Favicon
Angular Addicts #26: Angular 18, best practices, recent conference recordings & more
Favicon
How to Handle Side Effects in Angular Using NgRx Effects
Favicon
How to Use NgRx Selectors in Angular
Favicon
Angular Addicts #25: Angular and Wiz will be merged, the differences between React and Angular & more
Favicon
Angular Addicts #24: Angular 17.3, Signals and unit testing best practices, Storybook 8 & more
Favicon
Creating a ToDo App with Angular, NestJS, and NgRx in a Nx Monorepo
Favicon
Here's how NgRx selectors actually work internally
Favicon
Angular Addicts #23: Angular 17.2, Nx 18, Signal forms, Analog, WebExpo & more
Favicon
All you need to know to get started with the NgRx Signal Store
Favicon
Angular Addicts #22: Angular 17.1, Signal Inputs, State management tips & more
Favicon
11 friends of state management in Angular
Favicon
The best of Angular: a collection of my favorite resources of 2023

Featured ones: