Micro-frontend Angular
Module federation, kiến trúc micro-frontend, dependency dùng chung, chiến lược triển khai, mẫu giao tiếp
1Kiến trúc micro-frontend trong bối cảnh Angular là gì?
Kiến trúc micro-frontend trong bối cảnh Angular là gì?
Câu trả lời
Kiến trúc micro-frontend chia nhỏ một ứng dụng Angular monolithic thành các ứng dụng độc lập nhỏ hơn, mỗi ứng dụng được phát triển và triển khai riêng biệt. Mỗi micro-frontend có thể có repository, pipeline CI/CD và team riêng. Module Federation của Webpack 5 là công nghệ được khuyến nghị để triển khai kiến trúc này trong Angular, cho phép tải động code từ các ứng dụng khác tại runtime.
2Vai trò của Module Federation trong kiến trúc micro-frontend Angular là gì?
Vai trò của Module Federation trong kiến trúc micro-frontend Angular là gì?
Câu trả lời
Module Federation cho phép chia sẻ code giữa các ứng dụng Angular tại runtime mà không cần rebuild. Mỗi micro-frontend expose các module (remote) có thể được tiêu thụ bởi các ứng dụng khác (host). Điều này tránh trùng lặp code, giảm kích thước bundle và cho phép triển khai độc lập. Module Federation tự động xử lý loading bất đồng bộ, giải quyết dependency và chia sẻ thư viện chung như Angular core.
3Sự khác biệt giữa ứng dụng host và ứng dụng remote trong Module Federation là gì?
Sự khác biệt giữa ứng dụng host và ứng dụng remote trong Module Federation là gì?
Câu trả lời
Ứng dụng host tiêu thụ các module được expose bởi remote. Nó cấu hình các remote trong webpack.config và tải module của chúng một cách động. Một ứng dụng remote expose các module (component, service) để được tiêu thụ bởi các ứng dụng khác. Cùng một ứng dụng có thể vừa là host vừa là remote. Host kiểm soát shell của ứng dụng (header, navigation, layout) trong khi các remote cung cấp các tính năng nghiệp vụ.
Làm thế nào để cấu hình Module Federation trong dự án Angular với @angular-architects/module-federation?
Tại sao việc cấu hình shared scope trong Module Federation lại quan trọng?
+17 câu hỏi phỏng vấn
Các chủ đề phỏng vấn Angular khác
Kiến thức cơ bản TypeScript
TypeScript Nâng cao
Kiến thức cơ bản về Angular
Components và vòng đời
Services & Dependency Injection
Tổ chức Module Angular
Angular CLI
Directives và Pipes
Routing và Điều hướng
Reactive Forms
Template-driven Forms
Kiến Thức Cơ Bản RxJS
Operator RxJS
HttpClient và lệnh gọi API
Quản lý state cơ bản
Change Detection
Angular Signals
Standalone Components
Unit Testing trong Angular
Kiểm thử End-to-End
Build và tối ưu hóa
Nền tảng NgRx
NgRx nâng cao
Kiến trúc Angular
Tối ưu hiệu năng
Bảo mật và thực tiễn tốt nhất
Các mẫu RxJS nâng cao
Angular Universal và SSR
Nắm vững Angular cho lần phỏng vấn tiếp theo
Truy cập tất cả câu hỏi, flashcards, bài kiểm tra kỹ thuật, bài tập code review và mô phỏng phỏng vấn.
Bắt đầu miễn phí