MEANJS shell: where to include custom javascript files?

Question

I started using the JS template template ( ref website ) and would like to know where is the recommended place to include public user javascript, jQuery files (e.g. FacebookSDK, jQuery animations, ...).

I assume this will be somewhere in the shared folder. The default structure is as follows:

Should it go in modules or lib folder? Can you give more recommendations regarding the function of each folder? Any recommendations?

Answer 1

This is a great article on the Angular app folder structure: https://scotch.io/tutorials/angularjs-best-practices-directory-structure

To answer your question about things like jQuery / bootstrap.js, I would put them in the libs folder.

I use this methodology in all my applications now. For your Angular files, the old way / path for small applications would probably be like this:

app/ ----- controllers/ ---------- mainController.js ---------- otherController.js ----- directives/ ---------- mainDirective.js ---------- otherDirective.js ----- services/ ---------- userService.js ---------- itemService.js ----- js/ ---------- bootstrap.js ---------- jquery.js ----- app.js views/ ----- mainView.html ----- otherView.html ----- index.html 

Better more efficient way (more descriptive):

 app/ ----- shared/ // acts as reusable components or partials of our site ---------- sidebar/ --------------- sidebarDirective.js --------------- sidebarView.html ---------- article/ --------------- articleDirective.js --------------- articleView.html ----- components/ // each component is treated as a mini Angular app ---------- home/ --------------- homeController.js --------------- homeService.js --------------- homeView.html ---------- blog/ --------------- blogController.js --------------- blogService.js --------------- blogView.html ----- app.module.js ----- app.routes.js assets/ ----- img/ // Images and icons for your app ----- css/ // All styles and style related files (SCSS or LESS files) ----- js/ // JavaScript files written for your app that are not for angular ----- libs/ // Third-party libraries such as jQuery, Moment, Underscore, etc. index.html 

What I use in my current project: