(Asking for a friend ;-) )
I'm working with Web (react) and Mobile (IOS, Android) teams. And I find that even with a microservices architecture we end up always doing duplicated work at the front end/client level. How to implement a microfrontends architecture that reduces duplication of frontend work but still provides a high quality experience for native clients?
more context:
I've read Cam Jackson's microfrontends article and browsed Michael Geers' microfrontends blog. And I realise that we are closer to the Microservices pattern:
Than the Microfrontends one:
This is mostly due to Conways law. Even with dedicated teams that own a full product we still have dedicated teams only for IOS and Android native work. Every new discrete piece of functionality, even with a clear bounded context at the API/Service level, ends up being fragmented into multiple different front end implementations of the same feature/component mostly to support Native Apps(that demand that every component that runs in the native apps has to be native). That got me thinking of implementing micro-frontends. In an ideal world there wouldn't be any dedicated native apps teams and ios and android developers would integrate the corresponding product teams (as described in the image above). But that isn't an option.
Given that our web app has the same look and feel as the mobile app. Is it a good idea to create a single web component as part of the microfrontend and consume it in the native apps with embedded webviews? Would that be considered a microfronends architecture? What are the drawbacks from that approach?
That way the same team that builds the responsive web component will be responsible for that feature end to end. And leave only the core user journeys and native specific features (like AR and barcode scanning) to run as native components.