After I chose Yii Framework as my server-side technology, the next thing to choose was a JavaScript/AJAX library.

I was quite confident from the beginning that I’d use jQuery. Even though I never used it before, it seemed like everyone else was, so I though it must be pretty good.

Before jQuery I used ExtJS a little. ExtJS has a lot of cool widgets, but I never really understood how its widgets worked inside. I had some experience using Ext’s Element class to modify the DOM directly - I liked the low-levelness of it, but it was a little awkward to use. The thought of coding my own widgets (which I had to do for this new project) using ExtJS was scary.

So knowing that my new project is almost 100% JavaScript/Ajax and that I would have to write my own widgets since there aren’t any existing ones in any library that are like what I need, I decided to go with what people said was the best DOM manipulation library .. jQuery.

And so I tried it out … and was quickly amazed with how fast I was making progress on my project. Within a few days of using jQuery, I had the basics of the most important widget I had to code running. Using jQuery is a joy and whatever you imagine you can code it jQuery pretty quickly with only a few lines of code … but maybe too quickly.

The problem with using jQuery by itself is that because it is so easy to use, it can make you lazy in regards to structuring your code well and trying to make your code re-usable. Because everything feels like it’s only a few lines of code away to reality, you tend to go on and write it even though you already wrote a similar block of code just a few hundred lines above. At least this is what happened to me.

Because of this, even though I got my app working in only a few days it was (almost) all spaghetti code with little blocks of copy n pasted code all over the place and it was hard to find where to change things.

jQuery has a ‘plugin’ mechanism where you can extend jQuery by adding new functions to the $() object but I found it to be lacking. What was needed was a good Object Oriented Class system for JavaScript. My solution to that is going to be in my next post.

In any case, I have to say that jQuery is a very elegantly designed library that fulfills its purpose (DOM Manipulation) extremely well.

Here are the articles that helped me most when learning jQuery and more advanced JavaScript:

JavaScript Object-Oriented Programming Part 1 and Part 2 (a little dated, but explains the basics nicely)
Explaining JavaScript scope and closures
jQuery for JavaScript programmers
Improve your jQuery - 25 excellent tips
5 Tips for Better jQuery Code