Guest post originally published on Mia-Platform‘s blog by Mia-Platform Team

What is micro frontend orchestration? And, what are the bene5fits of micro-lc? Read the article below to discover everything you need to know about it – it is already available on GitHub and all the community can freely contribute.

Micro frontends: what are they and what do you need them for?

In the last decades, developers have been used to breaking down the most complex elements into small, independent, standardized components and therefore more easily manageable and reusable.

The microservices architectural pattern has become popular as it allows to simplify and speed up the development of applications; in the same way micro frontends were born and they apply to the frontend the same decoupling logic that microservices perform for the backend. The goal is to unpack a frontend application into a series of reusable and modular components. This also allows you to improve the agility of new frontend features releases.

Mia-Platform micro-lc architecture

micro-lc: characteristics and benefits

micro-lc is the component for micro frontend orchestration created by Mia‑Platform, which allows you to make the development experience consistent. micro-lc simplifies the management of micro frontends through an application. It includes all the backend and frontend parts, and allows their extension via plugins, which is necessary to develop frontend applications, thus speeding up the time-to-market of new solutions.

micro-lc is composed of two releasable entities: a frontend part and a backend part.

The frontend part consists of a container that provides a series of cross-application functionalities that can be used to configure each connected frontend.

Among the features you can find:

Mia‑Platform also provides a series of core and open‑source plugins for micro-lc.
microlc-element-composer, for example, allows you to compose the UI of the page dynamically, to create horizontal micro frontends.

From the backend section you can manage the configurations that define the elements of the frontend, the user authentication, and configurations in general.
micro-lc does not manage or authenticate users directly, but allows you to configure authentication endpoints, which will then be managed by an Authentication Provider.

The frontends are designed with Qiankun, a framework that injects the frontends into the DOM. In this way it is as if they are organically inside your application and integrated with each other (as opposed to what happens with iframes, where the frontends are isolated).

micro-lc is integrated with Mia‑Platform Console: if you already use Mia‑Platform Console you can select the Plugin from the Marketplace and start a frontend application in a few clicks.

Mia-Platform micro-lc diagram

The benefits of micro frontend orchestration with micro-lc

As anticipated, the use of a micro frontend orchestrator like micro-lc allows you to improve the micro frontend development experience, simplifying the orchestration and abstracting the language used.

micro-lc is a component integrated into the Runtime phase.
Unlike the Buildtime integration – which requires you to release all the elements every time a change is made – the Runtime integration allows you to simplify the release.
Once a new configuration has been released from the backend section, you need to simply reload the page to see the changes of the individual components, without releasing all the elements individually.

micro-lc is so flexible that allows you not only to create new frontend applications, but also to migrate from a monolith frontend to a micro frontend architecture, which will be faster and more agile.

micro-lc is extremely configurable: the layout can be modified by inserting the brand’s graphic assets, thus offering a personalized user experience.

micro-lc is an open‑source project: this means that anyone who is part of the community can give feedback and contribute to the evolution of the product. Try micro-lc, let us know what you think and contribute with your ideas!

Go to the GitHub project or to the documentation.