Angular Projects Folder Structure.md

Angular Projects Folder Structure

When organizing angular projects, I like to use the below folder structure

root
|__ src
    |__ app
        |__ feature
            |__ components
                |__ example
                    |__ example.component.ts
            |__ mocks
                |__ example.mocks.ts
            |__ services
                |__ example.services.ts
            |__ models
                |__ example.models.ts
            |__ feature.module.ts
        |__ app.component.html
        |__ app.component.spec.ts
        |__ app.component.ts
        |__ app.module.ts
            ...

• Feature - an Angular feature modules consisting of a NgModule for the purpose of organizing code.

• Component - an Angular component that could be publicly or privately available to the feature.

• Mock - a collection of testing mocks

• Service - a Angular service used to encompass functionality to this feature

• Model - contains types and interfaces that will be used within the feature module