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:
- Make a directory structure for organizing your scripts and stylesheets.
- Download jQuery, require.js, normalize.css
- Download Bourbon, Neat, Bitters, and some Refills.
- Copy over a template to get started on a project
- Provide 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.
- CoffeeScript for specific layouts can go here. (e.g. Scripts that are for the homepage go in
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/
- Tells SASS to compile the files hiding in the other subdirectories of
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
- Contains a list of all the layouts that should be compiled in the
- Where layout specific SASS files go. (e.g. Styles that are for the homepage go in
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
- Contains a list of all the modules that should be compiled in the
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
- Contains a list of all the plugins that should be compiled in the
- Put your CoffeeScript files in a subdirectory of
scripts/src/
and editapp.coffee
or the corresponding CoffeeScript file inscripts/src/layouts
so your scripts get included. - Put your SASS files in a subdirectory of
stylsheets/
and editapp.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.