Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save KangHidro/15b4edeb3da934a5072e6f889514abd1 to your computer and use it in GitHub Desktop.
Save KangHidro/15b4edeb3da934a5072e6f889514abd1 to your computer and use it in GitHub Desktop.
Demo Angular Structure. Angular 14 introduced standalone component, so I make some changes in "shared" folder. Angular 17 introduced standalone application, so I make breaking change in all structure project.
src
├─ app
│ ├─ auth (Folder)
│ │ ├─ auth routes config (File)
│ │ ├─ login (Standalone-Component)
│ │ ├─ register (Standalone-Component)
│ │ └─ ...
│ │
│ ├─ core (Folder)
│ │ ├─ core providers config (File)
│ │ │ (if you want to separate appConfig.providers in app.config.ts)
│ │ ├─ constants (Files)
│ │ ├─ guards (Functional Files)
│ │ ├─ interceptors (Functional Files)
│ │ ├─ validators (Functional Files)
│ │ ├─ models
│ │ │ ├─ common (Files)
│ │ │ ├─ main (Files)
│ │ │ ├─ management (Files)
│ │ │ └─ ...
│ │ ├─ services
│ │ │ ├─ auth (Service Files)
│ │ │ ├─ common (Service Files)
│ │ │ ├─ main (Service Files)
│ │ │ ├─ management (Service Files)
│ │ │ └─ ...
│ │ └─ ...
│ │
│ ├─ layouts
│ │ ├─ main (Folder)
│ │ │ ├─ main-footer (Standalone-Component)
│ │ │ ├─ main-header (Standalone-Component)
│ │ │ └─ main-layout (Standalone-Component)
│ │ ├─ management (Folder)
│ │ │ ├─ management-footer (Standalone-Component)
│ │ │ ├─ management-header (Standalone-Component)
│ │ │ ├─ management-layout (Standalone-Component)
│ │ │ └─ management-sidebar (Standalone-Component)
│ │ └─ ...
│ │
│ ├─ main (Folder)
│ │ ├─ main routes config (File)
│ │ ├─ homepage (Standalone-Component)
│ │ ├─ my-info (Folder of Standalone-Components)
│ │ │ ├─ edit-info (Standalone-Component)
│ │ │ ├─ check-info (Standalone-Component)
│ │ │ └─ ...
│ │ └─ ...
│ │
│ ├─ management (Folder)
│ │ ├─ management routes config (File)
│ │ ├─ dashboard (Standalone-Component)
│ │ ├─ categories (Folder)
│ │ │ ├─ academic-ranks (Folder of Standalone-Components)
│ │ │ │ ├─ list-academic-ranks (Standalone-Component)
│ │ │ │ └─ form-academic-ranks (Standalone-Component)
│ │ │ └─ ...
│ │ └─ ...
│ │
│ ├─ shared (Folder)
│ │ ├─ component-shared (Folder of Standalone-Components)
│ │ │ ├─ view-file (Standalone-Component)
│ │ │ └─ ...
│ │ └─ widget (Folder)
│ │ ├─ directives (Folder of Standalone-Directive)
│ │ ├─ pipes (Folder of Standalone-Pipes)
│ │ └─ ...
│ └─ ...
├─ assets
│ ├─ css
│ ├─ img
│ ├─ libs
│ ├─ fonts
│ ├─ files
│ ├─ pdfs
│ └─ languages
└─ environments
src
├─ app
│ ├─ auth (Module)
│ │ ├─ login (Component)
│ │ ├─ register (Component)
│ │ └─ ...
│ │
│ ├─ core (Module)
│ │ ├─ constants (Files)
│ │ ├─ guards (Files)
│ │ ├─ interceptors (Files)
│ │ ├─ validators (Files)
│ │ ├─ models
│ │ │ ├─ common (Files)
│ │ │ ├─ main (Files)
│ │ │ ├─ management (Files)
│ │ │ └─ ...
│ │ ├─ services
│ │ │ ├─ auth (Files)
│ │ │ ├─ common (Files)
│ │ │ ├─ main (Files)
│ │ │ ├─ management (Files)
│ │ │ └─ ...
│ │ └─ ...
│ │
│ ├─ layouts
│ │ ├─ main (Module)
│ │ │ ├─ main-footer (Component)
│ │ │ ├─ main-header (Component)
│ │ │ └─ main-layout (Component)
│ │ ├─ management (Module)
│ │ │ ├─ management-footer (Component)
│ │ │ ├─ management-header (Component)
│ │ │ ├─ management-layout (Component)
│ │ │ └─ management-sidebar (Component)
│ │ └─ ...
│ │
│ ├─ main (Module)
│ │ ├─ homepage (Component / Module of Components)
│ │ ├─ my-info (Component / Module of Components)
│ │ └─ ...
│ │
│ ├─ management (Module)
│ │ ├─ dashboard (Component / Module of Components)
│ │ ├─ categories (Module)
│ │ │ ├─ academic-ranks (Module)
│ │ │ │ ├─ list-academic-ranks (Component)
│ │ │ │ └─ form-academic-ranks (Component)
│ │ │ └─ ...
│ │ └─ ...
│ │
│ ├─ shared
│ │ ├─ component-shared (Folder)
│ │ │ ├─ view-file (Standalone Component)
│ │ │ └─ ...
│ │ └─ widget (Folder)
│ │ ├─ directives (Folder of Standalone Components)
│ │ ├─ pipes (Folder of Standalone Components)
│ │ └─ ...
│ └─ ...
├─ assets
│ ├─ css
│ ├─ img
│ ├─ libs
│ ├─ fonts
│ ├─ files
│ ├─ pdfs
│ └─ languages
└─ environments
src
├─ app
│ ├─ auth (Module)
│ │ ├─ login (Component)
│ │ ├─ register (Component)
│ │ └─ ...
│ │
│ ├─ core (Module)
│ │ ├─ constants (Files)
│ │ ├─ guards (Files)
│ │ ├─ interceptors (Files)
│ │ ├─ validators (Files)
│ │ ├─ models
│ │ │ ├─ common (Files)
│ │ │ ├─ main (Files)
│ │ │ ├─ management (Files)
│ │ │ └─ ...
│ │ ├─ services
│ │ │ ├─ auth (Files)
│ │ │ ├─ common (Files)
│ │ │ ├─ main (Files)
│ │ │ ├─ management (Files)
│ │ │ └─ ...
│ │ └─ ...
│ │
│ ├─ layouts
│ │ ├─ main (Module)
│ │ │ ├─ main-footer (Component)
│ │ │ ├─ main-header (Component)
│ │ │ └─ main-layout (Component)
│ │ ├─ management (Module)
│ │ │ ├─ management-footer (Component)
│ │ │ ├─ management-header (Component)
│ │ │ ├─ management-layout (Component)
│ │ │ └─ management-sidebar (Component)
│ │ └─ ...
│ │
│ ├─ main (Module)
│ │ ├─ homepage (Component / Module of Components)
│ │ ├─ my-info (Component / Module of Components)
│ │ └─ ...
│ │
│ ├─ management (Module)
│ │ ├─ dashboard (Component / Module of Components)
│ │ ├─ categories (Module)
│ │ │ ├─ academic-ranks (Module)
│ │ │ │ ├─ list-academic-ranks (Component)
│ │ │ │ └─ form-academic-ranks (Component)
│ │ │ └─ ...
│ │ └─ ...
│ │
│ ├─ shared
│ │ ├─ component-shared (Module)
│ │ │ ├─ view-file (Component)
│ │ │ └─ ...
│ │ └─ widget (Module)
│ │ ├─ directives (Module of Components)
│ │ ├─ pipes (Module of Components)
│ │ └─ ...
│ └─ ...
├─ assets
│ ├─ css
│ ├─ img
│ ├─ libs
│ ├─ fonts
│ ├─ files
│ ├─ pdfs
│ └─ languages
└─ environments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment