3 Questions To Ask Yourself When Moving To Micro Frontends

Micro frontends help enterprises move with greater agility by breaking up a previously monolithic structure of the frontend. Here are 3 questions to ask yourself as you make the switch.

Entando - mardi 15 décembre 2020
Tags: Technical

Micro frontends are becoming a growing trend, with a number of large organizations employing them to great success. And as more organizations are adopting this kind of frontend architecture to experience greater agility in creating better UX, you may be considering a switch to micro frontends yourself.

And while micro frontends boast great benefits, you’ll also need to make some important considerations as you transition toward them, whether for a current legacy app or something net new you're planning on developing in the future.

Here are 3 questions you should ask yourself when transitioning to a micro frontend architecture that will guide you through the process.

1. How ready is my team?

Vital to the success of your transition to a micro frontend architecture is organizational readiness. You won’t get much out of a modular architecture if your organization operates in a monolithic way, namely if your team structure requires top-down decisions or that everything be defined at once.

So as you look to make the move to micro frontends, it will be important to evaluate how ready your team is to operate with that frontend modularity. Do you need to reorganize your team structure? Do you need to revise your decision making process in order to push decisions to separate teams? Does each team have a clearly defined business goal, and are they empowered to move toward that goal independently? 

Micro frontends are far more than simply a technology choice. Deciding to develop in this way goes hand-in-hand with any number of organizational concerns for your teams. 

2. How will I compose my app’s micro frontends?

There are a few different approaches you can take with regard to composing your separate pieces of functionality into one experience for the end user. You’ll want to consider which makes the most sense for your organization. 

One way to compose your micro frontends is by using iFrames, as does Spotify. What’s great about this method is that it provides strong independence and clear isolation. But iFrames can be a challenge in that they can be inflexible and difficult to route and link. Another way to compose micro frontends is through Javascript integrations with single page applications. This approach allows for much greater flexibility, but it can be difficult to standardize your approach and ensure proper decoupling.

The approach we take to composing micro frontends here at Entando is by using web components, which enables us to create reusable custom elements. They are open spec and well understood, and they allow us to clearly define boundaries and contract driven communication. While it does require a bit more training and skill to compose in this way, you can use standard tools and capabilities, including all modern Javascript frameworks. 

3. What will we develop (or what will remain) as part of the base application?

Another important consideration to make when transitioning to micro frontends is determining which parts of your application actually need to exist as micro frontends and what can remain as part of the base application. When transitioning a legacy app that has a pre-existing frontend monolith, this can be particularly challenging, because you have to consider how much effort will be required to decouple certain aspects of your functionality. 

However, even when you are building a net new application with micro frontends, you will need to think intentionally about how big your micro frontends should be, as well as what each should include. If you make your micro frontends too large, you may end up with more of a distributed monolith as opposed to a micro frontend architecture. Conversely if you make them too small, they don’t really serve much purpose other than to overly complicate your code. So you’ll want to search for that “just right” size. 

And while there’s no hard and fast rule, one good way to determine the appropriate size of a micro frontend is to define the independent business goal it achieves. If you can structure your architecture around business goals with independent micro frontends, you’ll be well on your way to experiencing the benefits that kind of isolation has to offer.

Build Kubernetes-native apps with micro frontends using Entando.

When release cycles take months instead of weeks, your business is left unable to deliver modern online experiences. Development and deployment bottlenecks slow your ability to make application updates, keeping you from iterating and innovating. And outdated or clunky UX keeps you from winning customers over and retaining them.

So that’s why we created a platform to help you get your ideas to market faster.

Entando is the leading micro frontend platform for building enterprise web apps on Kubernetes. We want to change the way enterprises think about building their apps, sites, and portals in order to innovate more quickly.

With Entando, you can:

  • Leverage customized blueprints using the Entando Component Generator (built on JHipster) to quickly create micro frontends and assemble them into an app.
  • Reuse UI/UX components across multiple projects via the Entando Component Repository, saving money and increasing development speed. 
  • Scale apps quickly and effectively with Entando’s custom Kubernetes operator, automating the deployment of high availability, self-healing applications. 
  • Centrally manage user roles with Entando Identity Management (built on Keycloak).

Entando is open source with available enterprise support and services. Begin developing on the platform today, and get a quote to see how our team can help your enterprise build better apps, sites, and portals--faster.

Entando_Tuesday_Blog_Post.jpg

WHITE PAPER

CIO Alert - There is an Application Composition Platform in your Future

By Massimo Pezzini, Independent IT Advisor

Téléchargez

White-Paper-Pattern_mockup 3.png