Jade and Stylus provide an excellent shorthand for writing HTML/CSS, and developers have fallen in love with them for Express apps. It's about time that regular people get to use them, too.
Workbench is a simple tool for building static HTML/CSS/JS websites using Jade and Stylus. It aims to be usable by all sorts of people, including non-Node-saavy designers and front-end developers. It's inspired by Express and projects like Jekyll.
$ npm link workbench
- Write HTML/CSS shorthand in Jade/Stylus
- Utilize helpers like nib
- Write one layout file; have content embedded
- Dynamic data (JS variables + Jade)
- Concatenate/minify JS + CSS
Make a project directory
$ workbench new
Watch the project and compile Jade/Stylus automatically
$ workbench watch
The default Workbench directory structure (after an initial build) is as such:
config.json build index.html styles style.styl source index.jade layouts layout.jade styles style.styl
- Local variable passing
- Layout support
- Routes, pseudo-automated with override
- Watch (server to automatically compile with each change)
- Watch (server to render pages on request as in Express)
- GitHub Pages helpers (build to root; source in directory - script?)
- Markdown filter?
- CoffeeScript compiler?
- Jade pretty print
- Debug print options
- 'workbench open' to open the built index.html in browser