欢迎小伙伴们推荐微前端优秀的学习资源 —— awesome-micro-frontends
微前端是一种类似于微服务的架构,它将微服务的理念应用于浏览器端,即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用还可以独立运行、独立开发、独立部署。
框架
中文资源
- 黄峰达 - 为什么微前端开始在流行:后端解耦,前端聚合
- 黄峰达 - 微前端的那些事儿
- 李熠 - 微前端说明书
- Belllee - 微前端简介
- 方应杭 - 微前端入门
- Vincent.W - 了解什么是微前端
- 王下邀月熊 - 微前端的设计理念与实践初探
- 云峰yf -【译】我不懂微前端(前端微服务)
- 云峰yf - 【译】采用微前端架构
- 黄峰达 - 微前端如何落地?
- 黄峰达 - 实施前端微服务化的六七种方式
- Fundebug - 如何实现前端微服务化
- Supernavy - 个推前端微服务化:突破传统SPA瓶颈
- Trotyl Yu - 精致化的微前端开发之旅
- 每日优鲜大前端团队 - 每日优鲜供应链前端团队微前端改造
- 美团技术团队 - 用微前端的方式搭建类单页应用
- 美团技术团队 - Bifrost微前端框架及其在美团闪购中的实践
- 前端之巅 - 网易严选企业级微前端解决方案与落地实践
- Kuitos - 可能是你见过最完善的微前端解决方案
- 徐海峰 - 使用 Angular 打造微前端架构的 ToB 企业级应用
- 张亚涛 - 带你手写微前端框架
- 张亚涛 - 微内核架构在大型前端系统中的应用
- Kiliwalk - 微前端实践
系列教程
- Alili.tech - 前端微服务化解决方案1 - 思考
- Alili.tech - 前端微服务化解决方案2 - Single-SPA
- Alili.tech - 前端微服务化解决方案3 - 模块加载器
- Alili.tech - 前端微服务化解决方案4 - 消息总线
- Alili.tech - 前端微服务化解决方案5 - 路由分发
- Alili.tech - 前端微服务化解决方案6 - 构建与部署
- Alili.tech - 前端微服务化解决方案7 - 静态数据共享
- Alili.tech - 前端微服务化解决方案8 - 二次构建
第十四届 D2 微前端专场
Angular
React
Vue
示例
书籍
英文资源
下列英文资源主要来源于 Rajasegar - awesome-micro-frontends 项目,感谢 Rajasegar Chandran 的无私分享。
Concepts
Posts
- Building Micro Frontends with React, Vue, and Single-spa
- 6 Patterns for Microfrontends
- Micro Frontends by Cam Jackson
- Micro frontends - a microservice approach to front-end web development
- Microservices to Micro-Frontends
- Cookie Cutter Scaling
- Microservice Websites
- What is a micro frontend
- ThoughtWorks Technology Radar
- Dynamic vs. static ui composition
- Micro-libraries: The Future of front-end development
- The monolithic frontend in the microservices architecture
- A Software Architect's Approach towards MicroFrontends
- An approach to building Scalable Web Apps
- A Take on Micro-Frontends
- Building Microfrontends - Series
- Including Front-End Web Components Into Microservices
- Microservice Grid and Micro Frontends
- Microservice Websites
- Microservices to Micro-Frontends by Sandeep Jain
- Front-end microservices with Web Components
- Supporting Micro-frontends with ASP.NET Core MVC
- Building micro frontends — angular elements
- Micro Front-Ends: Webpack Manifest
- My experience using micro frontends by David Den Toom
- Page Building using Micro-Frontends and Server-Side Include
- Strangling a Monolith to Micro-frontends with Laravel, Vue.js, and Hypernova
- Serverless Micro-frontends using Vue.js, AWS Lambda, and Hypernova
- Using Micro-Frontends in WordPress with Gutenberg Blocks
- Taming the Frontend Monolith
- Micro-frontend Architecture: Replacing a Monolith from the Inside Out
- Breaking down the last Monolith - Micro Frontends
Videos
- Micro Frontend - Web Rebels, Oslo 2018
- Break Up With Your Frontend Monolith - JS Kongress 2017
- Youtube Playlist - Micro Frontend Talks
- Microservice Websites by Gustaf Nilsson Kotte
- Breaking The Monolith
- Microservice UI Composition
- Introduction to Piral
Slides
- Micro Frontends - JSUnconf.eu 2017
- Micro Frontend - Web Rebels, Oslo 2018
- Migrating from Monolith to Microfrontends
- Microservice Websites (microXchg 2017)
- Microservice Websites Presentation
- Avoid the Monolith by Michael Geers
- Micro Frontends by Michael Geers
- Micro Frontends - The Nitty Gritty Details or Frontend, Backend, 🌈 Happyend
- Micro Frontends by Assaf Gannon
- Micro Frontends by Srikanth Jallapuram
- Micro Frontends: Building a modern webapp with multiple teams by Michael Geers
- Introduction to micro frontends by Kuba Holak
- Microfrontends architecture by Lucca Mezzalira
- Lets talk about Micro Frontends
- Micro Frontends - a strive for fully verticalized systems
- Building micro-frontends by Luca Mezzalira
Experience Reports
- Upwork: Modernizing Upwork with Micro Frontends
- allegro: Managing Frontend in the Microservices Architecture
- Hello Fresh: Front-end Microservices
- OpenTable: Microservices in the Frontend World
- OpenTable: Dismantling the monolith
- 5 years of OpenComponents
- AutoScout24: UI Composition
- Klarna Checkout
- Spotify: Technology Stack
- Let's build a Webshop out of Micro Frontends
- Using Micro-Frontends to Permanently Solve the Legacy JavaScript Problem
- Micro Frontends with Gustaf Nilsson Kotte
- Experiences Using Micro Frontends at IKEA
- Microservice Websites: Building consumer-facing websites with multiple teams
Related
- Angular_MicroApps_Different_Technologies
- A tiny, fast, zero-dependency event emitter
- Exercises for course "Integrating microservices on the frontend"
- Extending the microservice paradigms to web development
- Micromono
- Microservices in the frontend with BFFs providing their own bundles and API.
- Proxy middleware for express that enables composition of microservices.
- Service Oriented Front-end
- Simulate a micro frontend project using NodeJS, React and NGinx Reverse Proxy in Alpine Docker images
Platforms
Awesome Micro Frontends
本人的全栈修仙之路订阅号,会定期分享 Angular、TypeScript、Node.js/Java 、Spring 相关文章,欢迎感兴趣的小伙伴订阅哈!
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。