Lewati ke konten utama
pelatihan
.org
Belajar. Praktik. Berkembang.
Kategori
ID
Masuk
Daftar
Menu
Kurikulum Angular: 3 Bab, 32 Lesson — pelatihan.org
Beranda
/
Katalog
/
Angular
/
Kurikulum
Kurikulum
Kurikulum Angular
Belajar Angular online lewat 32 lesson terstruktur, contoh kode, dan 160 soal kuis.
32 lesson
3 bab
160 soal
Ringkasan dan poin kunci bisa dilihat gratis. Materi lengkap, contoh kode, dan kuis memerlukan langganan.
01
Angular Tutorial
18 lesson
01
Angular Home
Halaman ini adalah pintu masuk ke seluruh materi Angular di W3Schools. Angular adalah framework JavaScript open-source dari Google untuk membangun aplikasi web satu halaman (SPA)…
02
Angular Intro
Angular adalah framework front-end yang memecah aplikasi menjadi potongan-potongan kecil bernama komponen. Setiap komponen punya template HTML, logika TypeScript, dan data yang…
03
Angular Get Started
Untuk memulai Angular kamu perlu Node.js dan Angular CLI yang diinstal lewat npm. Perintah `ng new` membuat proyek baru lengkap dengan konfigurasi, lalu `ng serve` menjalankan…
04
Angular First App
Aplikasi Angular pertama dibentuk dari komponen root bernama AppComponent yang di-bootstrap di main.ts. Saat aplikasi dimuat, Angular merender template AppComponent ke dalam…
05
Angular Templates
Template adalah bagian HTML yang mendeskripsikan tampilan sebuah komponen. Di dalam template kamu bisa memakai sintaks khas Angular seperti interpolasi {{ }}, binding properti…
06
Angular Components
Komponen adalah kelas TypeScript dengan decorator @Component yang mendeskripsikan bagaimana sebuah bagian UI dibuat. Di dalamnya terdapat selector sebagai penanda HTML, template…
07
Angular Data Binding
Data binding menghubungkan data di class komponen dengan tampilan template. Ada binding satu arah seperti interpolasi dan property binding, binding event untuk merespons aksi…
08
Angular Directives
Directives adalah kelas yang mengubah tampilan atau perilaku elemen DOM. Angular mengenal tiga jenis: komponen, direktif struktural seperti *ngIf dan *ngFor yang mengubah layout,…
09
Angular Events
Event binding memungkinkan komponen merespons aksi pengguna seperti klik, hover, dan input. Kamu menulis event dalam tanda kurung, contohnya (click)="proses()", lalu…
10
Angular Conditional
Conditional rendering menampilkan elemen hanya jika kondisi tertentu terpenuhi. Angular menyediakan sintaks @if modern beserta @else dan @else if, serta direktif lama *ngIf yang…
11
Angular Lists
Menampilkan kumpulan data seperti array biasanya dilakukan dengan @for atau direktif *ngFor. Angular mengulang elemen template untuk setiap item dan menyediakan konteks seperti…
12
Angular Forms
Form template-driven membuat form HTML menjadi interaktif dengan data binding dua arah memakai ngModel dan name. Angular menyediakan status form seperti valid, dirty, dan error…
13
Angular Router
Angular Router mengubah aplikasi menjadi SPA dengan memetakan URL ke komponen tertentu. Kamu mendefinisikan daftar rute di konfigurasi, lalu menampilkan komponen aktif melalui…
14
Angular Services & DI
Service adalah kelas berisi logika atau data yang dapat dipakai bersama oleh banyak komponen. Melalui dependency injection, kamu cukup menyuntikkan service lewat constructor…
15
Angular HTTP Client
Angular menyediakan HttpClient untuk berkomunikasi dengan API lewat HTTP. Metode seperti get, post, put, dan delete menghasilkan Observable yang bisa dilanggan dengan subscribe.…
16
Angular Pipes
Pipes adalah fitur untuk mentransformasi nilai saat ditampilkan di template, misalnya format tanggal, mata uang, atau huruf kapital. Angular menyediakan pipe bawaan seperti date,…
17
Angular Lifecycle Hooks
Setiap komponen memiliki siklus hidup mulai dari dibuat, merender, hingga dihancurkan. Hook seperti ngOnInit dipakai untuk inisialisasi data setelah constructor, sedangkan…
18
Angular Styling
Setiap komponen Angular bisa memiliki file CSS sendiri sehingga gaya tetap terisolasi antar komponen. Fitur view encapsulation mengontrol seberapa luas CSS diterapkan, misalnya…
02
Advanced Angular
14 lesson
01
Angular App Bootstrap
Proses bootstrap adalah tahap awal Angular membangun aplikasi dari platform browser. Fungsi bootstrapApplication di main.ts memulai aplikasi root dengan menyediakan konfigurasi…
02
Angular Control Flow
Sintaks kontrol flow Angular yang baru memakai blok @if, @for, @switch, dan @defer yang mudah dibaca langsung di template. @defer memungkinkan bagian tertentu dimuat lazily…
03
Angular Signals
Signals adalah fitur reaktivitas modern Angular berupa nilai state yang melacak perubahannya. Dibuat dengan signal(), nilai dibaca dengan tanda kurung dan diubah lewat set() atau…
04
Angular Change Detection
Change detection adalah mekanisme Angular memperbarui DOM ketika data berubah. Angular secara historis memakai Zone.js untuk mendeteksi aktivitas asinkron, namun pendekatan…
05
Angular Dynamic Comp
Dynamic components membuat kamu bisa memuat komponen pada runtime tanpa menuliskan tag-nya secara langsung di template. Kasus umumnya adalah modal, tooltip, atau plugin yang…
06
Angular Advanced DI
Dependency injection tingkat lanjut memungkinkan kamu mendaftarkan penyedia dengan berbagai cara: nilai nyata, factory, token khusus, hingga multi provider. InjectionToken…
07
Angular Router Advanced
Router tingkat lanjut mencakup lazy loading rute, child routes, guard, dan resolver. Dengan loadChildren, satu modul atau set komponen hanya dimuat saat rute tersebut dikunjungi.…
08
Angular HTTP Interceptors
Interceptor memungkinkan kamu memodifikasi setiap request atau respons HTTP di satu tempat, misalnya menambahkan token autentikasi atau menangani error 401. Angular modern…
09
Angular Forms Advanced
Reactive forms membangun struktur form secara programatik di class komponen menggunakan FormBuilder, FormGroup, dan FormControl. Validasi bisa dikombinasikan, dibuat asinkron,…
10
Angular State Management
State management adalah cara mengelola data bersama di seluruh aplikasi agar tetap konsisten. Untuk aplikasi kecil, satu service dengan signal cukup memadai. Untuk aplikasi…
11
Angular Animations
Animasi Angular memungkinkan transisi elemen seperti masuk, keluar, dan perubahan status secara deklaratif. Modul @angular/animations menyediakan trigger, state, dan transition…
12
Angular Testing
Angular menyediakan alat testing berbasis Karma dan Jasmine untuk menguji komponen, service, dan pipe. TestBed memungkinkan kamu membuat modul pengujian mini untuk menjalankan…
13
Angular Security
Keamanan aplikasi Angular mencakup perlindungan dari XSS dengan sanitizer bawaan, penggunaan HTTPS, serta penanganan token autentikasi yang benar. Angular mengubah nilai…
14
Angular SSR & Hydration
SSR (Server-Side Rendering) merender halaman di server sehingga konten pertama lebih cepat terlihat oleh pengguna dan mesin pencari. Setelah HTML dikirim, Angular di browser…