Question about the new modular app structure(Angular 1).


#1

I was going over the new app structure design(meaning each component is now a module).
Even though it will be a drag to update my whole project, the lazy loading is important enough to implement it(For my opinion at least).

1 thing i noticed and i’m not sure how i feel about it is that now, each component has its own config + run functions.
While i understand the goal so that each module keeps it own logic, i think that in a very large app, the config and run will get very messy and hard to maintain.
And usually the logic inside it should be available to each state anyway.

I am wondering if it is not best to create config.js and run.js - both are classes on it own and keep all the logic in 1 file instead(And of course import it on the main component).

What do u think?


#2

I am actually against having each component in its own module. Primarily because these components comprise a single application. In JEE land I’ve had projects where they tried to break a single application into several projects where each of them have a single responsibility (good architecture in theory) but since they’re all inter-related and Maven wasn’t in the picture, someone had to ensure that things are loaded into the class path properly and all other useless plumbing.

Of course I would recommend that you still separate server, UI and domain into different modules because they’re meant to be separated even for deployments. But don’t separate UI into different modules.

EXCEPT when the module can be reused and one of the product backlog items you would have is to remove it from your project at one point.

Another except, states/routing should also be in their own module. My primary reason is that routing may change in the future (ui-router, ng-router, angular2-router) and it’s best to keep it isolated

So my recommendation is generally keep everything in one module per tier, but still break up the folders and files so that each has a single responsibility.

My boilerplate tries to demonstrate the above in action https://github.com/trajano/meteor-boilerplate/tree/angular/