angular - inDepth.dev

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.

angular

Extend Angular Schematics to customize your development process

Have you ever realized that you often repeat the same patterns across multiple files? Creating schematics that override well-known Angular schematics, designing them based on project needs will enhance your development and reduce time spent on generating files.

angular

Angular Universal: real app problems

Angular Universal is an open-source project that extends the functionality of @angular/platform-server. The project makes server-side rendering possible in Angular. This article will discuss the issues and possible solutions we encountered while developing a real application with Angular Universal.

angular

View State Selector - Angular design pattern

As a web developer you may have noticed a repetitive boiler plate code of displaying a loader while an asynchronous request is being processed, then switching to the main view or displaying an error. Personally, I noticed these repetitions both in my code and other developers I work with. And

angular

Making HostBinding work with Observables

We cannot use HostBinding with Observable data — it requires a plain value. This is a pretty sought-after feature. Let’s see how we can implement it while we wait for official support.

angular

Implementing reusable and reactive forms in Angular

In this article we will learn about two ways to implement reactive and reusable forms that have the capability to be used as sub-forms and also be used as standalone forms.

angular

How to refactor an Angular codebase

If you see a project ridden with problems and bad practices, it might be tempting to start refactoring right away. But it is important to clear up several issues before getting to work.

angular

RxJS custom operators

Undoubtedly, it’s a wide array of operators that makes the RxJS library extremely powerful utility in a developer’s tool belt. In this blog post, I will introduce you to the concept of custom RxJS operators and present exemplary implementations.

angular

Headless Angular Components

A headless component is one that provides behavior to its children, and allows the children to decide the actual UI to render while incorporating the behavior provided by the parent. In this article, we explore an example of a headless component, and the problems they help us solve.

angular

Building Web, Desktop and Mobile apps from a single codebase using Angular

Learn how to build extensible applications with Angular and reuse your code and abilities to build apps for any deployment target - web, mobile web, iOS, Android, macOS, Windows and Linux.

rxjs

Subtle difference between map and pluck RxJS operators that you should know

Explanation in detail about how map and pluck work, and then figuring out main difference between two operators

rxjs

RxJS in Angular: Part III

In my previous two articles we have discussed how to change our components which solve problems in imperative ways to do that in functional, reactive, RxJS way, and we of course had a lot of fun doing that.