Recovering From jQuery
Tags: jquery, javascript, refactor, webdev
Published: 2019-06-06 16:02:01

---
title: Recovering From jQuery
published: true
description: Why I am currently un-jQuery-ing a massive project
tags: jQuery, Javascript, Refactor, webdev
---

I started learning jQuery more than 10 years ago. I needed to implement Ajax and make pages more dynamic - or so my boss regurgitated at meeting one day. I had been toying with HTML since the stone age (1996) and started learning PHP/MySQL because our simple site just had to have it.

But JavaScript? Really? I <em>hated</em> it! I tried to get some stuff done with it during the IE 4/Netscape 4 browser wars, but it was not easy and I really didn't want to mess with it. <strong>Ever.</strong>

I found the simplest setup for an Ajax call I could find (roughly 20 lines of code, I think) and started making requests to PHP. I had PHP render all the HTML which I passed back and dumped via <code>.innerHTML</code>... Ah, the good ol' days. (lol)

A lot has changed since then, primarily finding and learning jQuery -- which led to me landing my current position.

Little did I know I was walking into a <em>hornets' nest</em> with this Backbone.js/jQuery project. It had already been in production for a year or two and I was told to never, ever, under any circumstance, update any of the existing libraries, especially jQuery (because, in the past, everything broke).

That was all well and good, until a client ran a scan for vulnerabilities on our system. Oops! I was now told jQuery (1.7 at the time) had to be updated, as well as any and all libraries that could be updated. This, ladies and gentlemen, was not fun.

I had already started playing around with React and was looking at Angular. I saw that jQuery wasn't really something people were (intentionally) working with these days, that plain old JavaScript was better (and easier to use) than it used to be!

Now that all of our libraries have been updated and our potential client is our actual client, I have decided to refactor as much/many of our views as I can with<b>out</b> the use of jQuery. I started out just using some arrow functions, changing <code>var</code> to <code>let||const</code>, changing <code>$</code> to <code>document.querySelector</code>, and <code>.html()</code> to <code>.innerHTML</code>. I'm currently writing mini-libraries to replace jQuery UI (among others).

I am learning so much doing things this way. (The first thing I learned was that <em>I didn't know JavaScript, I just knew jQuery.</em>)

However, I'd be remiss to not leave you with some of the resources that have really been helping me:

<ul>
<li><a href='https://gist.github.com/erlendmr/7935726'>Moving from jQuery</a></li>
<li><a href='https://css-tricks.com/now-ever-might-not-need-jquery/'>(Now More Than Ever) You Might Not Need jQuery</a></li>
<li><a href='https://code.tutsplus.com/tutorials/from-jquery-to-javascript-a-reference--net-23703'>From jQuery to JavaScript: A Reference</a></li>
<li><a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript'>MDN :: JavaScript</a> (Invaluable!)</li>
</ul>

I would love to see what resources/methods others have incorporated to make this change. Please comment with your story/path/whatever!

*Please don't bother commenting with rants about not upgrading earlier.

Check out <a href='https://dev.to/edlinkiii/refactoring-jquery-2klg'>Refactoring jQuery</a> to continue this journey with me.