In my MERN I have a main HTML, EJS template with JS codes. Users after authentications could choose several products that each products has been developed by create-react-app and each have their own builds.
Assume that I have 2 react apps with their own bundle. So after use request to select one product based on a link ( for example : mydomain.com/prod1 ) the first react product build should be used. For the second product ( for example : mydomain.com/prod2 ) the second react build should be used and so on.
I have no idea how could I do that.
Currently, for one product I could make the bundle and basically use the below code in node that load the build for the first product. Obviously if I have more products then I do not know understand how node understand which folder should be served to the client.
app.use(express.static(__dirname+'/prod1/build/');
thanks
you want to build a micro-fronted app i think one way you can do it is serve the built react apps in an frame into your main template like at two pages and inject an iframe in them and one the clicks prod1 -> you get html prod1 which injects an iframe with the prod-1 react page in it and like that you can share both apps in the same template , there is a lot of optimization you can add , i even may suggest that the main app would be a react app too so you can have more control over it here is a link of a repo explaining the concept and you can check google for any more information about micro front-end it's easy but complex in the same time