Gee's Blog World: Six great resources for budding JavaScript coders

Six great resources for budding JavaScript coders

As a relative newcomer to the world of web development, it sometimes seems to me as though there is a gulf in the field: The "pros" versus the "wannabe developers". As if there's a tight-knit clique of developers, all well-versed in arcane stuff like advanced user scripts, HTML5, or Ruby on Rails -- and then there's the "rest of the world", composed of mere mortals just trying to hack something together that would somehow display and sort of work across multiple browsers.

So the question becomes: How do I bridge the gap? How can I become a decent, skilled JavaScript developer without spending a boatload of money?

After the fold you can see my take on that issue, consisting of one piece of advice and five resources which I find useful in this quest!

1: Be professional about it

I know, I know; this is not a "tool" per se, and you might even say it's a trite thing to say. But all of my other recommendations are predicated on you taking JavaScript development seriously. After all, how can you ever become a pro if you don't even try?

Take a stroll through any web developer forum and you'll see most people approach JavaScript development on a "by the way" basis. By this I mean, "Screw learning, let's just throw something up on the page!" ... and "Can anybody tell me how to split a string?"

So first thing's first - attitude. Change starts with you. The resources I outline below may all be quite affordable in terms of cash, but some of them do cost quite a bit of time. Learning takes time -- it's a fact of life.

So now that I've hopefully got you in the correct mindset, let's see some tools.

2: Learn about JavaScript from Douglas Crockford

Douglas Crockford is a genius. Seriously - the guy is brilliant. He's currently serving as Yahoo!'s chief JavaScript architect, he invented JSON (a widely used data interchange format), he's part of the ECMAScript committee (the guys setting the JavaScript standard) and has a very broad understanding of the general history of programming languages and computer science.

Recently, Crockford gave five talks about JavaScript as part of Yahoo!'s YUI Theater. These are all available for free, and they're over five hours in length (more like six to seven hours in total, I think). What's so cool about these talks is that Crockford really gives you a bird's-eye view of the subject; the first hour is just history, and it's really fascinating. It's all over the place, starting with the Jackquad loom, through why we have both a Delete and a Backspace key on our keyboards, all the way to modern programming languages and JavaScript.

I took the time to watch all videos and they were the first "real" thing I ever learned about JavaScript. Except for the fourth talk where he got very technical and lost me, they were all very interesting, and gave me a great viewpoint on the language.

One thing I like about Crockford is that he doesn't sugarcoat anything. If he thinks a JavaScript feature sucks, he would just come out and say it, and then very eloquently explain why. Really - take the time to watch these videos; you won't regret it.

3: Safari Bookshelf

When I finished watching Crockford's videos, I knew I wanted to read his book, titled JavaScript: The Good Parts. With the book, Crockford really gets technical and explains what he sees as the best way to code JavaScript, and why.

So now I had to find what's the best way to read that book, and I believe I have. The Safari Bookshelf has nothing to do with Apple, and has everything to do with O'Reilly, Apress, and a whole bunch of computer-publishing heavyweights which have all banded together to provide a superb online library.

Crockford's book costs $19.79 on Amazon. For $23/mo, Safari Bookshelf gives me unlimited access to a full-text, nicely formatted copy of that book, plus 10,966 other titles. Yup - almost 11,000 other books, all full-text, nicely formatted, top-of-the-line computer books, straight from the publisher. That's some serious bang for the buck.

And that's the "cheap" subscription (they don't actually call it that, though). If you go for the premium subscription, you get access to tons of videos, early drafts of books ("read them while they are being written"), and some other goodies. I didn't spring for Premium, though, so I can't really tell you what it's like.

Reading a complete book takes time. But when you pick the right book, you get the sort of comprehensive coverage you would never get by Googling or following online tutorials.

4: Lynda.com

I covered Lynda.com before. If you're more of a visual learner, Lynda.com is hard to beat. For $25/mo, you get unlimited access to a library of thousands of hours of high-quality video courses in any computer-related topic you can think of, from Office, through graphics apps all the way to programming languages and web technologies. I studied a complete 11-hour PHP course, and I was very happy with it. I followed along (video on one monitor, PHP development on the other monitor), and it really gave me something.

Lynda also offers a JavaScript course by Dori Smith, who seems to have a very solid understanding of JavaScript. I must admit I did not personally use this resource because the pacing was a bit slow for me, but it might prove useful for you. Give it a shot - you can even watch the first few videos for free!

5: Komodo Edit

Oh DLS readers, how you love to bash me in the comments; but despite any criticism, I still think Komodo Edit rocks for PHP-related work, and it's proven invaluable for JavaScript development, too.

I get beautiful code highlighting, code completion as it was meant to be (even though I must admit Microsoft sets the gold standard for this one), and instant squiggly underlines showing any syntax errors.

Firebug for Firefox

One thing Komodo Edit doesn't do is proper debugging; for that you need to spend money on a proper IDE, or simply use Firebug.

Firebug has completely changed my web development workflow. It has a profound impact on any CSS or HTML work I happen to be doing, but I've also started using it for JavaScript debugging. I mainly use the error console, but I also use it to dig around in any JavaScript files that come along with the page I'm currently loading (very useful for creating user scripts utilizing existing functions on the page). I prefer the console to Firefox's built-in JavaScript console because it's prettier, and thus easier for me to figure out.

Another huge Firebug feature is that I can set breakpoints, watch variables and step through any JavaScript executing to try and figure out what's making it break. In other words, it offers proper, full-fledged debugging.

If I ever work on one of those newfangled "web apps", I will probably end up using Firebug's profiling facilities, which are supposed to help optimize the execution speed of my scripts. But in that regard, I think Chrome offers some better tools than what Firebug brings to the table at the moment (even if you consider YSlow).

Your Turn

So, what did I miss? Do you know any awesome resources for a novice coder who's trying to get his JavaScript on? Feel free to share in the comments, and I might write a follow-up with some of your suggestions!