CoreApp

This project was generated with Angular CLI version 7.3.1.

Main project structure

• You have one CoreApp

  • made with ng new CoreApp.

• You have 2 sub-applications (app1 and app2)

  • ng generate application app1
  • ng g application app2)

• You have library admin-lib

  • ng g lib admin-lib

• App1 and App2 can be started and developed independently:

  • npm run start:app1 and npm run start:app2
  • npm run test:app1 and npm run test:app2
  • npm run lint:app1 and npm run lint:app2
  • npm run build:app1 and npm run build:app2

• Each of App1 and App2 has its own ngRx instance, so you can use Redux-Dev-Tools to observe their Stores.

• admin-lib is a components lib and can be build and used in any of apps (CoreApp, app1 and app2)

• CoreApp includes App1 and App2 as lazy-loaded routing modules.

  • ngRx feature modules of both app1 and app2 are attached to CoreApp Store.
  • You can send actions from CoreApp to change App1 and App2 feature branches values.

Implementation details

Each of sub-application (app1 and app2) has:

• app.module.ts - for independent development
• app.module-export.ts - to be used when included in Core-App

Mostly they should be identical except app.module-export.ts has such specifics:

• RouterModule.forRoot is changed to RouterModule.forChild
• StoreModule.forRoot is removed (but feature modules should stay)
• StoreDevtoolsModule is removed as well (CoreApp has its own StoreDevtools module)

Actually these two files has be easily merged to one (todo for the future), used modules can be attached and detached just by using some CoreApp environment.ts variable

Installation notes:

• Clone github repo
• npm install OR npm i
• npm run build:admin-lib
• npm run start:Core (or any other command from package.json 'scripts' section)

Animated demo

1. Project structure

2. Starting App1, App2 and CoreApp