Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
There are literally thousands of jQuery plugins. How do you find ones that are useful, work well and are actively updated?
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
There are literally thousands of
jQuery plugins to choose from.
0:00
Some are good, some are bad,
and some are just plain awful.
0:04
Often the hardest part of jQuery plugins
is finding a good plugin that does what
0:07
you want it to and is still maintained
by the person who created it.
0:12
In this video, I'll show you a few
places you can look for plugins and
0:15
some of the things you should take into
consideration when selecting a plugin.
0:19
Let's go.
0:23
Of course, the easiest place to start
finding anything on the web is Google, and
0:24
you certainly can find a lot of matches
when you search for jQuery plugins.
0:28
This isn't necessarily
the worst way to go, but
0:33
there are better places
to find jQuery plugins.
0:36
The jQuery Plugin Repository sponsored by
the jQuery project used to be the go to
0:39
place for finding plugins.
0:44
But they're shutting it down, in fact,
0:46
in might already be gone by the time
you're watching this video.
0:48
However, there are other plugin
directories that you can use.
0:52
For example,
SitePoint's popular jQuery plugins list
0:55
provides categories of jQuery
plugins that you can look through.
0:58
You'll still need to look at the plugin
and determine if it's a good one,
1:02
that's something I'll talk
about in just a minute.
1:05
Unheap is another great site
to discover new plugins.
1:09
They have over 1,000 plugins listed and
provide quick links to demos and
1:12
downloads for each.
1:16
But how do you know if
a plugin's any good?
1:18
Well, there are a few things you
should be on the lookout for.
1:20
First, you wanna find a plugin
that does something you need.
1:23
That might seem obvious, but it's easy to
get sucked into adding a bunch of jQuery
1:28
plugins to a site just
because they look cool.
1:32
The more plugins you add, the more files
your visitors will have to download, and
1:35
the slower your site will feel.
1:39
While it's important to create
sites that are fun, engaging, and
1:41
interactive, don't go overboard.
1:44
Let's check out this plugin.
1:48
This is the full screen,
vertical scroll plugin, FSVS for short.
1:50
It creates a nice scroll effect for
sections of a page.
1:56
This looks cool.
2:00
I might want to add something
like this to my site.
2:01
The next thing to look for
is clear documentation.
2:05
While most plugins are easy to use,
2:07
you'll usually still need clear guidance
on how to structure your HTML and
2:10
any configuration options
offered by the plugin.
2:14
This one seems pretty easy, the
documentation is right here on this page.
2:17
It shows how to call the plugin,
how to structure your HTML so
2:20
it works with the plugin and
lists the options available for
2:24
configuring how the plugins work, nice.
2:28
Next you want to see how old the plugin
is, and if it's still being developed.
2:33
For example,
if you find a great plugin but
2:37
it was created five years ago and hasn't
been updated for the past four years,
2:39
you can probably assume that the plugin
author has abandoned the project.
2:43
That means the plugin might not
work in current web browsers, and
2:48
any bugs you discover won't be fixed
unless you decide to fix them.
2:51
Usually you'll find something on the site,
or in the documentation that lets you know
2:56
when the plugin was created, and
if it's still being worked on.
2:59
Many, but
not all plugins are hosted on GitHub.
3:03
GitHub is a site for sharing and
collaborating on open source software.
3:06
GitHub provides lots of
statistics about a project.
3:11
For example, this plugin is hosted
on GitHub, let's take a look.
3:14
This project looks like it's active, you
can also see that there are several people
3:19
who have contributed to the project.
3:23
That's good.
3:25
More than one person is helping
to create and improve the plugin.
3:26
There are a couple of other things that
are good to look for in a plugin too.
3:30
These aren't absolutely required, but
3:34
in the changing world of web design,
they are helpful.
3:35
Look for plugins that are responsive.
3:38
That means they work with responsively
designed pages, that is, pages that
3:41
adapt to different screen resolutions
from small phones to televisions.
3:46
If you're not familiar with
responsive web design,
3:50
we have a few videos about
it here at Treehouse.
3:52
Look in the teacher's notes for links and
3:55
more information about
responsive web design.
3:57
It's also good if a plugin
is mobile friendly.
4:00
That is, it's designed to work with
mobile devices, phones and tablets.
4:03
That usually means the plugin
will work with touch gestures,
4:08
like a finger swipe or a pinch.
4:11
Let's see,
4:13
this plugin isn't affected by the width of
a page because it's just first scrolling
4:14
down, that means it will probably
work fine with responsive designs.
4:18
However, it looks like they're having
problems getting it to work with mobile
4:22
devices.
4:26
That might be a problem.
4:27
If I'm building a site that I expect or
hope will get a lot of traffic from mobile
4:28
users, then I should skip this plugin, at
least until it's made to work on mobile.
4:32
Now be careful picking plugins.
4:37
If you find one that will be a big part of
your website, you need to make sure it's
4:39
being actively developed, fits your needs,
and will work for all your site's users.
4:42
In the next video, we'll look at
the plugin that we'll be using in this
4:47
section of the course, and you'll learn
how plugin files are usually organized.
4:50
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up