Angular Videos by Experts

Learn all about Angular, NgRx, RxJs & NX and advance your skills with guides, in-depth content and actionable tips and tricks!

Get notified
about new blog posts

Sign up for Angular Experts Content Updates & News and you'll get notified whenever I release a new article about Angular, Ngrx, RxJs or other interesting Frontend topics!

We will never share your email with anyone else and you can unsubscribe at any time!

Emails may include additional promotional content, for more details see our Privacy policy.
Angular signals

Angular signals

In this episode, we discuss the upcoming Angular signals. Come join us to learn and chat about signals.

Kevin Kreuzer

22.03.2023

59m 49s

Angular async pipe explained

Angular async pipe explained

The async pipe is probably the most important build in Angular pipe. In this video, we will implement our own async pipe to fully understand what the async pipe does and how it works.

Kevin Kreuzer

21.03.2023

5m 42s

Nest JS and Prisma

Nest JS and Prisma

In this stream, we build a backend with NestJS. We provide REST controllers to deliver football players from a Postgres Database. To interact with the Database, we use Prisma JS. Finally, we build an Angular frontend to integrate and display the data from the backend.

Kevin Kreuzer

16.03.2023

1h 59m 31s

Testing time - Let's learn some Cypress

Testing time - Let's learn some Cypress

Broadcasted live on Twitch -- Watch live at https://www.twitch.tv/kev_d_dev

Kevin Kreuzer

08.03.2023

1h 42m 9s

Everything you need to know about Angular signals

Everything you need to know about Angular signals

In this video, we cover everything you have to know about Angular signals. We will learn how to create a signal, set a new value, and how to use update and mutate. Furthermore, we will explore computed signals and learn how to run side effects once a signal changes.

Kevin Kreuzer

07.03.2023

6m 25s

Angular standalone components in depth

Angular standalone components in depth

Welcome to this episode, where we delve into the world of Angular standalone components! As a developer, you may have heard of standalone components, but are unsure of what they are and how they differ from NgModules. In this discussion, we explore the ins and outs of standalone components. So sit back, relax, and join us on this learning journey!

Kevin Kreuzer

06.03.2023

1h 13m 15s

Angular signals! A look into a possible future!

Angular signals! A look into a possible future!

In this video, we explore the potential of Angular signals and demonstrate how they may be used in the future to create powerful applications. We start by creating simple versions of Angular signal functions, including fromObservable and toObservable, as well as signal inputs and outputs.

Kevin Kreuzer

02.03.2023

1h 19m 16s

Angular signals

Angular signals

Welcome to this stream, where we take our first look at Angular signals! Signals are a powerful feature in Angular that allow you to define reactive data sources and automatically update the view when the data changes. We explore how to create and use signals in Angular, including computed and effect signals. We also dive into how signals can be used with objects and how to update signals as new data is received. You'll also learn how to use signals in services and ngFor and convert an HTTP request to a signal.

Kevin Kreuzer

27.02.2023

1h 9m 58s

CSS grid | GraphQL | Angular query

CSS grid | GraphQL | Angular query

Listing some animes with Angular query | CSS grid | GraphQl | Infinite scroll

Kevin Kreuzer

20.02.2023

2h 44m 1s

Going Fullstack - Angular | Angular Query and Nest JS

Going Fullstack - Angular | Angular Query and Nest JS

In this video, we create a full-stack application using Angular, Angular Query and NestJS

Kevin Kreuzer

17.02.2023

4h 59s

Angular standalone migration schematics

Angular standalone migration schematics

In this video, we take a first look at the upcoming #Angular standalone migration schematics. We will use them to convert a simple module-based application to standalone components.

Kevin Kreuzer

16.02.2023

4m 22s

First look at Analog JS

First look at Analog JS

Let's check out Analog.

Kevin Kreuzer

09.02.2023

2h 12m 44s

Angular & tRPC

Angular & tRPC

Do you want maximum type safety accross the entire stack? Let's talk about Angular & tRPC.

Kevin Kreuzer

16.01.2023

7m 58s

Is bun fun?

Is bun fun?

Recently I tried out bun on my Twitch stream. Here's a summary of my experience with bun.

Kevin Kreuzer

05.01.2023

5m 48s

Angular inject

Angular inject

Angular 14 introduced many great features. One of them is the inject function. Well, the inject function is actually already available since v9 but now with v14 it's way more powerful, let's take a look.

Kevin Kreuzer

29.06.2022

9m 18s

Lazy loading standalone components in Angular

Lazy loading standalone components in Angular

In this video we will learn how to lazy load a standalone component.

Kevin Kreuzer

11.05.2022

