Library

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
  • Introduction to Angular Material.  


    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  

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

  • Adding Angular Material to Angular Application  

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

  • Basic Introduction about environment about Angular Material  

    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  

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

Buttons & Form Field
  • Button component in details  

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

  • Working with input box  

    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.  

    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  

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

  • Demo of Auto complete box.  

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

Node.js - Backend
  • Setup guide for node.js  

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

  • Nodejs dbconnection  

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

  • Nodejs Model file for country  

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

  • Nodejs Routing file for country  

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

  • Making adjustment to app.js  

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

  • Node.js Summary  

    Summary for entire nodejs module.

Auto Complete & Data Table
  • Creating Service in Angular for fetch REST API  

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

  • Autocompletebox with Live Data  

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

  • Basic Data Table  

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

  • Data Table Continues  

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

  • Data Table with Filtering  

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

  • Data Table with Pagination.  

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

  • Data Table with Sorting.  

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

  • Data Table with Expandable Row Introduction.  

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

  • Data Table with Expandable Row Implementation.  

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

Layout
  • Working with Card Layout with Live Data(HTTP).  

    In this video, how to create cardlayout is explained.

  • Demo of Grid Layout  

    In this video, how to create gridlayout is explained.

  • List Layout with Static Data.  

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


  • List Layout with Live Data.  

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

  • Tab Layout Demo Basics.  

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

  • Deep dive with tab layout with dynamic data.  

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

Bonus
  • Sidebar Navigation & Routing Part I.  

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

  • Sidebar Navigation & Routing Part II.  

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

  • Creating Dashboard Component  

    In this video, how to create dashboard is explained.

  • Introduction to CDK (Component Development Kit).  

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

  • Font Dialog Using CDK  

    In this video, created the component using CDK.

Latest Updates with Angular 7.x
  • Upgrading Existing application to angular 7.x.  

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

  • Drag and Drop Demo List with Static Data.  

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

  • Drag and Drop Demo List with Dynamic Data.  

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

Reviews (0)