Microfrontend Architecture
Why & How
Kevin C Chen
image src: http://blog.d3banking.com/blog/how-can-microservices-benefit-your-bank-or-credit-union
New Challenges
Cohesive
UX
Team
Velocity
Era of Microservices
Different Tech Stacks
New Challenges
-
UI for Microservice Backend
- How should we develop UI in the era of microservices?
- How should we develop UI in the era of microservices?
-
The need for speed and scalability in the organization
- How to enable the teams with the autonomy they need for velocity and continue to scale?
-
Consistent UX across web applications
- How to support the development of separate UIs with cohesive user experience?
- How to support the development of separate UIs with cohesive user experience?
-
Different Tech Stacks
- How do we support frontends build with different library or frameworks? Are technologies exist already to implement the solution?
- How do we support frontends build with different library or frameworks? Are technologies exist already to implement the solution?
What is Microfrontend?
- Microfrontend is the architecture and strategy that enable multiple teams to work seamlessly together by fostering end-to-end ownership of independently developed, tested and deployed features to create modern web applications with various technologies.
The web application becomes a composition of features which are owned by independent teams. Each team has a distinct area of business or mission it cares about and specialises in.
When speaking of organization, people...and outcome
Why you would consider Microfrontend?
- Enable and scale independent Frontend development and release workflow with high velocity
- Offers user a cohesive UX with a consistent look-and-feel
-
Protect existing frontend investment - Not to break already available legacy server rendered Web App or build with for major JS frameworks
(e.g. React, Angular, Vue)
- Polyglot development with freedom of tech stack choice
Example Use Case
Example Use Case
DEMO
Microfrontend Architecture Why & How Kevin C Chen image src: http://blog.d3banking.com/blog/how-can-microservices-benefit-your-bank-or-credit-union