How to create multiple apps in one project with angular

In this angular tutorial, we are going to show how to organize multiple apps in one workspace.

Advantages of multiple apps in one projects:-
1. The time consuming "npm install" for every app will reduce,
2. The "node_modules" which takes a huge amount of space for an app, will be shared with all other apps and saved disk space,
3. All the apps can be updated to the next version easily,
4. A single version control repository

In order to do that, first, we will create an empty workspace by using angular CLI and the command is ng new multipleApps --createApplication="false". This command creates a folder with the name multipleApps and configures the workspace without creating any apps.

We are creating 3 apps as per our requirement, using the below commands:-
1. ng generate application authentication,
2. ng generate application admin,
3. ng generate application customer

The external two libraries have been used in this tutorial and below are the details for those libraries:-

Below is the source code repository link

If you like this video please hit the like 👍 button and do subscribe 💙😊 to this channel for more videos.

DISCLAIMER: Copyright Disclaimer under section 107 of the Copyright Act 1976. Any reproduction or illegal distribution of the content in any form will result in immediate action against the person concerned.

[vartikasingh]

This is really very helpful 👍🏻 Great 🔥🔥

[nishantkumr]

Hi. Thanks for this video. I have a scenario where I want to run two different apps in single project with two different styles. But I want to have a shareable service. How can we achieve this? Should I build a library of sharedmodule service? Any reference or idea would be great.

[santomy]

I have a scenario where i need to other angular projects to be on a tabgroup on the main project. I need to add and remove these tabgroups as i wish . Is it possible

[jackpetrol]

can different angular version into single one?

[ShiwangRajbhoi]

coding for straight 30 mins and then running the app without any flaws. And here I get 3 errors in my hello world :D JK

[iShivaniChowdhary]

I need one help, I have a component in my base app(say your auth app) which I need to share in my other apps in the workspace, how to achieve that without re-creating the component in other apps. Ex- I have a left menu component and all my menus are an app itself, then on click of left menu, those separate apps will get activated, so first question is, is this scenario even a possibile in angular, where 2 separate apps stay activated at the same time, like my left menu will stay intact no matter whatever app is showcasing in the rest of the screen.