Muhammad Ahsan Ayaz

Angular <> Angular CDK - Awesomeness Combined

Need powerful UI features without the rigid styles of a component library? Learn how the Angular CDK gives you the best of both worlds.

Angular <> Angular CDK - Awesomeness Combined
#1about 5 minutes

Understanding Angular as a complete development platform

Angular is a comprehensive platform with a rich ecosystem of tools for building scalable web, mobile, and desktop applications.

#2about 5 minutes

The challenge of choosing a UI library

Using pre-built UI libraries like Bootstrap offers functionality but forces default styles, while building from scratch requires reinventing common components.

#3about 5 minutes

Getting started with the Angular CDK

The Angular CDK provides unstyled, accessible, and high-performance UI behaviors, allowing you to build custom component libraries without the boilerplate.

#4about 6 minutes

Optimizing large lists with virtual scrolling

Use the CDK's virtual scroll to render only the visible items in a list, significantly improving performance by reducing the number of DOM elements.

#5about 3 minutes

Implementing drag and drop for lists

The CDK's drag and drop module simplifies creating interactive lists where users can reorder items or move them between containers.

#6about 3 minutes

Adding keyboard navigation with ListKeyManager

Improve accessibility by using the ListKeyManager to easily add keyboard navigation and focus management to custom list components.

#7about 3 minutes

Building multi-step wizards with the stepper API

The CDK Stepper API allows you to break down complex forms or processes into a simple, guided, multi-step wizard experience.

#8about 5 minutes

Building dynamic popovers with the overlay API

The CDK Overlay API provides a powerful way to render floating panels like dialogs and tooltips with intelligent, dynamic positioning.

#9about 2 minutes

Handling responsive item sizes in virtual scroll

When using virtual scroll with responsive items, provide a consistent or maximum item size to ensure the CDK renders a sufficient buffer of elements.

Related jobs
Jobs that call for the skills explored in this talk.

Angular Developer

Picnic Technologies B.V.
Amsterdam, Netherlands

Intermediate
Senior

Featured Partners

Related Videos

See all videos
Angular Features You Should be Using36:22

Angular Features You Should be Using

Sani Yusuf

Angular Magical directives29:11

Angular Magical directives

Valentine Awe

The Microfrontend Revolution- Using Webpack 5 Module Federation with Angular33:18

The Microfrontend Revolution- Using Webpack 5 Module Federation with Angular

Manfred Steyer

State of Angular41:34

State of Angular

Jessica Janiuk

Extending HTML with Web Components41:54

Extending HTML with Web Components

Rowdy Rabouw

Angular tips/tricks you can use from tomorrow on50:28

Angular tips/tricks you can use from tomorrow on

Benedikt Starzengruber

Angular Unleashed: Mastering Modern Web Development with Angular58:56

Angular Unleashed: Mastering Modern Web Development with Angular

Indu Chaube

On tour with heroes == Moving from Angular to WebComponents43:08

On tour with heroes == Moving from Angular to WebComponents

Benjamin Glusa

From learning to earning

Jobs that call for the skills explored in this talk.

Angular Developer

Identify Solutions
Cardiff, United Kingdom

Remote
€50-55K
Angular
TypeScript