Diese Präsentation wurde erfolgreich gemeldet.
Die SlideShare-Präsentation wird heruntergeladen. ×

Angular material

Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Anzeige
Nächste SlideShare
Angular material tutorial
Angular material tutorial
Wird geladen in …3
×

Hier ansehen

1 von 10 Anzeige

Weitere Verwandte Inhalte

Diashows für Sie (20)

Ähnlich wie Angular material (20)

Anzeige

Aktuellste (20)

Angular material

  1. 1. Angular Material Kalpesh Satasiya Microsoft MVP, Blogger, Mentor Co-Founder, FutureStack Solution
  2. 2. Agenda  What is Angular Material  Prerequisites  Features  Add Angular Material to Application  Typography  Component Schematics
  3. 3. What is Angular Material  UI component library  Help in building attractive, consistent web application Material UI React Angular Material Angular Vuetify Vue
  4. 4. Prerequisites  Html  JavaScript  Basic knowledge of Angular
  5. 5. Features  Modern UI components that work across the web, mobile, and desktop.  Fast and Consistent  Tuned performance, Fully tested across modern browser.  Versatile  Themeable  Optimized for Angular  Built by the Angular team to integrate seamlessly with Angular.
  6. 6. Add Angular Material to Application  ng add @angular/material  It will install Angular Material, Component Dev Kit (CDK) and Angular Animations
  7. 7. What is typography?  Typography is a way of arranging type to make text legible, readable, and appealing when displayed.  Based on the guidelines from the Material Design spec and is arranged into typography levels  Each level has a font-size, line-height and font-weight  .mat-display-4  .mat-display-3  …..  .mat-h1  .mat-h2  ….  .mat-body  .mat-small  …
  8. 8. Component Schematics  Multiple schematics that can be used to easily generate Material Design components  ng generate @angular/material:nav my-nav  ng generate @angular/material:table my-table  ng generate @angular/material:dashboard my-dashboard  ng generate @angular/material:address-form my-form  ng generate @angular/material:tree my-tree CDK  ng generate @angular/cdk:drag-drop my-drap-drop
  9. 9. Reference  https://material.angular.io/
  10. 10. Thank You!  Kalpesh Satasiya  Email: Kalpesh@futurestacksolution.com  Blog: http://www.tech-coder.com  Company: https://www.futurestacksolution.com  YouTube: https://bit.ly/2LRoom4  Twiller: @Satasiyakalpesh

×