#codelicious

I love lasagne.

I can probably hazard a guess that it's actually because of Garfield that I love lasagne.

My mum made a mean lasagne. When I started to cook I think lasagne was one of the first three dishes I learned to cook. Whenever I've been out for a pub lunch that's not on any given Sunday I generally choose lasagne. Some are great, others not so much.

I make a mean lasagne. But it's a different to the lasagne my mum makes. I don't use a the herbs she does and I add half a tea spoon extra of balsamic vinegar. I also put a more than necessary amount of cheese on top.

You see with lasagne there's many ways you can make it a mean, lean tummy-filling machine and that, for me, is a great thing. It's why I love lasagne.

Wha- ?

But what's this got to do with modern web development?

Well, I probably write code slightly differently to you. I use the margin and padding short-hand but not the font or background short-hand. I order my CSS rules alphabetically and order my SCSS rules in a certain way.

Yes, it all gets compiled and gzipped to a barely readable file when it goes live but that’s because the browser doesn’t care how you originally wrote it.

Using your own ‘framework’ or ‘boilerplate’ is the best way to hone your skill-set and improve for not only your benefit, but your clients and their customers.

It seems like so many new boilerplates, starting points and frameworks are being released it can seem to easy just to use something ‘off the shelf’. I seriously think this would be an injustice to yourself.

The starting point

I guess we could say that the HTML5 boilerplate was the first, well ‘boilerplate’ for developers to quickly grab and hit the ground running with. It came with predefined ways of ‘doing things’ and a lovely shade of pink for when touching or selecting an element.

It still allowed developers to adapt and change to their own melt but invariable some used it verbatim without worrying or wondering why things were written in a certain way or even why they’re there to begin with.

Progressive cookie cutting

Moving forward developers took the idea of the boilerplate and expanded it, making things like Bootstrap or Foundation. Coming along with some predefined objects and styles meant front-end developers could quickly flesh out a site with modules all ready to go.

Not My Style

I just can not do this. I’d much rather re-invent the wheel a little and be happy in the knowledge of what every line of code I produce is doing even, for example, if I’m leaving Sass to do it’s ‘magic’ without worrying how’s its doing so.

I prefer to write my own mixins that suite my needs, code in a style that works with my (unfortunately, soon to be) cue ball noggin understanding it.

Beg, borrow and steal

Don’t get me wrong, I often don’t write ‘everything’ uniquely without prior knowledge of things. Fundamentally I look through other starting points and frameworks see something that piques my interest and often drop it into my own set of starting files.

I’m just ‘careful’ or picky (or opinionated) in what I want to include and what I don’t.

Easier to take away than to add it after you launch

Generally, my starting point has ‘everyhing’ when I first start. I’ve got a link to respond.js in the <head>, there’s a link to the full latest Modernizr script and so on.

I find it easier to take away the things I don’t need as I move through developing a project rather than adding to it as needed (although there’s always a chance to add something still).

Many a time have I seen a new ‘responsive’ site launch that fails to work on my iPhone because they forgot to add the viewport meta tag.

Only in teams

Anything you do with your starting point should of course be documented. If you’re in a team you want everyone to be ‘singing for the same hymn sheet’. If you hand over your work to a client then providing adequate documentation about your starting point and coding style will pave the way for them to easily see what you’re doing and why.

A quarter pounder with cheese

Writing your own set of starting files means you care about the details, the simple nuances of the code you’re using, making it ‘delicious’.