Large AngularJS application design

Question

I need advise on designing an AngularJS application with multiple complex modules and based upon the user role the module gets loaded after authentication & authorization. S

Answer 1

I recommend to include yeoman into your workflow and use a generator for your project, that makes a lot easier the way that you structure your app, specially if you are working in a team.

earlier this year people from angular released a document with best practices for your app structure, I'd recomment you to read it, being said that there's a generator based on those best practices named cg-angular which I totally recommend.

I'll quote from cg-angular site:

All subgenerators prompt the user to specify where to save the new files. Thus you can create any directory structure you desire, including nesting. The generator will create a handful of files in the root of your project including index.html, app.js, and app.less. You determine how the rest of the project will be structured.

regarding to your questions:

• How can a service inside a module talk to other module?

you can create a folder for directives/ and services/ you are going to reuse in different modules.

• Module should be developed and run independently?

you can have several modules inside an app (you could load them as needed, maybe using require js but this is offtopic)

• How the communication between module can be handled with transferring data?

Use services to pass information between controllers, in different modules

• How to integrate all the above elements , particularly exception handling, logging?

you can do a generic error handler and a generic http interceptor for all the modules

• Developers should understand the convention we have defined?

use a generator they are opinioated and they give the order and the conventions you need for a team.