3m 21s

Generating standalone components in Angular 14

Generating standalone components in Angular 14

In this video, we will leverage the power of Angular schematics to generate and use a standalone component in Angular.

Kevin Kreuzer

10.05.2022

1m 49s

Bootstrapping standalone components in Angular 14

Bootstrapping standalone components in Angular 14

In this video, we will take an early look at Angular's new upcoming standalone components feature. We will learn how to create a standalone component and how to bootstrap them.

Kevin Kreuzer

09.05.2022

2m 44s

RxJS Higher order mapping operators explained differently

RxJS Higher order mapping operators explained differently

Higher-order mapping operators are one of the most powerful features in RxJs. In this video, we will explore them from a different angle. We will use a demo application that drops balls on click to explain switchMap, concatMap, exhaustMap and mergeMap.

Kevin Kreuzer

03.05.2022

5m 16s

Native Shadow DOM vs Angular's Emulated Shadow DOM

Native Shadow DOM vs Angular's Emulated Shadow DOM

In Angular, components styles can be encapsulated. There are three different encapsulation strategies available. None, Emulated and ShadowDom.

Kevin Kreuzer

20.04.2022

4m 19s

How to implement Angular component harnesses

How to implement Angular component harnesses

Never heard of component harnesses? Check out this video - https://www.youtube.com/watch?v=UFT4vPKZ9TY

Kevin Kreuzer

08.04.2022

19m 8s

The best way to test your Angular Material components

The best way to test your Angular Material components

This tutorial shows you the traditional way of testing Angular Material components and shows you the downsides of this approach. Then it will show you how to improve your test by leveraging Angular Materials Component Harness. At the end of this tutorial, you will have all the understanding and all the tools to test your Angular Material components in the best way possible.

Kevin Kreuzer

05.04.2022

12m 53s

Generate lazy loaded features in Angular

Generate lazy loaded features in Angular

Angular schematics are very awesome. They allow us to scaffold various parts of our angular application. In this video, we will explore a very powerful schematic command that allows you to generate lazy-loaded feature modules.

Kevin Kreuzer

16.03.2022

4m 9s

Let's talk about open source - Google Dev library interview

Let's talk about open source - Google Dev library interview

In this interview, I had the chance to talk to the great Sebastian Trzcinski-Clément. We talked about my journey in programming, my open source contributions, and general tips and tricks on how to improve your career as a developer.

Kevin Kreuzer

08.03.2022

18m 29s

How to unsubscribe from Observables in Angular

How to unsubscribe from Observables in Angular

How to create a memory leak in Angular:

Kevin Kreuzer

08.03.2022

4m 10s

RxJs finalize operator explained

RxJs finalize operator explained

The finalize operator is a very handy operator to perform side effects or tear-down logic. Learn how to use it and apply it in your project.

Kevin Kreuzer

01.03.2022

2m 43s

How to implement a Nest JS backend with an Angular frontend

How to implement a Nest JS backend with an Angular frontend

Nest JS is the perfect backend for Angular developers. In this video, you will learn how to create a REST endpoint with Nest JS and display the data in an Angular frontend.

Kevin Kreuzer

23.02.2022

19m 21s

How to log error and complete emissions on RxJs tap

How to log error and complete emissions on RxJs tap

The RxJS tap operator is a very handy operator for debugging or performing side effects. Most people only ever pass the next handler as a callback to the tap operator. But the tap operator is also capable of logging errors and complete statements.

Kevin Kreuzer

16.02.2022

2m 26s

JavaScript Object destructuring

JavaScript Object destructuring

Object destructuring is a very nice technique to extract values from an object into constants. Furthermore, it offers other great features like mapping or default values. In this video, we will learn all the basics you need to successfully start using object destructuring in your projects.

Kevin Kreuzer

09.02.2022

4m 38s

Javascript array destructuring

Javascript array destructuring

This video shows you everything you need to know about array restructuring. Watch it and start using restructuring in your project today!

Kevin Kreuzer

03.02.2022

5m 42s

Angular extended Diagnostics

Angular extended Diagnostics

In the latest Angular release (v13.2.0) there's a great new feature added to the Angular compiler. It's called extended diagnostics. Let's have a closer look.

Kevin Kreuzer

01.02.2022

10m 57s

Marble testing with RxJS testing utils

Marble testing with RxJS testing utils

Once you start your path to master Observables, the chances are high that you already encountered a marble diagram on your way.

Kevin Kreuzer

26.01.2022

7m 17s

How to test your Angular Material components

How to test your Angular Material components

