Static Prototyping Framework
A template for rapid prototyping of static sites and applications. It's built on Jekyll so you don't have to repeat yourself and uses the HTML5 Boilerplate index.html and file structure, a Sass port of Twitter's Bootstrap CSS, Bootstrap JS, and thoughtbot's Bourbon Sass mixins.
Jekyll is a blog-aware, static site generator. However, I've include it here for the purpose of writing HTML in a DRY manner. Using Jekyll allows you to use includes so you don't have to maintain multiple instances of the same code blocks. Unlike using PHP includes, Jekyll will output a directory of compiled static HTML files with your include code moved into each page. Using Jekyll also starts a web server on your computer, so you can easily use things like TypeKit that are normally a pain to work with in a local static site.
To use Jekyll, you'll need to install the gem from your Terminal.
For more information on using Jekyll, read the guide.
This project's HTML is based on the best practices advocated by the HTML5 Boilerplate project.
The Modernizr.js library is included to support HTML5 elements and feature detection. I've included the default development build, but you should probably build your own custom version to use only the features you want to support.
If you prefer LESS, just remove the /stylesheets/sass directory and replace it with Bootstrap's /less directory. This project does not intend to support LESS usage, so if you go that route you're on your own.
It should be noted, I changed the bootstrap.scss file name to application.scss to work better with the defaults and aliases I have set up on my own machine. If you know what you're doing, feel free to change it back when you use this.
Bourbon by thoughtbot is included to allow the rapid use of CSS3. It should be noted that Bootstrap includes its own CSS3 mixins, but I prefer Bourbon's because they are closer to the correct syntax, plus it includes some nice extra functions and mixins.
I've included empty PSDs with the proper names and sizes for creating all the right Apple touch icons and a favicon. Read this article for more info.
Working with this repo
To use Sass and require Bourbon, you have to watch your .scss files from the Terminal and compile their output into the application.css file in the /stylesheets directory. To do so, use the Terminal to cd into the root directory of this repo, then run this command:
sass --watch stylesheets/sass:stylesheets -r ./stylesheets/sass/bourbon/lib/bourbon.rb
Start the Jekyll server by running this command in Terminal from the root directory of this repo:
jekyll --server --auto
You can view your running application at http://localhost:4000.