Learning Javascript or Simply the JS Frameworks?

With such libraries as jQuery existing for us as web designers to utilise, is there actually any point in learning the language jQuery runs on? And by learn I don’t mean the very basics, I mean be able to use the underlying language (in this case javascript) to a degree of which you could recreate effects achieved with your framework.

It seems to depend on the language which we are talking about – personally I’ve got experience mostly with jQuery as a Javascript framework, but also popular are PHP frameworks. However it is much harder to work with a PHP framework without a good understanding of PHP, so this article will mainly focus on Javascript and the many popular libraries that exist for it, the most popular being jQuery as I earlier mentioned. In this article we’ll discuss the pros and cons of learning the base language and hopefully try to come to a rounded conclusion. Feel free to add your comments and opinions; it would be great to do a follow up article in a few weeks with your opinions.

Why you should learn the base language?

1. Frameworks don’t do it all.

Whereas frameworks and code libraries often take a lot of the heavy lifting when coding up sites, they can’t do it all. If you come along and think “I need to do this” and your framework does not provide such a function, you’re stuck up a creek without one very handy paddle. Yet if you spend time learning the base language, you can dive back into it and achieve the additional effect your library does not cater for.

2. Employment

Taking Javascript once again as my example, imagine you’ve spent 9 years working with jQuery but never took the time, for whatever reason, to fully learn Javascript. Then you see the perfect job vacancy, javascript developer at a well respected company with very good pay. You’re thinking to yourself that they HAVE to pick you, you’ve worked with javascript for so long, but when you arrive and they ask you about your knowledge of javascript, you’re in trouble. Because unless the company is happy for you to use jQuery, once again you find yourself stuck up that creek without the essential paddle. Ok so this might be a slightly exaggerated example, but hopefully it gets the point across. Even if you know that in every day design you will use a framework, taking a few weeks to learn the base language can pay its dividends in the end.

3. Easier to pick up the framework

If you didn’t understand what a virus was, you would be running into lots of problems trying to configure your virus software would you not? It’s the same with frameworks to a certain extent, if you’ve spent a period of time with javascript, the syntax that jQuery (and most other javascript frameworks) uses is going to be a lot easier to pick up and a lot easier to master.

4. Edit the Source and Plug In!

It’s always great fun to dive into the code and edit the library to suit yourself, you can add your own functions when you find a gap in the library – or if modifying source code does not suit you, most frameworks make it very easy to make additional functionality in the form of plugins, just follow the guidelines, and now you have your very own plugin. Now, if you had little understanding of javascript, this would be a lot harder (but arguably possible, especially in the case of jQuery).

Rounding it all up

So we’ve now looked at why you should, lets see why perhaps you shouldn’t.

1. Why reinvent the wheel?

If my library does this and it does that, why do I need to know what happens behind the scenes? Probably the most popular argument towards not learning the base language. If we should all learn javascript, why bother with libraries?

2. Time = Money

Also a popular and very understandable point to raise, libraries are often very easy to understand and are substantially quicker to pick up and utilise efficiently.

3. It’s Nicer Code

This is my favourite.  Libraries produce nicer code then plain old base language (this is very noticeable in the case of javascript/jquery). For instance, take a look at a code for a basic image gallery, first in javascript, and then jquery:
java script:

function showPic(whichPic) {
    var source = whichPic.getAttribute(”href”);
    var placeholder = document.getElementbyId(”placeholder”);
    placeholder.setAttribute(”src”, source);
    var text = whichPic.getAttribute(”title”);
    var description = document.getElementById(”desc”);
    description.firstChild.nodeValue = text;
}

We would then have to interact further with our link items. This code is also less easy to skim through and quickly see what is going on, whereas I think you will agree jQuery simplifies the process:

