Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.
Memahami dan menerapkan frontend mikro pada AWS
Amazon Web Services (kontributor)
Juli 2024 (sejarah dokumen)
Ketika organisasi berusaha untuk kelincahan dan skalabilitas, arsitektur monolitik konvensional sering menjadi hambatan, menghambat perkembangan dan penyebaran yang cepat. Micro-frontend mengurangi ini dengan memecah antarmuka pengguna yang kompleks menjadi komponen independen yang lebih kecil yang dapat dikembangkan, diuji, dan digunakan secara mandiri. Pendekatan ini meningkatkan efisiensi tim pengembangan dan memfasilitasi kolaborasi antara backend dan frontend, mendorong penyelarasan sistem end-to-end terdistribusi.
Panduan preskriptif ini dirancang untuk membantu para pemimpin TI, pemilik produk, dan arsitek di berbagai domain profesional untuk memahami arsitektur micro-frontend dan membangun aplikasi micro-frontend di Amazon Web Services ().AWS
Gambaran Umum
Micro-frontend adalah arsitektur yang dibangun di atas dekomposisi frontend aplikasi menjadi artefak yang dikembangkan dan digunakan secara independen. Ketika Anda membagi frontend besar menjadi artefak perangkat lunak otonom, Anda dapat merangkum logika bisnis dan mengurangi dependensi. Ini mendukung pengiriman kenaikan produk yang lebih cepat dan lebih sering.
Micro-frontend mirip dengan microservices. Bahkan, istilah micro-frontend berasal dari istilah microservice, dan bertujuan untuk menyampaikan gagasan microservice sebagai frontend. Sementara arsitektur microservices biasanya menggabungkan sistem terdistribusi di backend dengan frontend monolitik, micro-frontend adalah layanan frontend terdistribusi mandiri. Layanan ini dapat diatur dengan dua cara:
-
Frontend-only, terintegrasi dengan lapisan API bersama di belakangnya yang menjalankan arsitektur layanan mikro
-
Full-stack, artinya setiap micro-frontend memiliki implementasi backend sendiri.
Diagram berikut menunjukkan arsitektur layanan mikro tradisional, dengan monolit frontend yang menggunakan gateway API untuk terhubung ke layanan mikro backend.
Diagram berikut menunjukkan arsitektur micro-frontend dengan implementasi microservices yang berbeda.
Seperti yang ditunjukkan pada diagram sebelumnya, Anda dapat menggunakan micro-frontend dengan rendering sisi klien atau arsitektur rendering sisi server:
-
Frontend mikro yang dirender sisi klien dapat langsung menggunakan API yang diekspos oleh API Gateway terpusat.
-
Tim dapat membuat backend-for-frontend (BFF) di dalam konteks terbatas untuk mengurangi obrolan frontend terhadap API.
-
Di sisi server, mikro-frontend dapat diekspresikan dengan pendekatan sisi server ditambah di sisi klien dengan menggunakan teknik yang disebut hidrasi. Saat halaman dirender oleh browser, halaman terkait akan JavaScript terhidrasi untuk memungkinkan interaksi dengan elemen UI, seperti mengklik tombol.
-
Micro-frontend dapat dirender di backend dan menggunakan hyperlink untuk mengarahkan ke bagian baru situs web.
Micro-frontend sangat cocok untuk organisasi yang ingin melakukan hal berikut:
-
Skala dengan beberapa tim yang mengerjakan proyek yang sama.
-
Merangkul desentralisasi pengambilan keputusan, memberdayakan pengembang untuk berinovasi dalam batas-batas sistem yang diidentifikasi.
Pendekatan ini secara signifikan mengurangi beban kognitif pada tim, karena mereka bertanggung jawab atas bagian-bagian tertentu dari sistem. Ini meningkatkan kelincahan bisnis karena modifikasi dapat dilakukan pada satu bagian sistem tanpa mengganggu sisanya.
Micro-frontend adalah pendekatan arsitektur yang berbeda. Meskipun ada berbagai cara untuk membangun frontend mikro, mereka semua memiliki ciri-ciri yang sama:
-
Arsitektur micro-frontend terdiri dari beberapa elemen independen. Strukturnya mirip dengan modularisasi yang terjadi dengan layanan mikro di backend.
-
Micro-frontend sepenuhnya bertanggung jawab atas implementasi frontend dalam konteks terbatas, yang terdiri dari hal-hal berikut:
-
Antarmuka pengguna
-
Data
-
Negara atau sesi
-
Logika bisnis
-
Alur
-
Konteks terbatas adalah sistem yang konsisten secara internal dengan batas-batas yang dirancang dengan hati-hati yang memediasi apa yang bisa masuk dan keluar. Frontend mikro harus berbagi logika bisnis dan data sesedikit mungkin dengan frontend mikro lainnya. Di mana pun berbagi perlu terjadi, itu terjadi melalui antarmuka yang didefinisikan dengan jelas seperti peristiwa khusus atau aliran reaktif. Namun, ketika menyangkut beberapa masalah lintas sektoral seperti sistem desain atau perpustakaan logging, berbagi yang disengaja diterima.
Pola yang direkomendasikan adalah membangun frontend mikro dengan menggunakan tim lintas fungsi. Ini berarti bahwa setiap micro-frontend dikembangkan oleh tim yang sama yang bekerja dari backend ke frontend. Kepemilikan tim sangat penting, mulai dari pengkodean hingga operasionalisasi sistem dalam produksi.
Panduan ini tidak bermaksud untuk merekomendasikan satu pendekatan tertentu. Sebaliknya, ini membahas berbagai pola, praktik terbaik, trade-off, dan pertimbangan arsitektur dan organisasi.
