Level 2 organization
Now we are ready to start reviewing organization structure at the second level. If you’ve missed my previous posts, recommend reading them first before continuing further:
- AngularAtom Component-based organization - Introduction (Part 1)
- AngularAtom Component-based organization - Level 1 Organization (Part 2)
In this post we’ll examine organization of the
app/ folder contains user generated application code, we divide it
components/—container for all user written application components (more on components…)
layouts/—container for the layout definition partial files (more on layouts…)
states/—container for all application UI states (more on states…)
app.js—defines main application module and lists dependencies on components and states modules
index.html—this is the application main entry point. This is where
ng-appdirective and top level
ui-vieware placed. The latter creates a placeholder inside the
<body>...</body>block that abstract states can load layouts to.
We’ll look into organization of each of these folders in more detail when we examine organization of the third level in the next post.
The rest of the folders located at the second level of the application root
have either a standard package-managed (e.g.
or flexible organization, so we won’t be covering them here.
As always, please feel free to comment on this post below.
Today my environment was:
- Angular 1.3.5
- AngularUI Router 0.2.12
- Mac OS X 10.10.1