Working Smarter: Keep a code snippets library

I have fallen short on this until recently. I had a number of production websites I had worked on with different techniques and interface design patterns which I knew where certain code was and could access to copy and paste bits out for editing. This is not the most efficient way to work as code still has to be found within the websites file structure and usually it has been highly customised for a particular job. It is better to store code snippets within a dedicated directory. I have been building mine over the past five or six weeks. As well as code snippets, I have taken it a little further and added a design patterns folder which contains anything from a simple menu to a JavaScript library driven carousel or image gallery glider. Each design pattern has its own folder and within it all the necessary documents to make up a working example: HTML, CSS, JavaScript, image assets.

I have also taken the opportunity to delve deeper into the –webkit and –moz proprietary CSS extensions code, as well as all the exciting CSS3 transforms animations that I hope will be in the final CSS3 standard. As well as this I have documented all of the available browser filters on hand to enable web designers to hack their way through browser discrepancies. Most are valid CSS, some are not but I have added a strong warning to use conditional statements and check your code before deciding upon this approach.

Within this code snippets directory are various examples of HTML skeletons too which can act as a base for beginning a project. In my toolkit so far is a XHTML Strict, XHTML Strict with ARIA, HTML5 and Wap doctypes.
Notice how I referred to it as my toolkit in the previous paragraph. Web designers should keep their tools clean and neatly in a toolbox. Having a dedicated directory available to you with working examples will speed up your development processes. I will be sharing my own code snippets library shortly in a code repository of some description (watch this space). I will continue to update this as I refine my code and add new patterns and processes.

---

Liked this post? Subscribe to my RSS feed to keep up to date on my other posts.

Tags: code library, code snippets, toolkit

This entry was posted on Tuesday, October 13th, 2009 at 7:45 am and is filed under working smarter. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.