Pattern libraries are becoming better known as sites such as the BBC and A List Apart release their pattern libraries publicly. For the uninitiated, a pattern library is a collection of elements used on a web site. They define everything from the base font to page layouts.
Brad Frost and Dave Olsen’s Pattern Lab is one tool for creating a style guide. As the demo shows, it combines both a style guide and a method for testing the responsiveness of a web site.
When creating a style guide using Pattern Lab for your site, it’s necessary to store the /source directory in your Git repo. This is done by commenting out the exclusion from the .gitignore file:
.DS_Store
public/*
# source/*
config.ini
latest-change.txt
*-ck.js
*.sass-cache/
It’s wasteful to store the /public directory in the Git repo too – especially if cache busting is enabled – so it’s helpful to generate the directory automatically when you pull to the live server.
Automating the rebuild
According the the Git book, hooks can be used to “fire off custom scripts when certain important actions occur”.
Behind the scenes, a git pull
includes a git merge
, so creating this post-merge hook will work:
#!/bin/sh
DIR="$( cd "$( dirname "$0" )" && pwd )"
php "$DIR/../../core/builder.php" -g
On the server, you save the file to /.git/hooks/post-merge. As hooks aren’t stored in the git repo, you need to set this up on a per server basis
A rebuild is required when you merge a feature branch into master, as the name implies the post-merge
hook will fire at this time too.
If you have multiple branches, you can get same code to run after switching branches using the post-checkout
hook.