AngularJS Large Application File Structure Organization

Question

I have a large angularjs application. I'm curious what the 'angular way' is to organize such a complex application. Worth noting I'm also using RequireJS.

The page structure looks like:

Administration
- Users
- System
Tickets
Search
Dashboard

currently I have it organized something like:

/.
app.js
main.js
/views
    administration.html
    /administration
        /users
        ...
    ticket.html
    /ticket
         /text
         /list
    search.html
    /search
         basic.html
         stats.html
    dashboard.html
    /dashboard
         cards.html
/controllers
     search.js
     tickets.js
     administration.js
     /administration
           users.js
           system.js
     ...
 /servies
       search.js
       ticket.js
       admin.js
 /directives
       chart.js
       input.js
       select.js
 /lib
      /angular
      /d3
      ...

Any thoughts?

I do not think there really is an "Angular way" of organizing your files. If the organization fits your purpose it is OK (your layout seems pretty resonable to me). By the way if you are using Angular+Require you may want to take a look at angular-require-lazy as an example of how to enable lazy-loading Angular views with Require. — Nikos Paraskevopoulos
– Nikos Paraskevopoulos, Commented Mar 11, 2014 at 14:48
@NikosParaskevopoulos yup I'm about to implement Angular AMD - marcoslin.github.io/angularAMD/#/home but thanks for sharing that one as well! — amcdnl
– amcdnl, Commented Mar 11, 2014 at 16:32
@NikosParaskevopoulos does that require node to serve the files? looks pretty interesting! — amcdnl
– amcdnl, Commented Mar 12, 2014 at 15:46
Hi thanks for the interest. No it doesn't require Node. In the example I am using Node (the great express framework) just for ease of development (you need Node to build it anyway). I have implemented this with Java server-side in some of my projects. Actually it may be a good idea to share some Java code too, e.g. for the lazy-registry creation, but it is not that complicated anyway. — Nikos Paraskevopoulos
– Nikos Paraskevopoulos, Commented Mar 12, 2014 at 15:59

Mike Cheel · Accepted Answer · 2014-03-11 14:48:38Z

4

This is Google's recommendation:

Best Practice Recommendations for Angular App Structure https://docs.google.com/document/d/1XXMvReO8-Awi1EZXAXS4PzDzdNvV6pGcuaF4Q9821Es/pub

Remember nothing is written in stone and you may get better mileage doing something else.

answered Mar 11, 2014 at 14:48

Mike Cheel

13.2k10 gold badges79 silver badges107 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

amcdnl Over a year ago

Ya, I ive implemented some of those structures before but after seeing some of the angular examples I moved towards this. Reconsidering my choice based on your thoughts here.

Collectives™ on Stack Overflow

AngularJS Large Application File Structure Organization

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related