July 19, 2024

How To Find the Best Free JS Plugins for your Website

It can be difficult wading through the sea of free open source code to find exactly what you’re looking for. Each project has its own feeling and purpose based on the context of the situation. This means developers are continually searching for the best free plugins to save time instead of writing every line of code from scratch.

I’d like to share a number of resources that should prove useful to every web designer & developer. Each of these tricks and online webapps place a focus on free plugins and free source code. Tutorials are another method of learning to code which teaches developers how to create plugins and how to edit them properly. I don’t assume that every person would find all of these resources useful – but depending on your skillset and project workload some of these links will be a lifesaver.

Code Repositories

By far one of the most popular and incredibly important tools of the modern Internet era is GitHub. If you’re a developer I must advocate that you sign up for an account if you don’t already have one. The site is like a social network full of developers with knowledge in every programming language under the sun.

Each person has their own profile which includes a list of all their code repositories, or repos for short. A repo could be anything from a detailed WordPress theme down to a tiny jQuery plugin. There are repos for Objective-C iOS apps, Java Android apps, RoR gems… if you need it there’s probably a repo on GitHub.

education github page interface ui

Best of all GitHub as a product is completely free without any need to ever pay money. All public repos are also free and they each include a download button over to the right-hand side. Take for example the jQuery library which surprisingly does have it’s own GitHub page.

jquery github repository library

The repo will list all of the files included with jQuery, when they were last updated, and some details about the project. You can also browse through support issues or post a new issue of your own.

Perhaps the best feature about GitHub as it relates to web development is the search functionality. Just punch in some keywords and enjoy. For example if I needed a carousel rotator/image slider I might search for “jquery slider” and see what comes up. The results can be filtered by best match, number of stars, recently updated, and other parameters.

github search jquery open source

If you’ve never used GitHub before then please make this your first stop. It’s easy to get caught up in all the beautiful repos and spend 30-60 minutes just browsing through everything. And best of all you can find plugins for nearly every library or CMS in existence. Actually the best part is that it’s all 100% totally free!

Google Queries

I can’t overstate the immense value acquired through Google. Whenever I have a problem or need to find a solution Google is often my first choice. But it’s not enough to just type some keywords and expect their search algos to do the rest. Google is a tool, and like all tools it becomes more powerful in the hands of someone with experience.

A good rule of thumb is to not always expect to get your best results in the first 2-3 searches. This attitude is what causes developers to give up and go look somewhere else. One technique I like to use is limiting keywords based on a single website’s domain. This is accomplished by appending site:domain.com at the end of your search.

For example, to look for a solution to a recently encountered problem you might try limiting keywords to site:stackoverflow.com. This query would offer thousands of results and it’s likely that you’ll find exactly what you’re looking for. Alternatively you might be searching for a tutorial or plugin with specific functionality, so extra keywords will produce more accurate results.

google search tips tricks page

If you’re looking for a certain technique look over Google’s search tips & tricks webpage. This includes a basketful of content directed specifically at those who want to take advantage of everything that Google has to offer.

Organized Plugin Galleries

A number of people have built their own websites showcasing hand-picked jQuery plugins. These galleries are meant to be resources for developers to find the latest & greatest plugins as they’re released on the Internet. Since there is no central release point it can be tough to locate new plugins as they become available.

unheap jquery plugins showcase

My #1 absolute favorite gallery is Unheap which organizes jQuery plugins based on a number of categories. These include forms, animations, navigation, embedded media, and a whole lot more. The site must have hundreds if not thousands of different plugins for any purpose imaginable. Each plugin has its own little featured preview along with outbound links pointing directly to the plugin’s homepage & demo page.

By comparison my next recommendation would be jQuer.in. The design isn’t as sleek and it’s a little more difficult to navigate – but jQuery.in updates far more often than any other plugin gallery I’ve found.

jquer in jquery open source plugins

This means you’ll really be up-to-speed on the pulse of new technologies as they’re released. It’s worth checking the jQuer.in homepage every few weeks just to see what’s been posted. Sometimes you won’t find anything but other times you’ll be pleasantly surprised with a pile of very cool resources.

jquery rain open source codes

The last plugin gallery I want to mention is jQuery Rain. This one can be a little confusing because it’s structured more like a blog instead of a gallery. But the links are updated frequently and it’s certainly a reliable resource for great jQuery plugins. One thing I’ve noticed is that jQuery Rain often includes tutorials as well as plugins. This may or may not be useful depending on how much work you’re willing to put into development.

But when it comes to finding great plugins you can never go wrong with these galleries. Most items are curated by hand to be checked for pristine quality and a set of code that actually works properly.

Cloud IDEs

Cloud hosting is in a rapid growth cycle and has proven to be an excellent choice for many different platforms. Saas(Software as a Service) is almost completely predicated on the notion of paying a fee in order to use some cloud-based application. But the most interesting and popular cloud apps often turn out to be free.

When searching for plugins you won’t always find the perfect codebase, however you might find a great example that can be converted into a plugin. Developers like to host demos in the cloud for editing their code on different computers and sharing with others around the world. This has turned into a huge market full of services like CodePen and JSFiddle.

open source code snippets codepen editor

I really like these cloud applications because most user profiles are public, and developers like to share their code online. Some apps even let you search for particular keywords or tags which can be very helpful. But another choice is using Google as I mentioned earlier.

By searching for a piece of functionality and limiting to a certain domain you’ll get much more explicit results. This allows you to browse through 40+ pages of results pulled from any cloud IDE service. Granted this may not lead to a specific plugin, but it will lead to some great examples and free code snippets which can be edited as you please.

Closing

Whether you’re an experienced developer or just getting started in the field, these resources should give you a leg up on frontend JavaScript. With enough patience and practice you’ll grow to understand a lot more about the world of dynamic frontend web development. If any of these links caught your attention make sure to bookmark them for later. Additionally if I forgot any resources for plugins feel free to share with us in the post comments area below.

Jake is a creative writer and UI designer by trade. You can follow him on twitter @jakerocheleau or learn more at his personal website JakeRocheleau.com.

One Comment

Leave a Reply

Your email address will not be published. Required fields are marked *