Uncategorized

As Angular developers, we constantly seek tools to enhance our productivity and streamline our development workflow. Our goal is to minimize boilerplate code, simplify project configuration, and reduce maintenance overhead, allowing us to focus on building robust features. In this article, I will share five NPM packages that have significantly impacted my Angular development experience. …

5 Essential NPM Packages Every Angular Developer Should Know for Enhanced Productivity Read More »

Introduction Angular introduced signals in their version 16 as developer preview. With version 17, signals are stable. In this article, let us delve into: What signals areWhy we should use them Front-end application development relies heavily on providing an enhanced user experience, which is closely tied to the runtime performance of the application. This article will explore how …

Angular Signals!! What’s the big deal? Read More »

Is your enterprise Angular application accessible? — Better it is, before June 2025. Open AI Dall-e-2 generated scene image If your enterprise application is not compliant with the Web Content Accessibility Guidelines (WCAG), your company might be sued with serious penalties that may reach 250k EUR, depending on the business and the country. In France, for example, the government …

Is your enterprise Angular application accessible? — Better it’s, before June 2025. Read More »

TanStack Query is a powerful data synchronization library that enables efficient handling of server state in web applications. It’s widely used in React applications, but lately it has been making noise in Angular since it is a library that can provide a lot of functionality out of the box to handle all the server state …

TanStack Query in Angular Read More »

Cómo la directiva NgOptimizedImage calibra las imágenes para ser representadas eficientemente En el ámbito del desarrollo web, optimizar las imágenes para una adecuada representación visual es crucial. Este artículo resalta los ajustes que efectúa la directiva NgOptimizedImage, esa característica del framework de Angular que permite de manera sencilla comunicar a los navegadores cuáles imágenes priorizar …

Ajustes automáticos en las imágenes optimizadas por Angular Read More »

How the NgOptimizedImage directive streamlines image rendering performance In the realm of web development, optimizing images for appropriate rendering is crucial. This article highlights the built-in performance adjustments offered by the NgOptimizedImage directive, a powerful feature within the Angular framework that seamlessly enables browsers to anticipate which images to prioritize or defer, assists in responsive …

Automatic Adjustments in Angular’s Optimized Images Read More »

This article explains how to test Signal and Model Inputs, which are the input() and the model() functions. Signal Inputs Signal Inputs arrived in Angular 17.1. They fulfill the same tasks as the @Input decorator: Property Binding. A Signal Input is a simple function named input(). The new Property Binding syntax looks like this: // @Input-Style …

How do I test Signal & Model Inputs? Read More »

Signals as lightweight “reactive primitive” will shape the future of Angular applications. At the time of this writing, signal() and computed() are stable, and effect() is in developer preview. Developer preview doesn’t mean we have an unstable feature but that the Angular team can introduce breaking changes within a major version. The feature is stable; …

How do I test Signals (signal, computed, effect)? Read More »

Historically, creating a test involving the routing context without mocking it has been challenging. This is mainly due to less-than-optimal documentation on RouterTestingModule or provideLocationMock. In the meantime, some community projects, especially Spectacular from Lars Nielsen, have helped us out. Spectacular by ngworkers | Spectacular This article explains how to use the RouterTestingHarness to write sound …

How do I test using the RouterTestingHarness? Read More »

This article discusses testing Angular code, which uses the inject function for dependency injection. If you are more of a visual learner, here’s a video for you: https://medium.com/media/e1f4a05a89392e4ab835000ea9d9e832/href Why inject()? The inject function, introduced in Angular 14, is an alternative to the constructor-based dependency injection. inject has the following advantages: 1. Standardization of Decorators Decorators have …

How do I test code using inject()? Read More »