In a previous post, we mapped out our vision for better-controlling Barley templates. One of the great benefits of this control is the opportunity to streamline our workflow for creating and maintaining templates. We have been playing with a system recently that allows us to lean on a framework, while adding our own UI styles and elements. It looks something like this:
We currently use the Bootstrap framework, our own UI kit that extends that a bit (both in appearance and functionality), and template specific styles/JS, in addition to the template’s HTML files. This allows us pull in only the components that a given site or template requires, compile everything into a single stylesheet, and keep the file size down.
A grunt routine does the building, compiling and minifying of everything but also lets us use HTML includes, which is huge since our templating language is strictly HTML (no PHP). We’re working on pushing this routing a little further to include things like image compression, purifying CSS a little more, and some things that will help us with local development. We tested this workflow out with a couple of projects and have some templates in the works to help run it through the ringer, but so far, so good.