This tutorial shows you the traditional way of testing Angular Material components and shows you the downsides of this approach. Then it will show you how to improve your test by leveraging Angular Materials Component Harness. At the end of this tutorial, you will have all the understanding and all the tools to test your Angular Material components in the best way possible.

Kevin Kreuzer

25.01.2022

12m 53s

JavaScript Block scope vs Function scope

JavaScript Block scope vs Function scope

In this video, we will explore the difference between JavaScript block scope and function scope. Furthermore, we will learn which scopes var, let and const declarations have.

Kevin Kreuzer

19.01.2022

1m 45s

Improved Jest debugging experience in Angular

Improved Jest debugging experience in Angular

Jest is user-friendly, has a great command-line interface, and most importantly it's fast. Jest is fast because doesn't have to spin up a browser but instead runs its tests against a virtual DOM. The virtual DOM has many advantages but it also makes debugging Angular components harder. In this video, I am going to show you a nice tip on how to improve your debugging experience with Jest while writing Angular component tests.

Kevin Kreuzer

12.01.2022

5m 35s

My three favourite ng serve options in Angular

My three favourite ng serve options in Angular

Ng serve is one of the most used CLI commands. In starts a dev server and serves our application. In this video I will share with you my three favourite ng serve options.

Kevin Kreuzer

11.12.2021

2m 53s

Angulars Input & HostBinding explained

Angulars Input & HostBinding explained

Input and Hostbinding are two great Angular features. In this video, I will show you how you can combine them to create readable and powerful features.

Kevin Kreuzer

29.11.2021

2m 13s

Angular's HostListener & HostBinding explained

Angular's HostListener & HostBinding explained

HostListener and HostBinding are very cool Angular features that allow you to either bind values to the Host or to listen to Events on the Host. In this video, we will take a closer look at both features by looking at a real-world use case. We will learn how to apply them so that you can use them on your daily work.

Kevin Kreuzer

08.11.2021

4m 47s

TypeScript Mapped types explained

TypeScript Mapped types explained

Mapped types are a great way of transforming existing types into new types. In this video tutorial, you will learn how to create mapped types and how to leverage mapped types in your project to transform read-only interfaces into interfaces with optional properties or even how to transform a simple interface into a type that defines getters.

Kevin Kreuzer

22.09.2021

6m 58s

Typescript's keyof explained

Typescript's keyof explained

In this video tutorial, we will explore Typescripts keyof operator. We will learn what keyof does and how it can make our code more robust and easier to refactor.

Kevin Kreuzer

30.08.2021

3m 58s

Angular structural directives

Angular structural directives

In this video, we will explore the Angular magic behind the * (asterisk). We will explore structural directives in detail and implement our own ngIf.

Kevin Kreuzer

22.06.2021

5m 45s

ng content vs ng template

ng content vs ng template

ng-content and ng-template are two fundamental concepts to create reusable and flexible components in #Angular.

Kevin Kreuzer

28.04.2021

5m 26s

Here's everything you should know when creating reusable and flexible components in Angular

Here's everything you should know when creating reusable and flexible components in Angular

Here’s what you should know when creating flexible and reusable components in Angular

Kevin Kreuzer

11.04.2021

19m 31s

The best way to test your Angular Material components

The best way to test your Angular Material components

This tutorial shows you the traditional way of testing Angular Material components and shows you the downsides of this approach. Then it will show you how to improve your test by leveraging Angular Materials Component Harness. At the end of this tutorial, you will have all the understanding and all the tools to test your Angular Material components in the best way possible.

Kevin Kreuzer

07.04.2021

12m 54s

Build your own icon library in Angular part 4/4

Build your own icon library in Angular part 4/4

In this final episode, we are going to implement a single-page application. We pull together everything that we build in the previous steps. We will import the icons from our icon lib, register them and use the component provided by the adapter to render them. Finally, we use the webpack bundle analyzer to take a look at the resulting bundle.

Kevin Kreuzer

10.03.2021

9m 44s

Build your own icon library in Angular part 3/4

Build your own icon library in Angular part 3/4

In this part, we are building the Angular adapter for the icons. We will use the Angular CLI to scaffold a brand new Angular library. Next, we will use the svg-icons-builder schematics to create our Angular adapter. Once we explored the generated code, we will publish the library to npm.

Kevin Kreuzer

10.03.2021

5m 45s

Build your own icon library in Angular part 2/4

Build your own icon library in Angular part 2/4

In this part, we start to implement the framework-agnostic icon library with the help of svg-icon-library-starter and svg-to-ts. We will take a bunch of raw SVG icons and deliver them as code. Additionally, we create with the help of svg-to-ts the correct declaration files, types, and interfaces.

