16 Useful Boilerplates to Start Your Project Quickly | Queness

http://www.queness.com/post/10905/16-useful-boilerplates-to-start-your-project-quickly

Introduction

Boilerplate is a set of code that can be reused in many ways with little or no alteration. However, the boilerplates we are talking about here usually can be used as a base, a solid foundation for your projects. Additional benefit, it's also a good place to learn tips and tricks about coding too!

Boilerplate is extremely useful because it usually comprise of best coding practices, and also contain heaps of tips and tricks which otherwise would take years of times to learn. Take HTML Email Boilerplate as an example, building an eDM isn't easy, it requires one to go back to HTML 1.0, no more div, span or high level CSS settings such as float, position etc, what you need is table for layout, inline CSS for simple styling. To make building an eDM even worse, email clients have strict restriction and they don't behave the same, as if you're working with more than one legacy browsers that all render the page differently! With the Email boilerplate, it contains CSS settings HTML structure and even some tips and tricks to help and guide you how to avoid redering inconsistencies issues.

With no further a do, I have collected 16 boilerplates for different web technologies, platforms - HTML, CSS, jQuery, WordPress and etc. They enforce best practices and constant updates and I pretty sure it will be a really good foundation for your projects.

HTML & Miscelaneous

• HTML5 BoilerplateHTML5 Boilerplate is the professional badass's base HTML/CSS/JS template for a fast, robust and future-safe site.
• HTML Email BoilerplateThis website and its sample code creates a template of sorts, absent of design or layout, that will help you avoid some of the major rendering problems with the most common email clients out there — Gmail, Outlook, Yahoo Mail, etc. This is a good stuff, I use it in my work and it contains a lot of tips and tricks which save you heaps of times to fix it yourself.
• HTML5 Mobile BoilerplateMobile Boilerplate is your trusted template made custom for creating rich and performant mobile web apps. You get cross-browser consistency among A-grade smartphones, and fallback support for legacy Blackberry, Symbian, and IE Mobile.
• Twitter BootstrapSimple and flexible HTML, CSS, and Javascript for popular user interface components and interactions. Not really a boilerplate, but it has a lot of reusable component for fast prototyping or development.
• Zend Framework BoilerplateZend Framework (ZF) Boilerplate is an all-in-one platform for development of enterprise grade PHP applications based on the Zend Framework.

CSS

• GetSkeletonSkeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17" laptop screen or an iPhone. Skeleton is built on three core principles: Responsive Grid Down to Mobile, Fast to Start and Style Agnostic.
• CSS Media Queries BoilerplateQuick snippet for CSS Media Query setup.
• Boilerplate for Responsive MobileYAMP is a small set of tools and best practices that allow web designers to build responsive websites faster.

jQuery

• jQuery BoilerplateThis project won't seek to provide a perfect solution to every possible pattern, but will attempt to cover a simple template for beginners and above.
• Stefan Gabos jQuery Plugin BoilerplateA boilerplate for jump-starting jQuery plugins development.
• Essential jQuery Plugin PatternsA javascript pattern for jQuery plugin development. But while well-known JavaScript patterns are useful, another side of development could benefit from its own set of design patterns: jQuery plugins. The officialjQuery plugin authoring guide offers a great starting point for getting into writing plugins and widgets, but let's take it further.

WordPress

• WordPress Widget BoilerplateAn organized, maintainable boilerplate for building WordPress widgets.
• Root ThemeRoots is a starting WordPress theme based on HTML5 Boilerplate & Bootstrap from Twitter.
• BonesBones is a boilerplate for WordPress theme development. It contains classic (fixed grid) and responsive layout to choose from.
• Starkers ThemeStarkers is a bare-bones WordPress theme created to act as a starting point for the theme designer.
• TwentyTen Five HTML5 Base ThemeBringing HTML5 to WordPress, you can use this TwentyTen Five WordPress template to build your won HTML themes.

About the Author

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.