Choose Microapp:
Root
Angular 1
Hyperapp 0
React 15
Surplus 0
Vue 2

Microapps

Like Microservices? Then maybe Microapps are for you.

Microapps allows one to split a monolithic frontend application into smaller apps. The neat thing about Microapps is they don't even need to use the same framework! Microapps can be used to migrate from Angular to React piece by piece

Microapps also live on the same-origin. This means one can seamlessly share localStorage and cookies.

There are some limitations when using Microapps. Microapps are organized around the path prefixes, therefore one needs to be able to control the paths on a site in order for the correct Microapp to be loaded.

Switching between Microapps is as simple as using an <a> element.

Sample

This website is composed of 6 Microapps: Root, Angular 1, Hyperapp 0, React 15, Surplus 0, and Vue 2.

The Microapps are built using a single Webpack config. This allows one to start a single Webpack Dev Server and work on different Microapps, but treat it as if its a single large application. Webpack also enables sharing of code between Microapps. In a production scenario the CommonsChunkPlugin would be used to extract the common code out of Microapps.

Source Code on GitHub

Questions? Comments? Tweet me @pyrolistical