“Building a front-end style guide with Jekyll” was the topic for the most recent Cape Town Front-end Developers meetup. The topic was presented by Justin Slack who currently works at New Media Labs.
As per the title of the Meetup, Justin used Jekyll, which is a static website generator, to show how it could be used to generate a front-end style guide.
You can access the source code to his style guide on GitHub: Front-end style guide with Jekyll.
Being a Windows user, Jekyll isn’t a very viable solution for me, due to the Ruby requirement. However, it is possible, but I haven’t yet tried it myself.
“Design style guides and code standards documents have been a successful way of ensuring brand and code consistency, but in between the code and the design examples, web-based style guides are emerging. These are maintained by front-end developers, and are more dynamic than visual design guidelines, documenting every component and its code on the site in one place.”— Anna Debenham
The idea behind building a “living” style guide that is dynamic and easy to maintain is definitely an appealing one, especially when working on larger projects. Earlier in the year, Ian Feather wrote an insightful article: A Maintainable Style Guide where he discusses, in detail, how the Lonely Planet style guide is maintained.
Below is a list of some of my favourite style guides currently online:
Cape Town Front-end Developers is a Meetup group of some of the talented front-end web developers currently working in Cape Town.
Thanks to 22seven for hosting the event.