Skip to content
Branch: master
Go to file

Latest commit


Failed to load latest commit information.
Latest commit message
Commit time


Boilerplate for single page app built on CoffeeScript, Backbone, Sass, Gulp, Browserify, amongst other things...

Although it technically works "out of the box" (-ish), really requires some configuration, and probably contains a lot of extra crap you don't need.

Install using NPM

  2. $ npm install coffeebone
  3. $ node node_modules/coffeebone/clean.js
  4. $ node install.js [APP NAMESPACE] optional - just namespaces app in all coffee files
  5. $ npm install
  6. $ gulp


  1. Clone repo into [DIR NAME]
  2. $ cd [DIR NAME]
  3. $ npm install
  4. $ node install.js [APP NAMESPACE] optional - just namespaces app in all coffee files
  5. $ gulp

Gulp tasks

  • $ gulp - development mode

    • Watchify (browserify)
    • Compile Sass
    • Autoprefix CSS
    • Minify XML templates
    • Optimise images
    • BrowserSync (local server)
      • watch for changes in .coffee, .scss, templates.xml and images, trigger repeat
  • $ gulp build - pre-deploy build

    • Browserify
    • Remove console.logs
    • Compile Sass
    • Autoprefix CSS
    • Combine media queries
    • Minify CSS
    • Minify XML templates
    • Concatenate vendor JS
    • Uglify JS (vendor + main application JS)
    • Custom modernizr build based on refs used through app -- TO DO
    • Iconizr -- TO DO
  • Others:

    • Check /gulp/tasks - each file corresponds to an individual gulp task

General FE app structure notes

  • - capture / modify URL hashChange events
  • - list all available site routes, handle / delegate URL hashChange events
  • - Core view, all UI bound here. Anything with a deeplink in Wrapper, any modal-only content in ModalManager
    • mapping for all site deeplinked views
    • each view may be an AbstractViewPage or AbstractViewModal
    • handle management of deeplinked pages / modals based on view 'type' and history state
    • trigger sub-route event changing
  • AbstractViewPage / AbstractViewModal - URL based pages, built in methods for page transitions
  • - custom modal management (non URL-based popups)

Important FE utils / data management

  • - use to retrieve all endpoints
  • - holds all user data, convenience methods to integrate with assumed user API endpoints (login / logout etc)
  • - all application HTML is loaded via single XML file, this templates wrapper allows getter based on ID
  • - all localised copy is expected in JSON file format, based on predefined (or detected) ISO-compatible locale code. This class offers wrapper to get localised string based on unique ID.
  • - Google Analytics custom event firing, requires custom JSON containing ID / event string mappings.
  • - Wrapper for sharing to various social networks in popup windows (except FB, this should be done via class)
  • Others - just look around :)

Included SDKs

These come packaged in wrapper classes that load the SDKs asynchronously and have some helper methods for API interaction

  • Facebook (
  • Google+ (

Included JS libs

  • Backbone (+ jQuery + Underscore + Backbone DeepModel)
  • TweenLite.js (+ CSSPlugin + EasePack)


  • Normalise
  • Custom easing
  • Various helpers + mixins


No description, website, or topics provided.



No releases published
You can’t perform that action at this time.