javascriptdirectory-structureapplication-structure

In large JS apps where do I put custom methods to libraries and plugins


I have a fairly large javascript application mostly using jquery and knockout. Essentially I make one major separation in my folder structure app has all the code I have written and is further divided into constants, views, models, and viewmodels. Then I have vendor which is code I did not write like jquery, knockout, plugins, etc. The problem I am having is where do I put the stuff that falls in between. I Have written some custom bindings for knockout and extended some functionality of some jquery plugins and they are just sitting in the root of my app dir. What is a best practice or naming convention for this.

+app
 -- constants
 -- models
 -- viewmodels
 -- views
 jquery-plugin-extras.js
 knockout-bindings.js
 etc
+vendor
 jquery.min.js
 knockout.min.js
 jquery-plugin.min.js

Solution

  • +app
     -- system (or core) //contains core or system related generics
     -- config // single place to store your configurations, if you have just one, put it at the root
     -- plugins // all plugins or ko bindings here
     -- constants
     -- models
     -- viewmodels
     -- views
     -- main.js // any bootstrapping, initial configurations and such go in to this file.
    +lib
     --jquery.min.js
     --knockout.min.js
     --jquery-plugin.min.js