Hey everyone,
I’m working on a project that uses a micro frontend approach. It’s made up of 5 different single-page apps (SPAs). Two are built with Angular, two with React, and one with Vue.js.
Right now, I’ve got a server that handles routing and serves the right files for each app. But I’m stuck on how to share data between these apps without relying too much on the database.
I want to find a way for the apps to communicate with each other directly if possible. Has anyone dealt with this kind of setup before? What’s the best way to handle data sharing in a micro frontend architecture?
Any tips or suggestions would be super helpful. Thanks in advance!
yo Finn, cool project! ever thought bout usin a browser storage solution? localstorage or sessionstorage could work for sharin data between ur SPAs. just make sure to handle conflicts n syncing. might be worth a shot!
hey, that’s an intresting setup. have u tried a shared state system like redux or a message bus for pub/sub? it might help decouplin the apps. what kind of data are u sharin?
Have you considered implementing a BFF (Backend for Frontend) layer? This approach could serve as a centralized API gateway for your micro frontends. It can aggregate data from various sources, handle caching, and provide a unified interface for all your SPAs. This way, you can minimize direct communication between frontends and reduce database dependencies. Additionally, you could explore using WebSockets for real-time data sharing if that’s applicable to your use case. Just ensure you design clear contracts between your micro frontends and the BFF to maintain modularity and scalability.