Whiskers is a dandy little gem for quickly spinning up sites using SASS, CoffeeScript, and Thoughtbot’s Bourbon.

There’s no fancy magic here. Just a Ruby script that copies some web pages around. All wrapped up in a gem you can call from the command line.

This dingus automates a lot of tedious command line work I was doing previously. If you would like to use it, be my guest.

You can read the source for yourself if you’re so inclined. If you’re lazy, like me, here is a flyover of what Whiskers does:

1. Makes a directory structure for organizing your scripts and stylesheets.
2. Downloads jQuery, require.js, normalize.css
3. Downloads Bourbon, Neat, Bitters, and some Refills.
4. Copies over a template to get started on a project
5. Provides an easy way to live compile CoffeeScript and Sass

You probably don’t. This is a tool for me. Not everything is about you.

I apologize, that was curt. You’re a pleasant person and you do a good job.

You can run:

$ gem install whiskers

💥 Boom, you’re done. Though you’ll want to install CoffeeScript for it to work.

If you want to get up and running, you can create a new Whiskers site, open the directory, and tell Whiskers to watch for changes like so:

$ whiskers new nameOfMySite
$ cd nameOfMySite
$ whiskers watch

If you want to create a site with a template beyond the base template you could run:

$ whiskers new nameOfMySite nameOfMyTemplate

You can see the templates available using:

$ whiskers list

You can also ask for help using:

$ whiskers help

The main html page for the generated site, but you already knew that.

Where the .js and .coffee files go

• lib/
  • Where all compiled Javascript files can be thrown.
  • Also where you may want to put any Javascript libraries you plan on using.
• src/
  • Where all your CoffeeScript source files go.
  • layouts/
    • CoffeeScript for specific layouts can go here. (e.g. Scripts that are for the homepage go in home.coffee)
    • These files can also use require to include CoffeeScript from the modules directory.
  • modules/
    • Small reusable bits of CoffeeScript for UI elements and the like can go here.
  • plugins/
    • CoffeeScript plugins you want to use can go here.

Where the .css, .scss, and .sass files go

• app.sass
  • Tells SASS to compile the files hiding in the other subdirectories of stylesheets/
• layouts/
  • Where layout specific SASS files go. (e.g. Styles that are for the homepage go in home.sass)
  • layouts.sass
    • Contains a list of all the layouts that should be compiled in the layouts/ folder
• modules/
  • Where styles related to small, reusable modules should go.
  • modules.sass
    • Contains a list of all the modules that should be compiled in the modules/ folder
• plugins/
  • Where all of your SASSy plugins can be dumped.
  • plugins.sass
    • Contains a list of all the plugins that should be compiled in the plugins/ folder

• Put your CoffeeScript files in a subdirectory of scripts/src/ and edit app.coffee or the corresponding CoffeeScript file in scripts/src/layouts so your scripts get included.
• Put your SASS files in a subdirectory of stylsheets/ and edit app.sass or the corresponding SASS file for that directory so your styles get included.
• See the section above titled: “What do all these files and folders do?”

I run it on Mac OS X 10.11 but it would likely work various flavors of Linux or BSD as well. There is not much here that is system specific.

Probably not, but if you play your cards right we can get an ice cream cone, sport. 🍨

Sure, go for gold.

I like otters.

Made with ❤️ in Kansas.