jQuery Plugin Boilerplates

jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.

A plugin is simply a custom-written code library that can be plugged into jQuery to extend its capabilities, adding new methods or repeating previously defined behaviors. The core jQuery library only knows the basics of traversing an HTML document, but using plugins allows us to do anything from animating elements to changing the way that a selector behaves.

jQuery Plugin Boilerplates

One of the greatest things about jQuery is its extremely active community, and this fact rings especially true for plugins. Since a significant number of developers have written their own solutions to similar problems, there are a large number of plugin boilerplates out there that you can use as a starting point.

Here are a few of our favorites:

Simple

(function ( $ ) {
    
    $.fn.customPlugin = function(options) {        

        //default settings
        var defaults = {            
            option1: "",             
            option2: 1000, 
            option3: false,
        };
        var settings = $.extend({}, defaults, options );        
        

        return this.each(function(){
            var element = $(this);
            
            //do something to the element here
            
        });
    };
 
}( jQuery ));

jquery-boilerplate

jQuery Boilerplate is another good starting point for anyone looking to create effective and stylish jQuery code. With its simple template and defaults object, you can quickly get up and running with minimal fuss. And by using the lightweight wrapper around the constructor, you can avoid any potential issues with multiple instantiations.

This one is a bit more cpmplicated than the Simple one above.