Course: Ultimate Guide to Angular Material

Ultimate Guide to Angular Material

Life Time Access

Certificate on Completion

Access on Android and iOS App

About this Course

There is no doubt Angular is an amazing java script framework with which we can create awesome web applications. And there are also lots of courses available that dive deeply to Angular Concepts, but certainly there is no as such course which focuses on Google’s Material Design. I mean if you are using Angular for your application which itself is a JavaScript framework and in the same application you might be using jquery or other JavaScript framework, it is not making any sense if we are using another JavaScript inside the JavaScript Framework. So basically this course will focus only Google’s Material Design and create demos for different component which is obviously built on Angular. I will give you assurance of after having this course you can create an app which looks awesome and which is extremely fast in performance.

Basic knowledge

You should have basic knowledge of Angular or Attitude to learn it along the way

Basic html,css and JavaScript

No Material Design knowledge required

What you will learn

A detailed description on Angular Material, its Documentation and its usages

Example of almost every component from different categories of component

Example with fetching live data from REST API (where needed)

Example of Component Development Kit

Example of Theme and Many More

Curriculum

Number of Lectures: 39

Total Duration: 03:03:40

Introduction to Course

5 lectures

15:32

Introduction to Angular Material.

02:42

In this video, what actually Angular Material is and why it is powerful is shown.Moreover, this video gives background idea about what this course will cover.

Setup and Installation

02:22

In this video, the requirements for setting up Angular Material on your local machine is explained.

Adding Angular Material to Angular Application

02:03

In this video, guidelines about how to integrate Angular Material with your application is given.

Basic Introduction about environment about Angular Material

03:56

In this video, the updates made due to installation of Angular Material in our existing application's files is explained.

Using first component with Angular application

04:26

In this video, how to integrate the first component of Angular Material in your existing application is explained.

Buttons & Form Field

5 lectures

34:01

Button component in details

06:10

In this video, how to create different types of buttons with the help of Angular Material is explained.

Working with input box

07:23

In this video, how to integrate input box component of Angular Material with your application is shown.

Working form field properties like mat-suffix and mat-prefix also showing them.

07:02

In this video, the different types of attribute of Form Field Control in Angular Material is explained.

Working with form filed properties like mathint and matErrors

09:43

In this video, hint and error attributes of Input-box in Angular Material is explained.

Demo of Auto complete box.

03:42

In this video, demo of Autocomplete-box with static data in Angular Material is shown.

Node.js - Backend

6 lectures

23:23

Setup guide for node.js

03:33

In this video, setup guide for installing nodejs in your machine is given.

Nodejs dbconnection

04:43

In this video, how to connect to your database through nodejs is explained.

Nodejs Model file for country

03:26

In this video, how to create model in nodejs application.

Nodejs Routing file for country

05:35

In this video, how to create routing in nodejs application.

Making adjustment to app.js

05:32

What are the adjustment require inside app.js file of nodejs application.

Node.js Summary

00:31

Summary for entire nodejs module.

Auto Complete & Data Table

9 lectures

40:30

Creating Service in Angular for fetch REST API

04:29

In this video, how to create the service on angular application is explained.

Autocompletebox with Live Data

07:20

In this video, how to fetch the data from nodejs application and display it with autocomplete box is explained.

Basic Data Table

05:08

In this video, how to create datatable with live data is explained.

Data Table Continues

05:44

In this video, how to create datatable with live data is html explained.

Data Table with Filtering

02:49

In this video, how to create datatable with filter is explained.

Data Table with Pagination.

04:17

In this video, how to create datatable with paginator is explained.

Data Table with Sorting.

02:46

In this video, how to create datatable with sorting is explained.

Data Table with Expandable Row Introduction.

01:23

In this video, how to create datatable with expandable rows is explained.

Data Table with Expandable Row Implementation.

06:31

In this video, how to create datatable with expandable rows part-II is explained.

Layout

6 lectures

31:07

Working with Card Layout with Live Data(HTTP).

07:54

In this video, how to create cardlayout is explained.

Demo of Grid Layout

04:40

In this video, how to create gridlayout is explained.

List Layout with Static Data.

04:00

In this video, how to create listlayout with static data is explained.

List Layout with Live Data.

04:49

In this video, how to create list layout with dynamic data is explained.

Tab Layout Demo Basics.

02:35

In this video, how to create basic tablayout is explained.

Deep dive with tab layout with dynamic data.

07:08

In this video, how to create tablayout in details is explained.

Bonus

5 lectures

26:41

Sidebar Navigation & Routing Part I.

03:44

In this video, how to add side bar navigation to angular application is explained.

Sidebar Navigation & Routing Part II.

08:40

In this video, how to create sidebar navigation in details is explained.

Creating Dashboard Component

04:04

In this video, how to create dashboard is explained.

Introduction to CDK (Component Development Kit).

03:45

In this video, introduction to Component development kit is given.

Font Dialog Using CDK

06:26

In this video, created the component using CDK.

Latest Updates with Angular 7.x

3 lectures

12:24

Upgrading Existing application to angular 7.x.

03:20

In this video, how to upgrade from angular 6.x to 7.x is explained.

Drag and Drop Demo List with Static Data.

05:44

In this video, how to create drag and drop module with static data is explained.

Drag and Drop Demo List with Dynamic Data.

03:19

In this video, how to create drag and drop module in details with live data is explained.

Simpliv LLC, is a platform for learning and teaching online courses. We offer a rich variety of educational courses that have been prepared
by authors, educators, coaches, and business leaders. Whether you're interested in healthy living, nutrition, natural healing, computer
programming, or learning a new language, you'll find it here.