Created
September 30, 2011 16:31
-
-
Save iros/1254291 to your computer and use it in GitHub Desktop.
Organizing Your Backbone.js Application With Modules
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // src/application.js | |
| // Define the application namespace in global scope and module handler | |
| var namespace = { | |
| // Create this closure to contain the cached modules | |
| module: function() { | |
| // Internal module cache. | |
| var _modules = {}; | |
| // Create a new module reference scaffold or load an | |
| // existing module. | |
| return function(name) { | |
| // If this module has already been created, return it. | |
| if (_modules[name]) { | |
| return _modules[name]; | |
| } | |
| // Create a module and save it under this name | |
| return _modules[name] = { Views: {} }; | |
| }; | |
| }(), | |
| // This property will contain instance specific properties related to the | |
| // application. | |
| app: {} | |
| }; | |
| // Using the jQuery ready event is excellent for ensuring all code has | |
| // been downloaded and evaluated and is ready to be initialized. Treat this | |
| // as your single entry point into the application. | |
| jQuery(function($) { | |
| // Initialize your application here. | |
| // You can reference modules within your namespace. | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| <title>Example</title> | |
| <link rel="stylesheet" href="/assets/css/main.css"> | |
| </head> | |
| <body> | |
| <div id="content"> | |
| <!-- Your page content goes here. --> | |
| </div> | |
| <!-- Third-Party Libraries --> | |
| <script src="/assets/js/libs/jquery.js"></script> | |
| <script src="/assets/js/libs/underscore.js"></script> | |
| <script src="/assets/js/libs/backbone.js"></script> | |
| <!-- Application core --> | |
| <script src="/lib/application.js"></script> | |
| <!-- Modules --> | |
| <script src="/lib/modules/friend.js"></script> | |
| <script src="/lib/modules/message.js"></script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment