Angular Material Masterclass & FREE E-Book

  • Course provided by Udemy
  • Study type: Online
  • Starts: Anytime
  • Price: See latest price on Udemy
Udemy

Course Description

This Course In a Nutshell (includes the Typescript Jumpstart Ebook)

Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets.

Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations).

The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite.

Course Overview

We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons.

The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component.

We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more.

At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme.

What Will You be able to do at the End Of This Course?

You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box.

You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls.

You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material.

Have a look at the course free lessons below, and please enjoy the course!

Who this course is for:

  • Developers looking to get in-depth knowledge on the Angular Material Library

Instructor

Best Selling Angular Courses | 100k+ students | 16 courses
  • 4.5 Instructor Rating
  • 18,736 Reviews
  • 114,070 Students
  • 17 Courses

Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University.

Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies.

Check out my Linkedin in the links section on the top right.

About the Angular University:

The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style.

No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you.

More about me:

I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years.

I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers.

I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor,

Kind Regards,

Vasco

Expected Outcomes

  1. Code in Github repository with downloadable ZIP files per section Learn how to use the Angular Material Widget Library Learn how to setup the Navigation Menu of your Angular Material Application Learn how to use the most commonly needed Angular Material Form Widgets Master the Angular Material Data Table, learn server-side Pagination, Sorting and Filtering Learn how to build Angular Material Custom Dialogs Learn how to build an Angular Material Custom Theme Curated for the Udemy Business collection Course content 6 sections • 36 lectures • 2h 59m total length Expand all sections Introduction 5 lectures • 17min Angular Material Course Helicopter View Preview 04:01 IMPORTANT - Recommended Software Versions 00:14 The Typescript Jumpstart Ebook 03:27 Angular Material Course Kickoff - Install Node, NPM, IDE, Lessons Code Preview 03:40 Angular Material Hello World Preview 05:35 Angular Material Navigation And Containers 5 lectures • 31min Navigation and Containers - Section Introduction 05:43 Material Icon Component - Styling Angular Components Preview 07:21 Material Dropdown Navigation Menu - Step-by-Step Implementation 03:57 Container Components - Tab Containers and Material Cards 08:14 The Material SideNav Navigation Menu 05:17 Angular Material Data Table 13 lectures • 1hr 16min Data Table New Section Introduction -Server Pagination, Sorting and Filtering 06:34 Material Data Table Column Definition - matCellDef and matHeaderCellDef Preview 05:37 Material Data Table Up and Running - Data Source and Custom Look and Feel 08:33 Material Data Table Client-Side Filtering with MatTableDataSource 04:16 Angular Material Custom Data Source - Initial Implementation 04:28 Angular Material Data Source - Loading Data From The Backend 05:41 Custom Data Source - Error Handling and Server Data Demo 05:02 Material Data Table Server Side Pagination 07:21 Material Data Table Loading Indicator 04:47 Angular Expression has Changed Error - Debugging and Explanation 06:29 How to Fix ExpressionChangedAfterItHasBeenCheckedError 03:09 Material Data Table Server-Side Sorting 07:53 Material Data Table Server-Side Filtering 05:45 Material Dialog + Form Components 7 lectures • 31min New Section Kickoff - Material Dialog and Form Components 02:08 Angular Material Dialog - Passing Input Data Preview 05:43 Receiving Input Data Inside the Material Dialog 03:30 Material Dialog Body Implementation 06:30 Angular Material Select Box 03:55 Angular Material DatePicker with MomentJs Integration 04:40 Dialog Section Conclusion - Sending Dialog Output Data 04:09 Angular Material Custom Theme + Angular CLI Sass Support 3 lectures • 20min Angular Material Custom Theme - Building Our Own Theme Using Sass Preview 08:45 Angular Material Custom Theme - Dark Themes 06:27 Angular Material Custom Theme - Defining a custom Palette 04:26 Course Conclusion 3 lectures • 6min Other Courses 02:17 Bonus Lecture 01:30 Angular Material Course Conclusion and Key Takeaways 02:18 Requirements Just some previous knowledge of Angular and Typescript Description This Course In a Nutshell ( includes the Typescript Jumpstart Ebook ) Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets. Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations ). The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite. Course Overview We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons. The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component. We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more. At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme. What Will You be able to do at the End Of This Course? You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box. You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls. You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material. Have a look at the course free lessons below, and please enjoy the course! Who this course is for: Developers looking to get in-depth knowledge on the Angular Material Library Show more Show less Instructor Angular University Best Selling Angular Courses | 100k+ students | 16 courses 4.5 Instructor Rating 18,736 Reviews 114,070 Students 17 Courses Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University. Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies. Check out my Linkedin in the links section on the top right. About the Angular University: The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style. No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you. More about me: I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years. I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor, Kind Regards, Vasco Show more Show less Udemy Business Teach on Udemy Get the app About us Contact us Careers Blog Help and Support Affiliate Impressum Kontakt Terms Privacy policy Cookie settings Sitemap © 2021 Udemy, Inc. window.handleCSSToggleButtonClick = function (event) { var target = event.currentTarget; var cssToggleId = target && target.dataset && target.dataset.cssToggleId; var input = cssToggleId && document.getElementById(cssToggleId); if (input) { if (input.dataset.type === 'checkbox') { input.dataset.checked = input.dataset.checked ? '' : 'checked'; } else { input.dataset.checked = input.dataset.allowToggle && input.dataset.checked ? '' : 'checked'; var radios = document.querySelectorAll('[name="' + input.dataset.name + '"]'); for (var i = 0; i (function(){window['__CF$cv$params']={r:'6777896f3c66069e',m:'86bd0dde9aef5711dd9552d9dee201e72dc64874-1627741955-1800-ARSuwwMgus6WKF1PVOooRGg5P5r+/ipmF/HJrQxLcmByLU4eT8/T6qJbQOfwqSjf2GVvxxmuLysgcBojtLDWHsXPcHsbqC0GKdv2PEDX7vOpGHHRR0BMcvXrglmg64StIjzlfMW3K5EQw/wuM04cLyWX/Z/MD7DDAjlCvXyaKvEJ',s:[0x5a2e42fa80,0x6e0d54cdf4],}})();
  2. Learn how to use the Angular Material Widget Library Learn how to setup the Navigation Menu of your Angular Material Application Learn how to use the most commonly needed Angular Material Form Widgets Master the Angular Material Data Table, learn server-side Pagination, Sorting and Filtering Learn how to build Angular Material Custom Dialogs Learn how to build an Angular Material Custom Theme Curated for the Udemy Business collection Course content 6 sections • 36 lectures • 2h 59m total length Expand all sections Introduction 5 lectures • 17min Angular Material Course Helicopter View Preview 04:01 IMPORTANT - Recommended Software Versions 00:14 The Typescript Jumpstart Ebook 03:27 Angular Material Course Kickoff - Install Node, NPM, IDE, Lessons Code Preview 03:40 Angular Material Hello World Preview 05:35 Angular Material Navigation And Containers 5 lectures • 31min Navigation and Containers - Section Introduction 05:43 Material Icon Component - Styling Angular Components Preview 07:21 Material Dropdown Navigation Menu - Step-by-Step Implementation 03:57 Container Components - Tab Containers and Material Cards 08:14 The Material SideNav Navigation Menu 05:17 Angular Material Data Table 13 lectures • 1hr 16min Data Table New Section Introduction -Server Pagination, Sorting and Filtering 06:34 Material Data Table Column Definition - matCellDef and matHeaderCellDef Preview 05:37 Material Data Table Up and Running - Data Source and Custom Look and Feel 08:33 Material Data Table Client-Side Filtering with MatTableDataSource 04:16 Angular Material Custom Data Source - Initial Implementation 04:28 Angular Material Data Source - Loading Data From The Backend 05:41 Custom Data Source - Error Handling and Server Data Demo 05:02 Material Data Table Server Side Pagination 07:21 Material Data Table Loading Indicator 04:47 Angular Expression has Changed Error - Debugging and Explanation 06:29 How to Fix ExpressionChangedAfterItHasBeenCheckedError 03:09 Material Data Table Server-Side Sorting 07:53 Material Data Table Server-Side Filtering 05:45 Material Dialog + Form Components 7 lectures • 31min New Section Kickoff - Material Dialog and Form Components 02:08 Angular Material Dialog - Passing Input Data Preview 05:43 Receiving Input Data Inside the Material Dialog 03:30 Material Dialog Body Implementation 06:30 Angular Material Select Box 03:55 Angular Material DatePicker with MomentJs Integration 04:40 Dialog Section Conclusion - Sending Dialog Output Data 04:09 Angular Material Custom Theme + Angular CLI Sass Support 3 lectures • 20min Angular Material Custom Theme - Building Our Own Theme Using Sass Preview 08:45 Angular Material Custom Theme - Dark Themes 06:27 Angular Material Custom Theme - Defining a custom Palette 04:26 Course Conclusion 3 lectures • 6min Other Courses 02:17 Bonus Lecture 01:30 Angular Material Course Conclusion and Key Takeaways 02:18 Requirements Just some previous knowledge of Angular and Typescript Description This Course In a Nutshell ( includes the Typescript Jumpstart Ebook ) Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets. Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations ). The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite. Course Overview We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons. The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component. We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more. At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme. What Will You be able to do at the End Of This Course? You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box. You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls. You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material. Have a look at the course free lessons below, and please enjoy the course! Who this course is for: Developers looking to get in-depth knowledge on the Angular Material Library Show more Show less Instructor Angular University Best Selling Angular Courses | 100k+ students | 16 courses 4.5 Instructor Rating 18,736 Reviews 114,070 Students 17 Courses Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University. Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies. Check out my Linkedin in the links section on the top right. About the Angular University: The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style. No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you. More about me: I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years. I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor, Kind Regards, Vasco Show more Show less Udemy Business Teach on Udemy Get the app About us Contact us Careers Blog Help and Support Affiliate Impressum Kontakt Terms Privacy policy Cookie settings Sitemap © 2021 Udemy, Inc. window.handleCSSToggleButtonClick = function (event) { var target = event.currentTarget; var cssToggleId = target && target.dataset && target.dataset.cssToggleId; var input = cssToggleId && document.getElementById(cssToggleId); if (input) { if (input.dataset.type === 'checkbox') { input.dataset.checked = input.dataset.checked ? '' : 'checked'; } else { input.dataset.checked = input.dataset.allowToggle && input.dataset.checked ? '' : 'checked'; var radios = document.querySelectorAll('[name="' + input.dataset.name + '"]'); for (var i = 0; i (function(){window['__CF$cv$params']={r:'6777896f3c66069e',m:'86bd0dde9aef5711dd9552d9dee201e72dc64874-1627741955-1800-ARSuwwMgus6WKF1PVOooRGg5P5r+/ipmF/HJrQxLcmByLU4eT8/T6qJbQOfwqSjf2GVvxxmuLysgcBojtLDWHsXPcHsbqC0GKdv2PEDX7vOpGHHRR0BMcvXrglmg64StIjzlfMW3K5EQw/wuM04cLyWX/Z/MD7DDAjlCvXyaKvEJ',s:[0x5a2e42fa80,0x6e0d54cdf4],}})();
  3. Learn how to setup the Navigation Menu of your Angular Material Application Learn how to use the most commonly needed Angular Material Form Widgets Master the Angular Material Data Table, learn server-side Pagination, Sorting and Filtering Learn how to build Angular Material Custom Dialogs Learn how to build an Angular Material Custom Theme Curated for the Udemy Business collection Course content 6 sections • 36 lectures • 2h 59m total length Expand all sections Introduction 5 lectures • 17min Angular Material Course Helicopter View Preview 04:01 IMPORTANT - Recommended Software Versions 00:14 The Typescript Jumpstart Ebook 03:27 Angular Material Course Kickoff - Install Node, NPM, IDE, Lessons Code Preview 03:40 Angular Material Hello World Preview 05:35 Angular Material Navigation And Containers 5 lectures • 31min Navigation and Containers - Section Introduction 05:43 Material Icon Component - Styling Angular Components Preview 07:21 Material Dropdown Navigation Menu - Step-by-Step Implementation 03:57 Container Components - Tab Containers and Material Cards 08:14 The Material SideNav Navigation Menu 05:17 Angular Material Data Table 13 lectures • 1hr 16min Data Table New Section Introduction -Server Pagination, Sorting and Filtering 06:34 Material Data Table Column Definition - matCellDef and matHeaderCellDef Preview 05:37 Material Data Table Up and Running - Data Source and Custom Look and Feel 08:33 Material Data Table Client-Side Filtering with MatTableDataSource 04:16 Angular Material Custom Data Source - Initial Implementation 04:28 Angular Material Data Source - Loading Data From The Backend 05:41 Custom Data Source - Error Handling and Server Data Demo 05:02 Material Data Table Server Side Pagination 07:21 Material Data Table Loading Indicator 04:47 Angular Expression has Changed Error - Debugging and Explanation 06:29 How to Fix ExpressionChangedAfterItHasBeenCheckedError 03:09 Material Data Table Server-Side Sorting 07:53 Material Data Table Server-Side Filtering 05:45 Material Dialog + Form Components 7 lectures • 31min New Section Kickoff - Material Dialog and Form Components 02:08 Angular Material Dialog - Passing Input Data Preview 05:43 Receiving Input Data Inside the Material Dialog 03:30 Material Dialog Body Implementation 06:30 Angular Material Select Box 03:55 Angular Material DatePicker with MomentJs Integration 04:40 Dialog Section Conclusion - Sending Dialog Output Data 04:09 Angular Material Custom Theme + Angular CLI Sass Support 3 lectures • 20min Angular Material Custom Theme - Building Our Own Theme Using Sass Preview 08:45 Angular Material Custom Theme - Dark Themes 06:27 Angular Material Custom Theme - Defining a custom Palette 04:26 Course Conclusion 3 lectures • 6min Other Courses 02:17 Bonus Lecture 01:30 Angular Material Course Conclusion and Key Takeaways 02:18 Requirements Just some previous knowledge of Angular and Typescript Description This Course In a Nutshell ( includes the Typescript Jumpstart Ebook ) Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets. Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations ). The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite. Course Overview We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons. The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component. We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more. At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme. What Will You be able to do at the End Of This Course? You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box. You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls. You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material. Have a look at the course free lessons below, and please enjoy the course! Who this course is for: Developers looking to get in-depth knowledge on the Angular Material Library Show more Show less Instructor Angular University Best Selling Angular Courses | 100k+ students | 16 courses 4.5 Instructor Rating 18,736 Reviews 114,070 Students 17 Courses Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University. Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies. Check out my Linkedin in the links section on the top right. About the Angular University: The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style. No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you. More about me: I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years. I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor, Kind Regards, Vasco Show more Show less Udemy Business Teach on Udemy Get the app About us Contact us Careers Blog Help and Support Affiliate Impressum Kontakt Terms Privacy policy Cookie settings Sitemap © 2021 Udemy, Inc. window.handleCSSToggleButtonClick = function (event) { var target = event.currentTarget; var cssToggleId = target && target.dataset && target.dataset.cssToggleId; var input = cssToggleId && document.getElementById(cssToggleId); if (input) { if (input.dataset.type === 'checkbox') { input.dataset.checked = input.dataset.checked ? '' : 'checked'; } else { input.dataset.checked = input.dataset.allowToggle && input.dataset.checked ? '' : 'checked'; var radios = document.querySelectorAll('[name="' + input.dataset.name + '"]'); for (var i = 0; i (function(){window['__CF$cv$params']={r:'6777896f3c66069e',m:'86bd0dde9aef5711dd9552d9dee201e72dc64874-1627741955-1800-ARSuwwMgus6WKF1PVOooRGg5P5r+/ipmF/HJrQxLcmByLU4eT8/T6qJbQOfwqSjf2GVvxxmuLysgcBojtLDWHsXPcHsbqC0GKdv2PEDX7vOpGHHRR0BMcvXrglmg64StIjzlfMW3K5EQw/wuM04cLyWX/Z/MD7DDAjlCvXyaKvEJ',s:[0x5a2e42fa80,0x6e0d54cdf4],}})();
  4. Learn how to use the most commonly needed Angular Material Form Widgets Master the Angular Material Data Table, learn server-side Pagination, Sorting and Filtering Learn how to build Angular Material Custom Dialogs Learn how to build an Angular Material Custom Theme Curated for the Udemy Business collection Course content 6 sections • 36 lectures • 2h 59m total length Expand all sections Introduction 5 lectures • 17min Angular Material Course Helicopter View Preview 04:01 IMPORTANT - Recommended Software Versions 00:14 The Typescript Jumpstart Ebook 03:27 Angular Material Course Kickoff - Install Node, NPM, IDE, Lessons Code Preview 03:40 Angular Material Hello World Preview 05:35 Angular Material Navigation And Containers 5 lectures • 31min Navigation and Containers - Section Introduction 05:43 Material Icon Component - Styling Angular Components Preview 07:21 Material Dropdown Navigation Menu - Step-by-Step Implementation 03:57 Container Components - Tab Containers and Material Cards 08:14 The Material SideNav Navigation Menu 05:17 Angular Material Data Table 13 lectures • 1hr 16min Data Table New Section Introduction -Server Pagination, Sorting and Filtering 06:34 Material Data Table Column Definition - matCellDef and matHeaderCellDef Preview 05:37 Material Data Table Up and Running - Data Source and Custom Look and Feel 08:33 Material Data Table Client-Side Filtering with MatTableDataSource 04:16 Angular Material Custom Data Source - Initial Implementation 04:28 Angular Material Data Source - Loading Data From The Backend 05:41 Custom Data Source - Error Handling and Server Data Demo 05:02 Material Data Table Server Side Pagination 07:21 Material Data Table Loading Indicator 04:47 Angular Expression has Changed Error - Debugging and Explanation 06:29 How to Fix ExpressionChangedAfterItHasBeenCheckedError 03:09 Material Data Table Server-Side Sorting 07:53 Material Data Table Server-Side Filtering 05:45 Material Dialog + Form Components 7 lectures • 31min New Section Kickoff - Material Dialog and Form Components 02:08 Angular Material Dialog - Passing Input Data Preview 05:43 Receiving Input Data Inside the Material Dialog 03:30 Material Dialog Body Implementation 06:30 Angular Material Select Box 03:55 Angular Material DatePicker with MomentJs Integration 04:40 Dialog Section Conclusion - Sending Dialog Output Data 04:09 Angular Material Custom Theme + Angular CLI Sass Support 3 lectures • 20min Angular Material Custom Theme - Building Our Own Theme Using Sass Preview 08:45 Angular Material Custom Theme - Dark Themes 06:27 Angular Material Custom Theme - Defining a custom Palette 04:26 Course Conclusion 3 lectures • 6min Other Courses 02:17 Bonus Lecture 01:30 Angular Material Course Conclusion and Key Takeaways 02:18 Requirements Just some previous knowledge of Angular and Typescript Description This Course In a Nutshell ( includes the Typescript Jumpstart Ebook ) Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets. Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations ). The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite. Course Overview We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons. The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component. We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more. At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme. What Will You be able to do at the End Of This Course? You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box. You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls. You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material. Have a look at the course free lessons below, and please enjoy the course! Who this course is for: Developers looking to get in-depth knowledge on the Angular Material Library Show more Show less Instructor Angular University Best Selling Angular Courses | 100k+ students | 16 courses 4.5 Instructor Rating 18,736 Reviews 114,070 Students 17 Courses Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University. Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies. Check out my Linkedin in the links section on the top right. About the Angular University: The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style. No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you. More about me: I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years. I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor, Kind Regards, Vasco Show more Show less Udemy Business Teach on Udemy Get the app About us Contact us Careers Blog Help and Support Affiliate Impressum Kontakt Terms Privacy policy Cookie settings Sitemap © 2021 Udemy, Inc. window.handleCSSToggleButtonClick = function (event) { var target = event.currentTarget; var cssToggleId = target && target.dataset && target.dataset.cssToggleId; var input = cssToggleId && document.getElementById(cssToggleId); if (input) { if (input.dataset.type === 'checkbox') { input.dataset.checked = input.dataset.checked ? '' : 'checked'; } else { input.dataset.checked = input.dataset.allowToggle && input.dataset.checked ? '' : 'checked'; var radios = document.querySelectorAll('[name="' + input.dataset.name + '"]'); for (var i = 0; i (function(){window['__CF$cv$params']={r:'6777896f3c66069e',m:'86bd0dde9aef5711dd9552d9dee201e72dc64874-1627741955-1800-ARSuwwMgus6WKF1PVOooRGg5P5r+/ipmF/HJrQxLcmByLU4eT8/T6qJbQOfwqSjf2GVvxxmuLysgcBojtLDWHsXPcHsbqC0GKdv2PEDX7vOpGHHRR0BMcvXrglmg64StIjzlfMW3K5EQw/wuM04cLyWX/Z/MD7DDAjlCvXyaKvEJ',s:[0x5a2e42fa80,0x6e0d54cdf4],}})();
  5. Master the Angular Material Data Table, learn server-side Pagination, Sorting and Filtering Learn how to build Angular Material Custom Dialogs Learn how to build an Angular Material Custom Theme Curated for the Udemy Business collection Course content 6 sections • 36 lectures • 2h 59m total length Expand all sections Introduction 5 lectures • 17min Angular Material Course Helicopter View Preview 04:01 IMPORTANT - Recommended Software Versions 00:14 The Typescript Jumpstart Ebook 03:27 Angular Material Course Kickoff - Install Node, NPM, IDE, Lessons Code Preview 03:40 Angular Material Hello World Preview 05:35 Angular Material Navigation And Containers 5 lectures • 31min Navigation and Containers - Section Introduction 05:43 Material Icon Component - Styling Angular Components Preview 07:21 Material Dropdown Navigation Menu - Step-by-Step Implementation 03:57 Container Components - Tab Containers and Material Cards 08:14 The Material SideNav Navigation Menu 05:17 Angular Material Data Table 13 lectures • 1hr 16min Data Table New Section Introduction -Server Pagination, Sorting and Filtering 06:34 Material Data Table Column Definition - matCellDef and matHeaderCellDef Preview 05:37 Material Data Table Up and Running - Data Source and Custom Look and Feel 08:33 Material Data Table Client-Side Filtering with MatTableDataSource 04:16 Angular Material Custom Data Source - Initial Implementation 04:28 Angular Material Data Source - Loading Data From The Backend 05:41 Custom Data Source - Error Handling and Server Data Demo 05:02 Material Data Table Server Side Pagination 07:21 Material Data Table Loading Indicator 04:47 Angular Expression has Changed Error - Debugging and Explanation 06:29 How to Fix ExpressionChangedAfterItHasBeenCheckedError 03:09 Material Data Table Server-Side Sorting 07:53 Material Data Table Server-Side Filtering 05:45 Material Dialog + Form Components 7 lectures • 31min New Section Kickoff - Material Dialog and Form Components 02:08 Angular Material Dialog - Passing Input Data Preview 05:43 Receiving Input Data Inside the Material Dialog 03:30 Material Dialog Body Implementation 06:30 Angular Material Select Box 03:55 Angular Material DatePicker with MomentJs Integration 04:40 Dialog Section Conclusion - Sending Dialog Output Data 04:09 Angular Material Custom Theme + Angular CLI Sass Support 3 lectures • 20min Angular Material Custom Theme - Building Our Own Theme Using Sass Preview 08:45 Angular Material Custom Theme - Dark Themes 06:27 Angular Material Custom Theme - Defining a custom Palette 04:26 Course Conclusion 3 lectures • 6min Other Courses 02:17 Bonus Lecture 01:30 Angular Material Course Conclusion and Key Takeaways 02:18 Requirements Just some previous knowledge of Angular and Typescript Description This Course In a Nutshell ( includes the Typescript Jumpstart Ebook ) Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets. Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations ). The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite. Course Overview We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons. The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component. We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more. At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme. What Will You be able to do at the End Of This Course? You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box. You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls. You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material. Have a look at the course free lessons below, and please enjoy the course! Who this course is for: Developers looking to get in-depth knowledge on the Angular Material Library Show more Show less Instructor Angular University Best Selling Angular Courses | 100k+ students | 16 courses 4.5 Instructor Rating 18,736 Reviews 114,070 Students 17 Courses Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University. Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies. Check out my Linkedin in the links section on the top right. About the Angular University: The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style. No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you. More about me: I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years. I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor, Kind Regards, Vasco Show more Show less Udemy Business Teach on Udemy Get the app About us Contact us Careers Blog Help and Support Affiliate Impressum Kontakt Terms Privacy policy Cookie settings Sitemap © 2021 Udemy, Inc. window.handleCSSToggleButtonClick = function (event) { var target = event.currentTarget; var cssToggleId = target && target.dataset && target.dataset.cssToggleId; var input = cssToggleId && document.getElementById(cssToggleId); if (input) { if (input.dataset.type === 'checkbox') { input.dataset.checked = input.dataset.checked ? '' : 'checked'; } else { input.dataset.checked = input.dataset.allowToggle && input.dataset.checked ? '' : 'checked'; var radios = document.querySelectorAll('[name="' + input.dataset.name + '"]'); for (var i = 0; i (function(){window['__CF$cv$params']={r:'6777896f3c66069e',m:'86bd0dde9aef5711dd9552d9dee201e72dc64874-1627741955-1800-ARSuwwMgus6WKF1PVOooRGg5P5r+/ipmF/HJrQxLcmByLU4eT8/T6qJbQOfwqSjf2GVvxxmuLysgcBojtLDWHsXPcHsbqC0GKdv2PEDX7vOpGHHRR0BMcvXrglmg64StIjzlfMW3K5EQw/wuM04cLyWX/Z/MD7DDAjlCvXyaKvEJ',s:[0x5a2e42fa80,0x6e0d54cdf4],}})();
  6. Learn how to build Angular Material Custom Dialogs Learn how to build an Angular Material Custom Theme Curated for the Udemy Business collection Course content 6 sections • 36 lectures • 2h 59m total length Expand all sections Introduction 5 lectures • 17min Angular Material Course Helicopter View Preview 04:01 IMPORTANT - Recommended Software Versions 00:14 The Typescript Jumpstart Ebook 03:27 Angular Material Course Kickoff - Install Node, NPM, IDE, Lessons Code Preview 03:40 Angular Material Hello World Preview 05:35 Angular Material Navigation And Containers 5 lectures • 31min Navigation and Containers - Section Introduction 05:43 Material Icon Component - Styling Angular Components Preview 07:21 Material Dropdown Navigation Menu - Step-by-Step Implementation 03:57 Container Components - Tab Containers and Material Cards 08:14 The Material SideNav Navigation Menu 05:17 Angular Material Data Table 13 lectures • 1hr 16min Data Table New Section Introduction -Server Pagination, Sorting and Filtering 06:34 Material Data Table Column Definition - matCellDef and matHeaderCellDef Preview 05:37 Material Data Table Up and Running - Data Source and Custom Look and Feel 08:33 Material Data Table Client-Side Filtering with MatTableDataSource 04:16 Angular Material Custom Data Source - Initial Implementation 04:28 Angular Material Data Source - Loading Data From The Backend 05:41 Custom Data Source - Error Handling and Server Data Demo 05:02 Material Data Table Server Side Pagination 07:21 Material Data Table Loading Indicator 04:47 Angular Expression has Changed Error - Debugging and Explanation 06:29 How to Fix ExpressionChangedAfterItHasBeenCheckedError 03:09 Material Data Table Server-Side Sorting 07:53 Material Data Table Server-Side Filtering 05:45 Material Dialog + Form Components 7 lectures • 31min New Section Kickoff - Material Dialog and Form Components 02:08 Angular Material Dialog - Passing Input Data Preview 05:43 Receiving Input Data Inside the Material Dialog 03:30 Material Dialog Body Implementation 06:30 Angular Material Select Box 03:55 Angular Material DatePicker with MomentJs Integration 04:40 Dialog Section Conclusion - Sending Dialog Output Data 04:09 Angular Material Custom Theme + Angular CLI Sass Support 3 lectures • 20min Angular Material Custom Theme - Building Our Own Theme Using Sass Preview 08:45 Angular Material Custom Theme - Dark Themes 06:27 Angular Material Custom Theme - Defining a custom Palette 04:26 Course Conclusion 3 lectures • 6min Other Courses 02:17 Bonus Lecture 01:30 Angular Material Course Conclusion and Key Takeaways 02:18 Requirements Just some previous knowledge of Angular and Typescript Description This Course In a Nutshell ( includes the Typescript Jumpstart Ebook ) Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets. Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations ). The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite. Course Overview We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons. The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component. We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more. At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme. What Will You be able to do at the End Of This Course? You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box. You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls. You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material. Have a look at the course free lessons below, and please enjoy the course! Who this course is for: Developers looking to get in-depth knowledge on the Angular Material Library Show more Show less Instructor Angular University Best Selling Angular Courses | 100k+ students | 16 courses 4.5 Instructor Rating 18,736 Reviews 114,070 Students 17 Courses Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University. Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies. Check out my Linkedin in the links section on the top right. About the Angular University: The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style. No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you. More about me: I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years. I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor, Kind Regards, Vasco Show more Show less Udemy Business Teach on Udemy Get the app About us Contact us Careers Blog Help and Support Affiliate Impressum Kontakt Terms Privacy policy Cookie settings Sitemap © 2021 Udemy, Inc. window.handleCSSToggleButtonClick = function (event) { var target = event.currentTarget; var cssToggleId = target && target.dataset && target.dataset.cssToggleId; var input = cssToggleId && document.getElementById(cssToggleId); if (input) { if (input.dataset.type === 'checkbox') { input.dataset.checked = input.dataset.checked ? '' : 'checked'; } else { input.dataset.checked = input.dataset.allowToggle && input.dataset.checked ? '' : 'checked'; var radios = document.querySelectorAll('[name="' + input.dataset.name + '"]'); for (var i = 0; i (function(){window['__CF$cv$params']={r:'6777896f3c66069e',m:'86bd0dde9aef5711dd9552d9dee201e72dc64874-1627741955-1800-ARSuwwMgus6WKF1PVOooRGg5P5r+/ipmF/HJrQxLcmByLU4eT8/T6qJbQOfwqSjf2GVvxxmuLysgcBojtLDWHsXPcHsbqC0GKdv2PEDX7vOpGHHRR0BMcvXrglmg64StIjzlfMW3K5EQw/wuM04cLyWX/Z/MD7DDAjlCvXyaKvEJ',s:[0x5a2e42fa80,0x6e0d54cdf4],}})();
  7. Learn how to build an Angular Material Custom Theme Curated for the Udemy Business collection Course content 6 sections • 36 lectures • 2h 59m total length Expand all sections Introduction 5 lectures • 17min Angular Material Course Helicopter View Preview 04:01 IMPORTANT - Recommended Software Versions 00:14 The Typescript Jumpstart Ebook 03:27 Angular Material Course Kickoff - Install Node, NPM, IDE, Lessons Code Preview 03:40 Angular Material Hello World Preview 05:35 Angular Material Navigation And Containers 5 lectures • 31min Navigation and Containers - Section Introduction 05:43 Material Icon Component - Styling Angular Components Preview 07:21 Material Dropdown Navigation Menu - Step-by-Step Implementation 03:57 Container Components - Tab Containers and Material Cards 08:14 The Material SideNav Navigation Menu 05:17 Angular Material Data Table 13 lectures • 1hr 16min Data Table New Section Introduction -Server Pagination, Sorting and Filtering 06:34 Material Data Table Column Definition - matCellDef and matHeaderCellDef Preview 05:37 Material Data Table Up and Running - Data Source and Custom Look and Feel 08:33 Material Data Table Client-Side Filtering with MatTableDataSource 04:16 Angular Material Custom Data Source - Initial Implementation 04:28 Angular Material Data Source - Loading Data From The Backend 05:41 Custom Data Source - Error Handling and Server Data Demo 05:02 Material Data Table Server Side Pagination 07:21 Material Data Table Loading Indicator 04:47 Angular Expression has Changed Error - Debugging and Explanation 06:29 How to Fix ExpressionChangedAfterItHasBeenCheckedError 03:09 Material Data Table Server-Side Sorting 07:53 Material Data Table Server-Side Filtering 05:45 Material Dialog + Form Components 7 lectures • 31min New Section Kickoff - Material Dialog and Form Components 02:08 Angular Material Dialog - Passing Input Data Preview 05:43 Receiving Input Data Inside the Material Dialog 03:30 Material Dialog Body Implementation 06:30 Angular Material Select Box 03:55 Angular Material DatePicker with MomentJs Integration 04:40 Dialog Section Conclusion - Sending Dialog Output Data 04:09 Angular Material Custom Theme + Angular CLI Sass Support 3 lectures • 20min Angular Material Custom Theme - Building Our Own Theme Using Sass Preview 08:45 Angular Material Custom Theme - Dark Themes 06:27 Angular Material Custom Theme - Defining a custom Palette 04:26 Course Conclusion 3 lectures • 6min Other Courses 02:17 Bonus Lecture 01:30 Angular Material Course Conclusion and Key Takeaways 02:18 Requirements Just some previous knowledge of Angular and Typescript Description This Course In a Nutshell ( includes the Typescript Jumpstart Ebook ) Angular by itself is an amazing framework, that together with the Angular CLI makes our life as developers simpler than ever. But imagine what it would mean if adopting this new framework would mean also that we would have to write manually our own form controls as well: such as for example date pickers, dropdowns and other commonly needed widgets. Developing solid form controls, containers, navigation menus and modal components on top of pure Angular still requires a lot of time and effort, especially if we are looking for a consistently themed component suite with commonly needed advanced features such as for example great ergonomics, design and user experience (including animations ). The good news is that we don't have to do that anymore because together with Angular we now have available an amazing suite of Material Design components, ready to be used! And that is what this course is all about: The Angular Material component suite. Course Overview We will start first by scaffolding an Angular Material application for scratch from an empty folder, add it a theme and gesture support. Next, we will start exploring the Angular Material components starting with some navigation menu and icons. The goal here is to show that its also possible to use Angular Material components also in a more incremental way, by mixing Angular Material Components with a couple of custom-made components and just some HTML/CSS. Later in this section, we will use a more advanced menu system where Angular Material is essentially taking over the whole application layout, with a side menu component. We are then going to introduce container components such as for example Tab Containers and Material Cards, and we will show a complete example of how to use a data table with a data source, pagination and sorting. We will also show how to use Modals to edit some of data in the data table, for which we will use multiple different types of form components to build an editable form: date pickers, slider, and more. At the end of the course, we will show we can customize the look and feel of the Angular Material component suite, by building our own custom theme. What Will You be able to do at the End Of This Course? You will be able to comfortably build an Angular application using Angular Material and the Angular CLI. You will be able to scaffold an application from an empty folder, and have gestures and animations working out of the box. You will be able to setup the navigation menu of the application using the Angular Router and different types of Angular Material menus. You will be able to setup the main layout of your application using standard Angular Material container components such as Tab Containers or Cards, and use common components such as: data tables, lists, date pickers, and all sorts of form controls. You will be able to build your own Modal dialogs, setup a custom theme and much more, and you will be able to focus your development effort on building the application core functionality itself, instead of building the infrastructure-level UI widgets, the UI design and the enhanced user experience that we get immediately out of the box with Angular Material. Have a look at the course free lessons below, and please enjoy the course! Who this course is for: Developers looking to get in-depth knowledge on the Angular Material Library Show more Show less Instructor Angular University Best Selling Angular Courses | 100k+ students | 16 courses 4.5 Instructor Rating 18,736 Reviews 114,070 Students 17 Courses Hello, I'm Vasco Cavalheiro and I'm an online instructor at the Angular University. Over the years I have helped over 100k developers to learn the Angular framework and its surrounding ecosystem of technologies. Check out my Linkedin in the links section on the top right. About the Angular University: The Angular University aims to be the one place that you go in order to learn and keep up with the whole Angular ecosystem. We provide premium quality video tutorials, screencast style. No matter if you are a beginner, intermediate or advanced in Angular, we have several courses for you. More about me: I'm a Software Developer with many years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years. I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. I also love to teach, write and talk about technology. I am looking forward to be your Angular instructor, Kind Regards, Vasco Show more Show less Udemy Business Teach on Udemy Get the app About us Contact us Careers Blog Help and Support Affiliate Impressum Kontakt Terms Privacy policy Cookie settings Sitemap © 2021 Udemy, Inc. window.handleCSSToggleButtonClick = function (event) { var target = event.currentTarget; var cssToggleId = target && target.dataset && target.dataset.cssToggleId; var input = cssToggleId && document.getElementById(cssToggleId); if (input) { if (input.dataset.type === 'checkbox') { input.dataset.checked = input.dataset.checked ? '' : 'checked'; } else { input.dataset.checked = input.dataset.allowToggle && input.dataset.checked ? '' : 'checked'; var radios = document.querySelectorAll('[name="' + input.dataset.name + '"]'); for (var i = 0; i (function(){window['__CF$cv$params']={r:'6777896f3c66069e',m:'86bd0dde9aef5711dd9552d9dee201e72dc64874-1627741955-1800-ARSuwwMgus6WKF1PVOooRGg5P5r+/ipmF/HJrQxLcmByLU4eT8/T6qJbQOfwqSjf2GVvxxmuLysgcBojtLDWHsXPcHsbqC0GKdv2PEDX7vOpGHHRR0BMcvXrglmg64StIjzlfMW3K5EQw/wuM04cLyWX/Z/MD7DDAjlCvXyaKvEJ',s:[0x5a2e42fa80,0x6e0d54cdf4],}})();