Ingin membuat situs Angular Anda secepat dan mudah diakses? Anda datang ke tempat yang tepat!
Apa itu Angular?
Angular adalah framework untuk membangun antarmuka pengguna. Library ini menyediakan elemen penyusun untuk membantu Anda menyiapkan aplikasi yang skalabel dan mudah dikelola dengan cepat. Angular memberdayakan developer untuk membuat aplikasi yang live di web, seluler, atau desktop.
Apa yang ada di koleksi ini?
Koleksi ini berfokus pada lima area utama untuk mengoptimalkan aplikasi Angular:
- Meningkatkan performa aplikasi Anda untuk meningkatkan konversi dan engagement pengguna
- Meningkatkan keandalan aplikasi Anda di jaringan yang buruk dengan meng-cache aset menggunakan pekerja layanan Angular
- Membuat aplikasi Anda dapat ditemukan oleh mesin telusur dan bot media sosial menggunakan pra-rendering dan rendering sisi server
- Membuat aplikasi Anda dapat diinstal untuk memberikan pengalaman pengguna yang mirip dengan aplikasi iOS/Android
- Meningkatkan aksesibilitas aplikasi Anda agar dapat digunakan dan dipahami oleh semua pengguna
Setiap postingan dalam koleksi ini akan menjelaskan teknik yang dapat langsung Anda terapkan pada aplikasi Anda sendiri.
Apa yang tidak ada di koleksi ini?
Kumpulan ini mengasumsikan bahwa Anda sudah familier dengan Angular dan TypeScript. Jika Anda belum merasa yakin dengan filter tersebut, lihat dokumentasi TypeScript dan panduan Mulai Menggunakan Angular di angular.io.
Memulai project
Antarmuka command line (CLI) Angular memungkinkan Anda menyiapkan aplikasi Angular sisi klien yang sederhana dengan cepat. Postingan ini memberikan pengantar singkat tentang CLI, sementara postingan lain dalam koleksi ini menunjukkan cara menambahkan fitur yang lebih canggih seperti rendering sisi server dan dukungan deployment.
Menyiapkan CLI
Untuk memulai, instal CLI secara global dan pastikan Anda memiliki versi terbaru dengan menjalankan perintah berikut:
npm i -g @angular/cli
ng --version
Pastikan perintah terakhir menghasilkan versi 8.0.3 atau yang lebih baru.
Atau, jika tidak ingin menginstal CLI secara global, Anda dapat menginstalnya secara lokal dan menjalankannya dengan perintah npx:
npm i @angular/cli
npx ng --version
Mulai membuat project
Untuk membuat project baru, jalankan:
ng new my-app
Perintah ini akan membuat file awal dan struktur folder untuk aplikasi Anda dan menginstal modul node yang dibutuhkan.
Setelah proses penyiapan berhasil diselesaikan, mulai aplikasi Anda dengan menjalankan:
cd my-app
ng serve
Sekarang Anda dapat mengakses aplikasi di http://localhost:4200.
Apa langkah selanjutnya?
Dalam koleksi ini, Anda akan mempelajari cara meningkatkan performa, aksesibilitas, dan SEO aplikasi Angular Anda. Berikut adalah hal yang dibahas:
- Pemisahan kode Level Rute di Angular
- Anggaran Performa dengan Angular CLI
- Strategi Pengambilan Data Rute di Angular
- Mengubah pengoptimalan deteksi di Angular
- Memvirtualisasikan daftar besar dengan Angular CDK
- Pra-cache dengan Service Worker Angular
- Melakukan pra-render rute dengan Angular CLI
- Rendering sisi server dengan Angular Universal
- Menambahkan manifes aplikasi web dengan Angular CLI
- Audit aksesibilitas dengan codelyzer