Luca
Luca

Reputation: 385

Proper angular file structure

What is the best angular file structure for me? My project is going to be a SPA with a video feed on the main page, and pages to view specific posts. I want my users to be able to login, vote on the content and an admin section to add content.

You can see my file structure here - https://github.com/bliitzkrieg/TrailerFeed or below

/app
   /assets
      /css
          main.css
          main.min.css
      /sass
          main.scss
          _variables.scss
          /components
               _header.scss
   /components
       /dashboard
       /feed
           _feed.html
           feed.js
           feedController.js
       /header
            _header.html
           header.js
           headerController.js
           headerDirective.js
   /spec
       app.spec.js
   app.js
   index.html
   routes.js

Upvotes: 0

Views: 143

Answers (1)

Martin
Martin

Reputation: 16292

Your file structure looks fine. You have your files organized by component rather than type. I would suggest removing the underscore prefix from your templates as this is redundant. Every template in angular is a partial so they don't need to be indicated as such.

You may want to keep your unit tests in the components directory as well. headerDirective.spec.js can live with in your header component folder.

Controllers are classes and instantiated as individual instances (as apposed to services which are classes that are injected as a singleton). So controllers should be named in PascalCase rather than camelCase.

It would seem that your component SCSS should live with the rest of its component files as well. But there are very valid reasons not to do this.

Upvotes: 1

Related Questions