Less is more. Why your front-end team should start using micromodules.

Too big to work with

It’s not a code style. It’s not some developer wish to make code beautiful or something. Microservice architecture is something that really affects your user experience and your business.

Here’s a list of some issues you can face, that prevent your ability to efficiently deliver high-quality UX to your customers:

• You want to build new functionality, but it becomes a challenge to find a place to integrate new features in the monolithic codebase.
• Your delivery rate is increasing. Several teams work on the same product, but complexity and interconnectivity between modules make everyone step on the toes of the others.
• Untestable code base. One day your monolith frontend app will become buggy unmanagable substance, which is impossible to cover with tests. This means buggy UX and dissatisfied customers, who would stop pay for your app.

Think small. Think Micromodules.

The healthy alternative is building Micromodules.

Micromodule is an independent application that connects with other micromodules to form a bigger application.

If one micromodule stops workings, the whole application continues to operate.

Adopting of Micromodule architecture affects not only your code base making it more maintainable, but makes your teams more autonomous. It changes the way your team upgrade software.

Building a product is always balancing between legacy code maintenance and delivering new features. Micromodule architecture gives you an ability to mitigate the risks of ‘update of stop’ situation when you should update some big monolith code to be able to deliver new features.

Not only logic. Build reusable UI components.

Micromodule architecture can also be applied to UI development.

UI library is great for 2 reasons:

• visual consistency of UI
• reuse of elements and time savings

Before we started to use the UI library we had tons of visually same components. The real loss comes when we update some widely used components, like button or card in the interface. It means that developers had to update a lot of components instead of one.

In Vectorly we use https://zeroheight.com/, which is an easy way to document UI components for designers and developers, you can start here.