How to prepare your jQuery plugin for the new plugins.jquery.com site

It’s been over a year since the unfortunate event that whipped out the plugins.jquery.com site’s database. But sometimes unfortunate events lead to better things and that’s the case with the Plugins site. Instead of trying to reinvent the wheel and create a website equally useful for plugin users and plugin developers (while fighting spam, maintaining the servers, etc.), the team decided to embrace the power of existing tools. Now plugin developers will maintain their code on GitHub taking full advantage of all its’ features, while jQuery Foundation concentrates on building a better user experience for “plugin users”.

This means that plugin development and maintenance lifecycles are moving over to more confortable and more suitable for this kind of work GitHub platform.

There seems to be a lot of confusion among “plugin users”, that they’ll need to deal with GitHub and such. “NO” – plugin users will see all necessary information about the plugin on a user friendly plugins.jquery.com website.

New architecture

Before we start, you should understand the general “architecture” and how the whole system will work. Basically there are 2 components:

  1. User side – website with a searchable index, description, links for download, etc. of all jQuery plugins (that’s basically plugins.jquery.com website, it’s front end will be on WordPress);
  2. GitHub – the place where all the development, issue tracking, documentation, etc. will be maintained (that’s where you, as a plugin developer, will spend most of your time).

Whenever you push to your repository, GitHub will send a request to plugins.jquery.com server and it will take care of the rest. It will pull the new changes and update related information on the website. So, let’s get started.

Steps to get prepared

As a plugin developer you’ll need to complete these 3 steps in order for your plugin to appear on jQuery Plugins website:

  1. create a repository for you plugin on GitHub;
  2. add a manifest file with all necessary metadata about your plugin (we’ll cover everything you need to know about it in the next article);
  3. add a post-receive-hook to your repository on GitHub (the URL of the hook will be published when the plugins.jquery.com site is up).

Step 1 is straight forward. Simple create a new repository for your plugin.

Step 2 is the most important part. The manifest file carries all necessary information about your plugin such as: plugin name, description, author, copyright, homepage, dependencies to libraries or plugins. Everything you need to know about the jQuery plugin manifest file, we will cover in the next post.

Step 3 is a one time action. After the plugins site is up and running the notification URL will be reviled and you’ll need to set it on repository settings page.

Now that you got an idea of how the new plugins.jquery.com site will work. Let’s cover what plugin manifest file is and what do you need to know about it in our next post.

TIP
All this boilerplate work can be automated with the task automation tool Grunt.