Wouldn’t it be cool to deploy and operate Microfrontends just like Microservices in independent containers on an orchestration platform such as Kubernetes?

Well, with the latest Mashroom Portal version 1.3 this is actually pretty simple, since it can scan Kubernetes namespaces for Microfrontends and register them automatically. It also supports now the AMQP protocol and can use RabbitMQ, ActiveMQ or even the Azure Service Bus for server side messaging, which allows Microfrontends to exchanges messages across browsers and users.

The platform

Such a platform could look like this:

The building blocks are:

A Kubernetes cluster

A Mashroom Portal for the Microfrontend integration with the following plugins:

* @mashroom/mashroom-storage-provider-filestore

* @mashroom/mashroom-security-provider-simple (simple JSON credential store)

* @mashroom/mashroom-portal-remote-app-registry-k8s (Microfrontend discovery)

* @mashroom/mashroom-session-provider-redis

* @mashroom/mashroom-websocket

* @mashroom/mashroom-messaging

* @mashroom/mashroom-messaging-external-provider-amqp

* @mashroom/mashroom-storage-provider-filestore * @mashroom/mashroom-security-provider-simple (simple JSON credential store) * @mashroom/mashroom-portal-remote-app-registry-k8s (Microfrontend discovery) * @mashroom/mashroom-session-provider-redis * @mashroom/mashroom-websocket * @mashroom/mashroom-messaging * @mashroom/mashroom-messaging-external-provider-amqp A Redis cluster for Portal session storage

A RabbitMQ as message broker

A bunch of Mashroom Portal compliant Microfrontends

Thanks to Kubernetes all building blocks are high available and can be scaled horizontally.

We’ve created a GitHub repo with an example Mashroom Portal setup and example Microfrontends. It also contains scripts to setup the whole system within minutes on Google Kubernetes Engine. Check it out!

How to use

After setting the platform up as described here, you can deploy any Mashroom Portal compliant Microfrontend and it will be registered by the Portal within seconds. The /portal-remote-app-registry-kubernetes page will show you the currently registered Microfrontends:

After that you can add the registered apps to any page in the Portal (via Add App in the admin toolbar). Here a page with the two demo Microfrontends from the example repo added:

Notes

Typically there would be an Identity Provider, either the existing one of your company or for example a Keycloak as part of the platform. Either way, you need to write a security provider plugin to connect it to the Mashroom Server. (A OpenID Connect security provider is on the Mashroom Roadmap)

Instead of an external NFS store you might consider a cloud native store such as Gluster or StorageOS. You could also store the Portal configuration in a database like mongoDB, but then you have to write a new storage provider plugin (A mongoDB storage provider is also on the Mashroom Roadmap)

A CI/CD pipeline to deploy the Portal and the Microfrontends automatically after code changes. You could deploy Jenkins on the cluster, install Spinnaker or use a Cloud service such as Google Cloud Build

Check out the updated version 2 described in this article!