Angular App Architecture
The sources in the app can be organised like this:
1. src folder
The src folder contains all the project's source files.
| Folder | Content |
|---|---|
| app | application sources |
| assets | embedded resources (images, fonts, icons etc.) |
| environments | environment based configuration files (dev, prod) |
2. app folder
The app folder is decomposed in different modules according to their respective responsibilities.
| Folder | Content |
|---|---|
| . | AppModuleAppRoutingModuleAppComponent |
| core | Common services instantiated once at the start of the application. Loading of essential functionnalities required by all the application (e.g: Authentification) |
| page module | A module defined for a specific page |
| ui | Reusable modules for pure presentational components (e.g: dumb components) |
3. page module folders
Each custom module created should match a business functionnality. The content of a page module is a coherent set of components.
| Folder | Content |
|---|---|
| components | Components used inside this module. Contains both presentation (dumb) and business-oriented containers (smart) components |
| pages | Page using the components of the module |
| shared | shared elements in the module or re-exported (pipes, directives, services) |