Skip to content
Tim Branyen edited this page Jan 5, 2013 · 10 revisions

LayoutManager can be run in both browser and Node.js environments. There is a single canonical method of installing server side with NPM and multiple ways of loading inside of the browser.

Node.js

Ensure you have Node.js installed. The version should be at least 0.6, but you should probably use 0.8 to ensure fewer potential incompatibilities.

Open a terminal in your project directory and install with:

npm install backbone.layoutmanager

This will automatically install all dependencies into your node_modules folder. You can then require it and use as you would inside the browser environment.

Browser

Since there is not a single agreed upon method of loading JavaScript inside of a web application, LayoutManager attempts to support as many efforts as possible without becoming a burden to maintain.

Basic script inclusion

If you wish to just get LayoutManager on the page, you need at the minimum Backbone, Underscore, and jQuery. Your HTML should look something like this:

<!-- Dependencies. -->
<script src="jquery.js"></script>
<script src="underscore.js"></script>
<script src="backbone.js"></script>

<!-- LayoutManager. -->
<script src="backbone.layoutmanager.js"></script>

Asynchronous Module Definition (AMD)

If you are more adventurous you may want to use a dependency manager like RequireJS.

Make sure your configuration looks very similar to this:

require.config({
  // This part may not be necessary depending on your setup.
  paths: {
    jquery: "/path/to/jquery",
    backbone: "/path/to/backbone",
    underscore: "/path/to/underscore",
    layoutmanager: "/path/to/backbone.layoutmanager"
  },

  // This part is definitely necessary regardless of your setup.
  shim: {
    backbone: {
      deps: ["jquery", "underscore"],
      exports: "Backbone"
    },

    // Here we indicate that we need Backbone and all its dependencies,
    // we also want to bind the main object.
    layoutmanager: {
      deps: ["backbone"],
      exports: "Backbone.Layout"
    }
  }
});

If you are using a different AMD loader, perhaps the use.js plugin will work for you.

JamJS

If you are even more adventurous you may want to try a package manager like JamJS. This is an excellent way to manage dependencies using the aforementioned Asynchronous Module Definition pattern.

To install, simply configure a JamJS environment and using the jam tool from NPM, run:

jam install backbone.layoutmanager

This will install the package and configure the dependencies for you.

Bower

If JamJS doesn't float your boat, you may want to consider Twitter's Bower package manager.

Installing is similar to JamJS, configure the Bower environment and using the bower tool from NPM, run:

bower install layoutmanager