Kursus Pengembangan Front-End dengan Angular

Pelajaran 1 • Modul Angular dan Bootstrap Aplikasi

Menjelaskan NgModule, AppModule root, dan bagaimana Angular melakukan bootstrap aplikasi. Memberikan konteks struktural yang diperlukan sebelum membangun komponen.

Pelajaran 2 • TypeScript Esensial untuk Angular

Memperkenalkan tipe, antarmuka, dan dekorator TypeScript yang diperlukan untuk menulis kode Angular dengan percaya diri. Menjembatani pengetahuan JavaScript ke ekosistem Angular yang bertipe.

Pelajaran 3 • Pengantar Framework Angular

Mencakup peran Angular dalam pengembangan front-end modern dan arsitektur terinspirasi MVC. Menetapkan dasar konseptual untuk semua topik framework selanjutnya.

Pelajaran 4 • Menyiapkan Lingkungan Pengembangan

Menginstal dan mengonfigurasi Node.js, npm, dan Angular CLI. Memastikan setiap peserta memiliki lingkungan kerja lokal yang konsisten dan dapat direproduksi.

Pelajaran 1 • Arahan Struktural Bawaan

Menerapkan *ngIf, *ngFor, dan *ngSwitch untuk mengontrol struktur DOM secara dinamis. Mendemonstrasikan bagaimana arahan memperluas ekspresivitas templat.

Pelajaran 2 • Pengikatan Properti dan Peristiwa

Mengajarkan aliran data satu arah melalui pengikatan properti dan penanganan peristiwa pengguna melalui pengikatan peristiwa. Menghubungkan logika komponen ke elemen DOM dan interaksi pengguna.

Pelajaran 3 • Sintaks dan Ekspresi Templat

Mencakup bahasa ekspresi templat Angular, navigasi aman, dan variabel referensi templat. Memungkinkan render konten dinamis dalam tampilan komponen.

Pelajaran 4 • Kait Siklus Hidup Komponen

Mengeksplorasi urutan kait siklus hidup lengkap dari ngOnInit hingga ngOnDestroy. Mengajarkan kapan dan mengapa menggunakan setiap kait untuk inisialisasi dan pembersihan.

Pelajaran 1 • Kueri ViewChild dan ContentChild

Mengakses instance komponen anak dan konten yang diproyeksikan secara terprogram melalui kueri. Memungkinkan koordinasi komponen tingkat lanjut di luar pengikatan templat.

Pelajaran 2 • Komunikasi Induk-ke-Anak dengan @Input

Menggunakan @Input untuk meneruskan data ke bawah pohon komponen dan memvalidasi input dengan setter. Menetapkan pola aliran data ke bawah utama di Angular.

Pelajaran 3 • Membangun Arahan Struktural Kustom

Menerapkan arahan struktural menggunakan TemplateRef dan ViewContainerRef untuk memanipulasi DOM. Memperluas kemampuan peserta untuk membuat logika tata letak yang dapat digunakan kembali.

Pelajaran 4 • Membangun Arahan Atribut Kustom

Membuat arahan yang memodifikasi penampilan atau perilaku elemen host tanpa mengubah struktur DOM. Memperkuat pola arahan yang diperkenalkan di Bab 2.

Pelajaran 1 • Membuat dan Menyediakan Layanan Angular

Menghasilkan layanan dengan CLI dan mendaftarkannya pada lingkup modul, komponen, atau root. Menetapkan lapisan layanan sebagai rumah bagi logika bersama.

Pelajaran 2 • Klien HTTP dan Integrasi REST API

Mengonfigurasi HttpClientModule dan melakukan permintaan GET, POST, PUT, dan DELETE. Menghubungkan lapisan layanan ke sumber data back-end nyata.

Pelajaran 3 • Penanganan Kesalahan dan Interceptor HTTP

Menerapkan penanganan kesalahan global dengan catchError dan transformasi permintaan/respons dengan interceptor. Menghasilkan pola komunikasi HTTP yang siap produksi.

Pelajaran 4 • Pendalaman Injeksi Dependensi

Mengeksplorasi hierarki DI, token injeksi, dan jenis penyedia. Memungkinkan kontrol terperinci atas bagaimana dependensi diselesaikan di seluruh aplikasi.

Pelajaran 1 • Penjaga Rute dan Kontrol Akses

Menerapkan penjaga CanActivate, CanDeactivate, dan CanLoad untuk melindungi rute. Mengintegrasikan autentikasi dan otorisasi ke dalam lapisan navigasi.

Pelajaran 2 • Pemuatan Lambat dan Resolver Rute

Membagi aplikasi menjadi modul fitur yang dimuat sesuai permintaan dan mengambil data terlebih dahulu dengan resolver. Meningkatkan kinerja pemuatan awal dan pengalaman pengguna.

Pelajaran 3 • Rute Bersarang dan Outlet Bernama

Menyusun rute anak di bawah rute induk dan menggunakan outlet bernama untuk tampilan bantu. Mendukung persyaratan tata letak yang kompleks dalam aplikasi besar.

Pelajaran 4 • Pengaturan Router dan Navigasi Dasar

Mengonfigurasi RouterModule dengan definisi rute dan menambahkan router-outlet dan routerLink. Menetapkan fondasi untuk semua fitur navigasi.

Pelajaran 1 • Formulir Dinamis dengan FormArray

Menggunakan FormArray untuk menambah dan menghapus kontrol formulir saat runtime untuk data dengan panjang variabel. Menangani skenario dunia nyata seperti item baris berulang.

Pelajaran 2 • Validator dan Validasi Kustom

Menerapkan validator sinkron dan asinkron serta membuat fungsi validator khusus yang dapat digunakan kembali. Memastikan integritas data sebelum pengiriman.

Pelajaran 3 • Pengiriman Formulir dan Manajemen Status

Menangani pengiriman formulir, pengaturan ulang, dan status dirty/touched untuk memberikan UX yang baik. Menghubungkan data formulir ke panggilan layanan yang diperkenalkan di Bab 4.

Pelajaran 4 • Formulir Berbasis Templat

Menggunakan ngForm, ngModel, dan validator bawaan untuk membangun formulir secara deklaratif dalam templat. Memperkenalkan konsep formulir dengan overhead TypeScript minimal.

Pelajaran 1 • NgRx Entity dan DevTools

Menyederhanakan manajemen koleksi dengan NgRx Entity dan memeriksa status dengan Redux DevTools. Mempercepat pengembangan dan debugging fitur store-heavy.

Pelajaran 2 • Pengantar NgRx Store

Menginstal NgRx dan mendefinisikan aksi, reducer, dan store untuk irisan fitur. Menetapkan pola Redux dalam ekosistem Angular.

Pelajaran 3 • Status Berbasis Layanan dengan BehaviorSubject

Menyimpan dan membagikan status di seluruh komponen menggunakan BehaviorSubject dalam suatu layanan. Menyediakan solusi status ringan sebelum memperkenalkan NgRx.

Pelajaran 4 • NgRx Effects untuk Efek Samping

Menangani operasi asinkron seperti panggilan HTTP di luar reducer menggunakan NgRx Effects. Menjaga reducer tetap murni dan memusatkan logika efek samping.

Pelajaran 1 • Strategi Penerapan dan Integrasi CI/CD

Menerapkan build Angular ke hosting statis dan mengintegrasikan pipeline otomatis untuk pengiriman berkelanjutan. Menutup siklus hidup pengembangan dari kode ke produksi.

Pelajaran 2 • Pengujian Unit Komponen dan Layanan

Menulis pengujian unit dengan Jasmine dan TestBed untuk komponen, layanan, dan pipa. Memvalidasi unit individu secara terisolasi sebelum integrasi.

Pelajaran 3 • Optimasi Bundel dan Konfigurasi Build

Mengonfigurasi build produksi, tree shaking, dan differential loading untuk ukuran bundel yang optimal. Mempersiapkan aplikasi untuk kendala penerapan dunia nyata.

Pelajaran 4 • Pengujian Ujung-ke-Ujung dengan Cypress

Mengotomatiskan pengujian alur pengguna dengan Cypress untuk memvalidasi perilaku aplikasi penuh. Melengkapi pengujian unit dengan skenario realistis berbasis browser.