In this course we will explore the major Angular Material components. We will start with components related to navigation, layout, and structure. We will then move through the utility, form, and datatable components, demonstrating how each can be used to suit your project’s needs. Finally we will touch on theming your application to create a custom look and feel that fits within the Material Design guidelines.
By the end of the course you will be comfortable leveraging the Angular Material library to structure your next Angular application, creating an awesome interface and user experience!
Video - Coming Soon!
This lesson demonstrates the basic project setup required to get started with Angular Material. Required and suggested packages are discussed as well as custom material module and theme configuration.
Video - Coming Soon!
This lesson explores the material design sidenav component. This includes input and display options as well as hooking into output events to listen to sidenav actions within your Angular components.
Video - Coming Soon!
This lesson explores the material design toolbar component, configuration and styling options, and how to utilize this component to create a material design extended app header.
Video - Coming Soon!
This lesson explores how to configure your project to use material design icons, display icons and icon buttons, and registering custom icons for use with the material icon component.
Video - Coming Soon!
This lesson will explore the Angular Material input component. We will touch on setup, configuration, display options, and error display. This lesson will also demonstrate how to configure input options globally and implement custom error matching strategies for your application form fields.
Video - Coming Soon!
This lesson explores how to manage a variety of loading scenarios in your application utilizing the built in progress bar and spinner components.
Video - Coming Soon!
This lesson explores the material design tabs component. We will discuss configuration, basic tabs, and creating a routable tabbed interface.
Video - Coming Soon!
This lesson explores the angular material datepicker component. This includes basic setup and configuration options, validation and date range scenarios, configuring the datepicker for touch use, and how to integrate momentjs with the material datepicker.
Video - Coming Soon!
This lesson demonstrates how to handle notifications and alerts using the snackbar component. We will cover snackbar configuration options and creating custom snackbar templates utilizing dynamic data.
Video - Coming Soon!
This lesson demonstrates how to utilize the Angular Material dialog module for application dialogs. We will touch on methods to present and close dialogs, configuring your dialog to accept data, and responding to user actions when a dialog is dismissed.
Video - Coming Soon!
This lesson explores the Angular Material datatable component. This includes configuring your data source, setup of row and column templates, and adding filtering and paging to your datatable.
Video - Coming Soon!
This lesson explores the theming hooks Angular Material provides to create a custom look and feel for your application. We will discuss best practices for creating and managing your own theme and using common theme variables throughout your application.
npm install
ng serve
Navigate to http://localhost:4200/
.