How to stitch it all tog…

How to stitch it all together? Let’s say we have a webshop, a blog and a userfeedback application in our nx workspace… We create a lib with UI components and there we have a header component that will be placed at the very top of each application.

Then we start our apps and want to navigate between them in our header component.. We could just link to localhost:4200, localhost:4300, localhost:4400 etc.. but is there a cleaner way? and how do we handle this for the production builds?

Responses:

My first reaction would be to say: I would link to /userfeedback /store /and /blog and configure each of those apps to run from a subdirectory with each respective name

hmm.. so how would you set that up to work on both local and prod?

Prod I would host with something like AWS S3. You could also use something like nginx to serve up the apps from the correct routes.

For local, links within each app should work just fine. Linking from one blog post to another for example. But, if you wanted to be able to link from the store to the blog locally, that would be a different story

I don’t really like running nginx locally for dev environments these days, but that would solve the problem

hmm.. I was more looking for some config as in the workspace.json has as a default..

Will do some more digging :slightly_smiling_face:

yeah, let me know if you come up with a better solution.

when I look at what you’re talking about it makes me think of a micro front end type thing, so I’d want some parent thing to wrap the three, what I would call sub apps. I’m definitely interested to know what you settle on as a choice

Do you often need to run all the apps simultaneously in dev? Or features you develop just touch or 2 apps the most of time?

I would not say most of the time but now and then yes.. the admin app + 1-2 other apps most of the time

In my current job we frequently run 2 apps simultaneously (front-end in Angular and back-end in Node). We do use the way you describe as localhost:4200, localhost:4300, localhost:4400 launching the serve commands in different terminal tabs. I guess you could add a script in your package.json to launch all the apps you need, but it may not be convenient as you won’t get builder logs for all of them.

the problem is not to start them :smile: it’s more about routing.. let’s say that you have the same top menu navigation for all apps.. what do you use as route path?