angular project structure code example

Example 1: comand component create struct angular

ng g component [directory-where-you-want-to-save-the-component]/[new-component-name]

ng generate component [directory-where-you-want-to-save-the-component]/[new-component-name]

Example 2: angular 7 folder structure best practices

|-- app     |-- modules       |-- home           |-- [+] components           |-- [+] pages           |-- home-routing.module.ts           |-- home.module.ts     |-- core       |-- [+] authentication       |-- [+] footer       |-- [+] guards       |-- [+] http       |-- [+] interceptors       |-- [+] mocks       |-- [+] services       |-- [+] header       |-- core.module.ts       |-- ensureModuleLoadedOnceGuard.ts       |-- logger.service.ts     |     |-- shared          |-- [+] components          |-- [+] directives          |-- [+] pipes          |-- [+] models     |     |-- [+] configs|-- assets     |-- scss          |-- [+] partials          |-- _base.scss          |-- styles.scss

Example 3: angular project structure

Search NgxRocket. Very usefull library

Example 4: workspace angular

content_copy
      
      my-workspace/
  ...             (workspace-wide config files)
  projects/       (generated applications and libraries)
    my-first-app/ --(an explicitly generated application)
      ...         --(application-specific config)
      e2e/        ----(corresponding e2e tests)
         src/     ----(e2e tests source)
         ...      ----(e2e-specific config)
      src/        --(source and support files for application)
    my-lib/       --(a generated library)
      ...         --(library-specific config)
      src/        --source and support files for library)