In recent years there has been a constant drive to produce tools to make the job of developing web sites as painless as possible. One of the most useful group of tools has been boilerplates, which set up the basics and allow the developer to get up and running on a new project in double quick time.
Workbench is a little different from other offerings in this field. It comes with the usual task helpers we now expect to see in boilerplates, but it also comes with JavaScript plugins — a feature more likely to be expected in a full blown framework. This makes it something of a hybrid. In addition, while other popular boilerplates use Grunt for minifying, auto-prefixing and so on, Workbench uses Gulp.
Another difference is that the CSS reset file Workbench uses is sanitize.css, a relative newcomer to the scene. Unlike normalize.css, which is the standard in other boilerplates, sanitize comes as a Sass file and is easily customised.
So what is ‘in the box’? On the CSS front, as well as sanitize.css, there is responsive typography using rems, color and margin mixins, some basic styles for buttons, form elements and tags. There is also a modular system for paragraphs to make it easy to mix titles and text with images, quotes and carousels.
On top of this there is the Element Queries polyfill which enables media queries to be set on container elements; Flickety JavaScript image carousel plugin; Packery JavaScript image grid plugin; a page loading animation; and Tether.js, a JavaScript library which, well, tethers elements together — useful for UI elements like dropdown menus and tooltips.
As already mentioned, Workbench uses Gulp as a task runner. The Gulp file performs some pretty standard tasks: compiling and minifying CSS, autoprefixing, concatenating and minifying JavaScript files, converting small images to Base64 and optimizing larger ones, and live reloading. On top of this it has Rucksack integrated, to give a bit extra on the CSS front.
Workbench is certainly not a basic boilerplate, but this is by no means a bad thing. The extra features are there if you want to use them — and many developers will — and many gulp users will appreciate the use of their preferred task runner. It will be interesting to see how popular Workbench becomes over time.
To see Workbench in action, take a look at its demo page.
