angular - inDepth.dev

Angular self-saving dropdowns - yet another directive

Use the power of Angular directives to create a reusable self-saving dropdown directive

Leveraging Dependency Injection to reduce duplicated code in Angular

How to eliminate duplicated code when getting route params, query params or data from Activated Route in Angular by using dependency injection.

angular

Craft a complete GitLab pipeline for Angular. Part 2

Learn Gitlab to build a CI/CD pipeline for Angular apps and libraries. This second article focuses on deployment using two methods involving GitLab Registries and Pages. You'll also find docker jobs optimization tips using custom images.

angular

Faster Perceived Response Time with Angular Material to tackle Need for Speed

While the end-users interacting with apps have lower tolerance to response time and higher need for speed, this post discusses different ways front-end developers can cater to their need for speed with off-the-shelf components from Angular Material.

angular

Techniques to style component host element in Angular

Styling the host element is a crucial ability. Understanding that can completely change the way you develop reusable components, making their code clear and easier to maintain. This article will concentrate on techniques that use CSS styles and reduce Typescript logic.

angular

How to use ControlValueAccessor to enhance date input with automatic conversion and validation

In this article, we will learn how we can extend native date input through a directive so that it supports conversion of value and validation on value.

angular

How @taiga-ui/cdk can help you simplify your working with Angular: our 5 best practices

I decided to pick my favorite 5 tools from taiga-ui/cdk and explain how they can in any Angular app

typescript

Adding a layer of more explicit typings on top of 3rd party library interfaces

Third party library interfaces are often loosely typed to support edge cases. However, there can be great benefits to layering more explicit types over the existing interfaces.

angular

Bindon: lesser known Angular template features

Angular 12 just came out which added a nullish coalescing operator (‘??’) to templates. But what are other features Angular templates have that you might have never heard of? Let’s find out!

angular

Angular Forms: reactive design patterns catalog

In this post, you'll find a set of design patterns for building Angular forms based on two pillars: separation of responsibilities and reactive programming to tackle the complexity of rich and complex Angular forms.

angular

A journey into NgRx Selectors

This article dives deep into NgRx selectors and will help you understand what role that play in NgRx architecture and how they help decrease the complexity of a codebase

angular

How to split HTTP Interceptors between multiple backends

This article explains one of the possible ways to build different types of HttpClients for different feature modules (including non-lazy loaded) and associate a set of interceptors with each HttpClient type to ensure more reliable architecture.

angular

Different ways to run schematics from another schematics

When we create schematics, we sometimes face a situation where we want to run other existing schematics from the same or external collection. In this article we will learn how to do it.

angular

How pure and impure pipes work in Angular Ivy

Understanding how pipes work under the hood by looking at their implementation details in Ivy

angular

How to use TS decorators to add caching logic to API calls

In this article I'll go over a couple of possible implementations of network requests caching and I'll elaborate on the one we adopted that uses TS decorators.

angular

NGRX Best Practices

In my last article we glossed over things that one should probably avoid doing when building an Angular application with NgRx; today, we are going to discuss things that are good to do when facing that very same challenge.

angular

Global objects in Angular

In JavaScript we often use entities, such as window or navigator. Some of these objects have been there forever. But you might have seen DOCUMENT token used in Angular. Let's discuss why it exists and what we can learn from it to make our apps cleaner and more flexible.

angular

How we make our base components more flexible: controllers concept in Angular

I want to show how we organized the system of settings for all textfields in Taiga UI with this concept and the power of Dependency Injection in Angular.

angular

Learn advanced Angular features: build the Material tree

Learn about ng-content, ng-template, ContentChild and structural directives to build Angular material "mat-tree". These are badly documented but powerful and advanced concepts available in Angular.

ngrx

NGRX Bad Practices

It is time to explore some practices and patterns the community has recognized as harmful or complicated. So let's start with a list of what not to do in NGRX

angular

Progressively migrates from a traditional server-side website to Angular

We are migrating a traditional server-side website to angular step by step. I want to share some experiences of what we have tried in this article.

angular

Add Support for Reduced Motion in Angular Animations

Animations are good, but it can be overwhelming sometimes. As developers, we need to allow users to take control of animations. In this article we will learn how we can utilize reduced motion media query to disable angular animations.

angular

Running event listeners outside of the NgZone

NgZone notifies Angular when to perform the change detection process (e.g. a DOM event with bound listener is one of the triggerers). However, if in response to an event you directly manipulate the DOM or simply perform an action which does not require bindings update, the process is redundant.

angular

Learn Angular Component Design Patterns — Creating a Drawer Component

I keep telling people that Angular is way more powerful than what youtube teaches. Learning design patterns will help to create powerful components. Let's learn to create an Angular component, iterate over it to make it reusable, scalable, and powerful.

angular

Handling realtime data storage in Angular using Firebase Cloud Firestore

This article will give you a step by step walkthrough on implementing a realtime database in your Angular Apps using Firebase Cloud Firestore.