Angular Material adalah library UI component untuk Angular JS. Angular Material components berguna untuk membuat web page atau web app yang menarik dan konsisten yang menerapkan prinsip web design modern, seperti browser portability, device independence, dan graceful degradation.
Angular Material membantu pembuatan responsive website yang menarik dengan cepat.
Untuk dapat mengikuti tutorial ini diharapkan sudah memahami
- HTML dan CSS
- Angular JS, lihat tutorial introduksi Angular disini.
- TypeScript dan JavaScript, lihat tutoral TypeScript dasar disini.
Anda juga memerlukan IDE, pada tutorial digunakan Visual Studio Code, silakan download disini.
Link Dokumentasi dan Referensi yang berhubungan dengan tutorial adalah
Material Design Spesification : https://material.io/
Angular Material: https://material.angular.io/
Berikut topik yang akan dibahas pada tutorial ini:
- Setup Aplikasi Angular Material
- Membuat File Master Angular Material Module
- Membuat Demo Module dan Routing
- Demo Module Flexbox
- Membuat Contact Manager Module
- Menggunakan Angular Material Sidenav
- Styling Sidenav dengan Menggunakan Toolbar dan List
- Menampilkan Angular Material Toolbar Pada Component Toolbar
- Menambahkan Responsive Pada Sidenav
- Menambahkan Button Pada Toolbar
- Menggunakan Angular Material Card
- Membuat User Service dan Data Model
- Menggunakan Angular Material Navigation List
- Menampilkan SVG Icons
- Menampilkan Data User Pada maincontent
- Menggunakan Angular Material Tabs
- Menggunakan Angular Material Table – 1
- Menggunakan Angular Material Table – 2
- Menggunakan Angular Material Table – 3
- Menggunakan Angular Material Table – 4
- Menambahkan Menu Pada Toolbar
- Menggunakan Angular Material Dialog
- Menggunakan Material Theme