Kevin Kreuzer

10.03.2021

9m 38s

Build your own icon library in Angular part 1/4

Build your own icon library in Angular part 1/4

In this part, we will first explore how FontAwesome delivers their SVG icons library. We will then visualize their concept and show you which OpenSource tools support you in building your own tree-shakable icon library.

Kevin Kreuzer

10.03.2021

4m 50s

BärnerJS #5 2021 - Tomas Trajan - The Best Way To Architect Your Angular Libraries

BärnerJS #5 2021 - Tomas Trajan - The Best Way To Architect Your Angular Libraries

https://www.meetup.com/de-DE/Barner-JS-Talks/events/280067964/

Tomas Trajan

06.09.2021

37m 12s

Microfrontends with Angular Elements, the future of Angular, Minko Gechev QnA | #AngularMinsk #16

Microfrontends with Angular Elements, the future of Angular, Minko Gechev QnA | #AngularMinsk #16

🤔 Interested learning more about Angular?

Tomas Trajan

16.07.2020

1h 32m 26s

AngularAir - How to architect epic Angular app in less than 10 minutes! ⏱️😅

AngularAir - How to architect epic Angular app in less than 10 minutes! ⏱️😅

Tomas Trajan joins us to go over approaches we can take when planning the architecture of our Angular applications.

Tomas Trajan

11.03.2020

1h 30s

Leverage Angular Schematics to Empower Frontend Apps & Libraries | Tomas Trajan | NG-MY 2019

Leverage Angular Schematics to Empower Frontend Apps & Libraries | Tomas Trajan | NG-MY 2019

***There are some technical issues when recording this video, some live coding demo is missing. Alternatively, you may watch here https://www.youtube.com/watch?v=eFzjY4uWgCA which Tomas did a similar talk in another conference. Sorry for inconvenient! ***

Tomas Trajan

29.08.2019

27m 48s

How to use Angular Schematics to empower Developers of Frontend Apps & Libraries by Tomas Trajan

How to use Angular Schematics to empower Developers of Frontend Apps & Libraries by Tomas Trajan

In development, we often want to extract reusable parts of logic into self contained libraries. Modern tooling provided by Angular CLI enables us to provide amazing developer experience for the users of our libraries.

Tomas Trajan

25.02.2019

1h 17m 33s

The best way to lazy load Angular Elements or any other web components in your Angular application!

The best way to lazy load Angular Elements or any other web components in your Angular application!

Library: https://angular-extensions.github.io/elements

Tomas Trajan

17.08.2019

14m 44s

[VDZ19] How to leverage Angular Schematics to empower Devs of Frontend Apps & Libraries by T. Trajan

[VDZ19] How to leverage Angular Schematics to empower Devs of Frontend Apps & Libraries by T. Trajan

How to leverage Angular Schematics to empower Developers of Enterprise Frontend Apps & Libraries [live coding]

Tomas Trajan

26.03.2019

49m 42s

Angular Anti-Patterns in projects of the large enterprise organization - @tomastrajan - Die Mobiliar

Angular Anti-Patterns in projects of the large enterprise organization - @tomastrajan - Die Mobiliar

Large enterprise organizations have to deal with challenges that are different when compared to a single team building a single Angular application. The environment is often complex with multiple temas and hundreds of developers working on tens of applications an libraries over many years. Changing requirements and the need to support life-cycle of used technologies makes this environment even more complex.

Tomas Trajan

01.03.2019

31m 35s

Total Guide to Angular Material Custom Themes by Tomas Trajan

Total Guide to Angular Material Custom Themes by Tomas Trajan

Description:

Tomas Trajan

31.08.2017

1h 7m 58s

Bärner JS Talks - Proper unit-testing of Angular JS 1.X apps with ES6 modules - Tomas Herich

Bärner JS Talks - Proper unit-testing of Angular JS 1.X apps with ES6 modules - Tomas Herich

Standard way of testing of Angular JS 1.X app is using “official” Karma / Jasmine solution, which uses a lot of Angular specific APIs. Let’s explore how can we implement our unit-tests independently from Angular with help of (ES6) modules and Mocha.

Tomas Trajan

27.11.2015

28m 50s

Stärken Sie Ihr Team mit unserer umfassenden Erfahrung

Unsere Angular Experten haben viele Jahre damit verbracht, Unternehmen und Startups zu beraten, Workshops und Tutorials zu leiten und umfangreiche Open-Source-Ressourcen zu pflegen. Wir sind sehr stolz auf unsere Erfahrung im Bereich des modernen Frontends und würden uns freuen auch Ihrem Unternehmen zum Aufschwung zu verhelfen.