Micro Frontend Architecture

Micro front end architecture is an extension to microservices leveraging all its benefits on the front-end parts of the application. Scalability issues of back-end systems are solved via microservices on the backend wherein you split the backend into multiple smaller standalone services which can be independently developed, deployed and scaled. Micro front end architecture is all about applying microservice design principles on the front-end parts of an application.

Like the monolith back-end, the front end of an application faces below issues:

  • Grows into a large monolith over a period of time.
  • Serious maintenance issue arises as a large front-end code base needs a larger team to maintain it.
  • Small change needs full-blown regression testing which then leads to communication problems.
  • Open source package dependencies increase as code and dependencies grow further.
  • It gets harder to refactor or migrate to newer technology in the future.
  • Code and testing complexity increases over a period of time since all features are intertwined. 
  • Eventually, the existing framework becomes old & legacy and there are very few people available to work on such a legacy framework.
  • Eventually, Innovation and releases slow down which becomes detrimental to business.

Micro front end architecture helps solve these issues in the following ways:

  • Monolith frontend gets broken down to smaller components.
  • Each component has its own backend microservice API to communicate with.
  • Each component talks to its API and developed as an end-to-end feature (as shown below).
  • Each section/ component is independently developed, deployed and managed by a dedicated team who works on a specific component & its API without affecting the other component in any way.
  • Base App acts as a shell which houses all the micro frontend components and is used for sharing data or sessions.
  • The frontend components can be tech agnostic as well wherein each component can be either be developed using different frameworks like Angular, React or Vue.js.
  • Thereby the project gets divided into a cross-functional group of developers who owns each component frontend and its backend API right from development to deployment.

This blog has been co-authored by Roshit Rajan

Roshit Rajan is a BE graduate from Mumbai University. Started off his career in IT as a VB6 developer and then went ahead to work on Niche .NET Technologies and related frameworks. Over the last 15 years of his IT experience, he has worked with various US and Europe based clients and has experience in Healthcare, Insurance & E-Commerce domain. Apart from being passionate about technology, he loves going for long Treks and spending quality time with family and close friends.

Manjunath Poola

About

Manjunath Poola is a Senior Manager in Sogeti India, Microsoft Practice. He serves as SharePoint Architect, actively involved in designing, solutioning for legacy transformation projects to latest SharePoint versions both onPrem and On O365.He has experience of over 18 years in IT industry and has worked in variety of industries including Retail, Utilities, Pharma, Manufacturing, Finance and Media. Manjunath has excellent problem solving skills, dedication to customer service and advanced communication skills. These skills has enabled him to deliver quality products exceeding customer expectations in various engagements.

More on Manjunath Poola.

Related Posts

Your email address will not be published. Required fields are marked *

9 + 5 =