Run two Angular 2+ project on same server (local server)

Question

Can Any body can help me? I have two angular 6 project.Completely two different project. One project is use for Website Front View(landing pages like etc)… Second project is used for Backend view (Admin panel). Can I run together these two project and can naviagate from one project component to other project component? Help please.

Answer 1

Just use different ports, like:

Run project A: npm start --port 4200

Run project B: npm start --port 4201

And then you can access A on localhost:4200 and B on localhost:4201

Answer 2

They way I would solve it is wrapping them in another app/project, and using an app-level router establish the routes for each of the modules.

Something like:

-- src/
   -- admin/
       admin.module.ts
       admin.component.ts
       admin-routing.module.ts
   -- main/
       main.module.ts
       main.component.ts
       main-routing.module.ts
   app.component.ts
   app.module.ts
   app-routing.module.ts

From there your app-routing would have something like:

const Routes = [
    { path: '', redirectTo: '/home', pathMatch: 'full',
    { path: 'home', component: MainComponent },
    { path: 'admin', component: AdminComponent },
    // { path: 'admin', loadChildren: './admin/admin.module#AdminModule' With lazy loading

]

That way you can redirect to /admin as you would with any normal route.

PS The folder structure is just for the example's sake, you can keep whatever folder structure that allows you to have references to the corresponding modules of your projects. You might also want to take a look into Multiple app configuration with angular