Origin

I’ve written loads about my flat build process, automation, browser support — in fact, if you follow me on Twitter you’ll know I can’t shut up about the Web. What I’ve been lacking is a canonical resource for my work beyond theoretical writing and live production examples. Despite web standards being open they aren’t always easy to reverse engineer.

What is Origin?

Starting a new project for me used to mean cobbling together and rehashing code from past work. This year I started to consolidate everything into my own personal boilerplate to kick start front-end development.

“Origin” is my code name for this on-going project (everything needs a name). It’s not a behemoth of code like Bootstrap or Foundation. It’s specifically tailored to suit the websites I make. It will never be complete and it will evolve dramatically as my preferences and needs change.

This is not a framework I expect others to use ‘as is’ but I decided to make it public because:

• A lot of people asked kindly
• I learn from similar projects by other developers
• It will serve as a reference point when discussing particular techniques

If you care to poke around the code is on GitHub. Or you can see the GitHub page for my starting pattern library. This doesn’t include everything I consider a “best practice” and a lot of things aren’t commented. Make of it as you will — just please don’t include it in a “10 new resources for developers” blog post!

If you like the idea of automated builds and need a mature Grunt workflow then give Yeoman a test drive. For a BEM-style CSS framework there’s Inuit.css. And if you need to prototype something fast, Bootstrap and Foundation have their uses.