$(”#imagegallery a”).click(function(event) {
    event.preventDefault();
    var image =  $(this).attr(”href”);
    $(”img#placeholder”).attr(”src”, image);
    var description = $(this).attr(”title”);
    $(”#desc”).empty();
    $(”#desc”).text(description);
});

Even if the code does not seem much different, it is nicer. Granted, for such a simple example as this, the code is not going to differ, but get into more complex problems/solutions and it becomes much more clear. The best example in those code blocks is putting some text into an element with an id of “desc”. This is the javascript way:

var description = document.getElementById(”desc”);
description.firstChild.nodeValue = text;

Uhh! Yucky nodeValues and all this messing around with children. The jQuery way:

$(”#desc”).text(description)

Much nicer! In one line we have selected our element, and change the contents of the element to the contents of the variable description. It’s an easier, more elegant way of writing things, and this is one of the main pluses for using jQuery.

Conclusion

I said at the beginning that I wanted to come to a rounded conclusion, so now it’s time to live up to expectations! From a personal point of view, I jumped straight into jQuery with a very, very limited knowledge of javascript and never really regretted it. Not until I came to want to do something, searched “jquery function do something” and found nothing. I realised my huge assumption – jquery cannot do everything. jQuery is not a language, jQuery is an add-on that is built on top of the javascript programming language. Metaphorically, you wouldn’t build a house without foundations. The same can be said here. My opinion is that it is by no means a necessity to learn Javascript before jQuery, but it certainly will pay off  in the future. I’m not suggesting you should go out there and learn javascript through and through, from beginning to end. But just a little basic knowledge can get you a long way. There are those of you who will argue it is a necessity, those that will argue it’s not really needed. It’s down to personal opinion, I’ve told you mine and it would be great if you could let me and other readers know yours. I hope this article is of interest, please do share your thoughts and leave a comment, it’s always great to see what other people think.

12 Comments on "Learning Javascript or Simply the JS Frameworks?"

  1. Jason says:

    Learning the core language is essential. It allows you to troubleshoot various issues, it gives you the knowledge to determine which library is best for your project, it also allows you to add additional code to the core framework.

    Learning the core language also gives you the choice on whether you need to use a framework or not. There are many times when if you are only going to be adding a few show/hide functions you really do not need the overhead of library when you could you write a small 2KB file to do it.

    A hobbiest is fine learning a library. A professional should really know the language behind the library.

  2. Mike says:

    Jason said it well. If you’re just doing websites for a hobby, or a few sites here and there for some friends, jQuery or a similar framework is really all you need. If you’re a professional web designer/developer, you really should know the technologies you’re working with the best you can. It’s part of the job.

  3. Dean says:

    I absolutely agree that knowledge of the language a framework is built on is essential. I cut my teeth programming in PHP. When I started digging into Javascript, it took awhile to get my head around the DOM and events. It wasn’t until I started working with jQuery did I start to get it.

  4. Great Article!
    I am Brazilian web developer and work with javascript for a long time, even before there JQuery.
    Jquery is very good, very useful and helps us a lot.
    In my opinion is easier to learn Jquery knowing Javascript.
    The problem is that some people just “copy and paste” some code made in Jquery,
    or just put a plugin in your website and
    they forget what is this in fact.
    Always is Javascript.
    Again my opinion, for the beginners is : Learn Javascript, Jquery nothing is more than that pure and pretty Javascript.
    Thanks for the great Article Jack.

  5. Ionut Staicu says:

    I personally started with prototype few years ago and after a month (or so) I switched to jQuery and i’m stuck with it since then. My pure js skill is very (and I mean VERY!) limited: i know how to work with arrays, basical stuff and… that’s all.

    Using a framework allows you to focus on code/functionality, but when you using raw js you may encounter many browser specific issues. I want to spend time in a more convenient way than debugging browsers bugs ;)

  6. rich97 says:

    Nice article but I’d say always take time to learn the language even if only a bit (applies to all languages/libraries).

    I don’t claim to be a JS master. I’m not a big fan of JS anyway and when I do use it I mostly work with jQuery. But if I need to then I can work with raw JS. Though, if a JS expert saw my JS they’d probably slap me and tell me to go read a book on proper JS practice.

    Also, this article does seem to be mostly comparing jQuery to Javascript, jQuery has very little functions dedicated to helping you code seriously in Javascript. It is mainly dedicated to traversing and manipulating the DOM. If you want to have a library that would help your average JS programmer you would pick something more like MooTools. There is a great article discussing this here

    Finally, you’re missing a BIG point to do with client side libraries. jQuery is tested and working on all browsers. As I saw someone tweet the other day “I love jQuery, works first time as expected.” (or something similar). It cuts down debugging time hugely and does it with a relatively small file size.

  7. Kevin Lloyd says:

    I often wrestle with these types of decisions. I tend to agree with @Ionut Staicu and the end of the article. Time == Money, and sometimes it just isn’t worth it. And this whole browser compatibility this is another reason I broke away from regular JS. Let someone else worry about that. And the whole reinventing the wheel thing speaks for itself.

    With that said, it all depends: If you’re a “Javascript Programmer” then you’d better damn well know pure JS, all the ins and outs. Also, it depends on what you are trying to accomplish. For me, the term “Web Developer” is just too broad to be able to cover everything thoroughly.

    I will disagree with @Jason and say, if you’re going to only be doing shows/hides/etc, that is a perfect time to use a framework. (However, in my experience, it’s never just that). The benefit of real JS really shines when you’re doing very custom work.

  8. nightS says:

    I once built the XHTML/CSS for a developer who insisted on not using JQuery (I still can’t figure out why) at ALL. So I had to do all the work JQuery does normally with one line of code.

    It was shocking ..but I learned alot..I created a sliding timeline (with images and tooltips as well) from scratch..It took me more code and time ofcourse..but I figured out the hard way that I should keep on improving my JS skills and not depend on frameworks only.

    Thanks for the post

  9. Cedric Dugas says:

    I don’t know one company that still do plain JavaScript, they all use frameworks. So the question is, if you are a really talented jquery scripter, can you pick up easily another framework.

    I think the answer is yes

    Javascript is fine, the DOM is a mess, frameworks corrected that.

  10. Jack Franklin says:

    Hey guys,

    Thanks to everyone for their comments. It seems like the popular opinion is to learn both as I expected to be honest.

    @rich97 – I compared it to jQuery purely because it’s what I use regularly and seems to be the most popular library out there. I’m actually in the process of attempting to pick up MooTools now after that fantastic article you linked to.

    @Cedric Dugas – I disagree to an extent. Whereas knowing jQuery may assist in learning another framework, I don’t think it immediately makes it easy. As I said above, I’m trying to get used to MooTools and I have not found it very easy.

    @Kevin Loyd – I think you last point sums it up best, that for simple fades, animations jQuery/other is the way to go, but if you want to be a serious javascript person, I think there is no way you can not learn javascript.

    Once again thanks for all your comments, keep them coming ;)

    JF.

  11. Cedric Dugas says:

    @jack Okay maybe the easy part was a bit too far. I think jquery is a bit apart from other frameworks on this. Their mojo is write less,do more, and it comes with some hindrances. It’s really far from the javascript normal “grammar”.

    Mootools is more JavaScript ish in its form, as like most js frameworks. I still stand to my point, most jobs will require you to learn an api on top of JavaScript, and if you know one and are good with it, you can learn another.

  12. Jennifer says:

    I think if you learn JavaScript core language you will see more opportunity to use it in other applications. For example, you could write scripts for Adobe’s InDesign using JavaScript.

    I started with simple in-line functions and event handlers, realized it was limited and bad practice, dove right into jQuery to do cool browser compliant things, now I’m back at studying the core language and the DOM. I’m especially interested after learning it’s applicable in the software I use for print files at my job. It would be nice to know how to batch process a load of .indd files to pdfs with a script.

Got something to say? Go for it!