generator-sizzle

0.1.8 • Public • Published

generator-sizzle Build Status npm version

Sizzle generator for quickly bootstrapping web apps using AMD modules and SMACSS like styling usinc Compass and Bourbon.

Using this generator will give you a quickly bootstrapped web app. I wrote this generator to make my life easier, as I have been using this particular set up for quite some time now and I am loving it! It might not be for you, but who knows - I hope it helps others too :)

Features

  • Scaffolding projects with Yeoman
  • Run automated tasks with Grunt
  • Handle dependencies with Bower
  • Browser LiveReload
  • Compass stylesheets compilation and sprite generation (plus more)
  • HTML, JavaScript and CSS obfuscation and minification
  • Event driven JavaScript with JSSignals
  • No touch event latency thanks to FastClick
  • Double rainbow animations with the Greensock tweening engine
  • A nice SASS based grid framework thanks to Bourbon Neat
  • Quick deployment via SSH
  • Cache busting of image files including your JavaScript and JSON files
  • 1 CSS file in the and 1 JavaScript file before the , no unnecessary HTTP requests
  • Keep your JavaScript code modular with AMD modules via RequireJS
  • Use brill JavaScript utilities thanks to Underscore.js

Caveats

  • Right now there is no unit testing in place (might add later)
  • Because Yeoman doesn't like RequireJS, there is no way of making asyncronous calls to multiple AMD modules. Your code is generated by Almond into one single module
  • You need to install the Compass Ruby gem (detailed below)

Bower components

  • jQuery
  • Underscore.js
  • Greensock
  • FastClick
  • Almond (a working substitute of requirejs with Yeoman)
  • JS Signals
  • Bourbon + Bourbon Neat
  • Normalize.scss

NPM modules (other than the usual stuff)

  • Compass
  • RequireJS (r.js optimiser)

Installing Compass

  1. Make sure you have Ruby installed. Perhaps a better way of installing ruby is via rbenv

  2. Install Bundler if you haven't already

  3. In your project root run:

    $ bundle install

Usage

Install generator-sizzle:

npm install -g generator-sizzle

Make a new directory, and cd into it:

mkdir my-new-project && cd $_

Run yo sizzle, optionally passing an app name:

yo sizzle [app-name]

Run grunt for building and grunt serve for preview

Changelog

All changes are logged in the CHANGELOG.md file.

To do

  • Add soft build Grunt task
  • Add optional jsHint and Mocha support

License

BSD license

Package Sidebar

Install

npm i generator-sizzle

Weekly Downloads

0

Version

0.1.8

License

BSD

Last publish

Collaborators

  • robertpataki