jQuery Plugin Development – 10 Tutorials To Get Started

jQuery, one of the most popular JavaScript library, has a huge selection of plugins which makes it more powerful.

On the other hand, there are much more codes/modules, from simple alert functions to complex galleries/form validation methods, that are hard-coded inside websites & not converted to plugins.

For sure, not every code must become a plugin, that would be meaningless. But converting the ones to be re-used will save a lot of re-development time & if shared with the community, will make the code itself better.

jQuery offers an easy to learn & flexible environment for creating plugins. Here are 10 tutorials to get you started:

Why Create A jQuery Plugin?

James Padolsey discusses the need & reasons for creating a jQuery plugin.

He clearly puts of the advantages provided like portability, time to be gained & more. 

Plugins/Authoring From jQuery.com

The first stop for everyone planning to create a jQuery plugin.

It covers the logic, naming patterns & steps like:

• Collecting static functions in objects
• Options
• Customizing animations

Developing A jQuery Plugin

Jonathan Snook is sharing his thoughts on developing a jQuery plugin.

A quick look to the basics & advantages of "why we need a plugin".

jQuery Plugin Tutorial, In-Depth For Absolute Beginners

A tutorial for absolute beginners, including fresh JavaScript developers.

It clearly shows the advantages of jQuery & creates a simple plugin named "Shuffle" by describing every step in detail.

Building jQuery Plugins

A tutorial for creating 2 different plugins:

• jQuery.tabify: for creating tabbed contents easily
• jQuery.lessMore: a plugin that can hide any number of childs of a given parent object

The Definitive Guide to Creating a Practical jQuery Plugin

NETTUTS shows the steps of a jQuery plugin development by creating a simple image loader plugin.

The plugin loads the images at the backstage, they are saved in the visitor’s browser cache, so, they will be usable throughout the rest of the site.

How To Create A Plugin For jQuery

yensdesign describes the basics needed like the difference between jQuery & jQuery.fn objects. Then creates an input highlighter plugin.

Building Your First jQuery Plugin

This is the tutorial for creating the jTruncate plugin, a well-known plugin for truncating text.

It includes tips like using jQuery rather than $, usage of extend method & more. At the end of the tutorial, you'll be created a fully-functional plugin.

Learn How to Create a jQuery Plugin

A step-by-step tutorial on creating a jQuery plugin that dynamically adjusts the styling of a specified element for always keeping it vertically and horizontally centered on the page.

The tutorial is supported with a screencast as well.

A Plugin Development Pattern

Karl Swedberg, a developer who already created several plugins, is sharing his experiences for a better jQuery plugin development process.