vertebrae icon indicating copy to clipboard operation
vertebrae copied to clipboard

Backbone.Marionette AMD Boilerplate

Vertebrae

Overview

A set of tools and conventions for building client-side applications with Backbone.

Tooling

If you would like to use the optional tooling we provide, make sure your system has Node.js, Ruby, gulp.js and Sass installed.

Node

Let's check to see if you already have Node installed. Bring up a terminal and type node --version. If Node responds, and if it shows a version at or above v0.10.x, proceed to checking if you have Ruby installed too. If you require Node, go to nodejs.org and click on the big green Install button.

Ruby

Bring up a terminal and type ruby --version. If Ruby responds, and if it shows a version number at or above 1.8.7 then type gem --version. If you don't see any errors, proceed to installing the Sass gem. If you require Ruby, it can be installed from the Ruby downloads page.

Sass

Bring up a terminal and type sass --version. If Sass is installed it should return a version number at or above 3.3.x. If you don't see any errors, proceed to the Gulp installation. If you need to install Sass, see the command-line instructions on the Sass installation page.

Gulp

Bring up a terminal and type gulp --version. If Gulp is installed it should return a version number at or above 3.5.x. If you don't see any errors, proceed to the Gulp commands section. If you need to install Gulp, open up a terminal and type in the following:

$ npm install --global gulp

This will install Gulp globally. Depending on your user account, you may need to gain elevated permissions using sudo (i.e sudo npm install --global gulp). Next, install the local dependencies Web Starter Kit requires:

$ npm install

That's it! You should now have everything needed to use the Gulp tools in Web Starter Kit.

Gulp Commands

You can now use Gulp with the following commands to stay productive during development:

Watch For Changes & Automatically Refresh Across Devices

$ gulp serve

This outputs an IP address you can use to locally test and another that can be used on devices connected to your network.

Build & Optimize

$ gulp

Build and optimize the current project, ready for deployment. This includes linting as well as image, script, stylesheet and HTML optimization and minification.

Inspiration

Vertebrae is inspired by Google Web Starter Kit, Mobile HTML5 Boilerplate and Yeoman's generator-gulp-webapp.

License

Apache 2.0 Copyright 2014 Sven Lito