Exploring Microfrontend Architecture for DHIS2 Web Apps Integration

Hi everyone,

I’m currently working on a web application that needs to integrate another DHIS2 web app—which is no longer maintained. My goal is to implement a microfrontend architecture where App1 (the host) incorporates App2 (the legacy/external app).

To achieve this, I’m experimenting with Webpack Module Federation. I’m running App2 on port 3001 and App1 on port 3000, with the intention of having App1 load and render App2 dynamically.

This approach could potentially expand how we build and scale DHIS2 web apps. However, I’m unsure whether this will work as expected—especially since I’m using custom Webpack configurations instead of the standard d2-app-scripts start command typically used for DHIS2 development.

Here are a few open questions I’m grappling with:

  • Is it even feasible to run and integrate a DHIS2 web app this way?
  • Would a microfrontend bundle like this work when deployed on a DHIS2 instance?
  • Will it build properly, or break due to DHIS2’s bundling and app shell expectations?

An alternative would be to copy the components from App2 directly into App1 and refactor them as needed. While that would simplify deployment, it also means more upfront integration work and possibly a loss of separation of concerns.

If anyone has tried this kind of setup—or has insight into microfrontend architectures within the DHIS2 ecosystem—I’d love to hear your thoughts. Is there a better way to approach this?

Thanks in advance!