Starting javascript development - what to do?

Question

What it a good starting point for learning javascript? I'm a well versed C and Java programmer and I have some decent experience in C++, so I'm looking for a few suggestions:

• What is some good reference material?
• Is there a particular IDE/editor that is worth looking at? I use vim for C/C++ development and I used IntelliJ Idea for Java. I'm limited to either Linux or Mac based tools.
• How do you debug javascript code? Is it just a series of alert()'s?
• Am I required to run a webserver to test javascript, or can I load the .js file directly? If so, are there limitations to this approach?
• Any other advice for a javascript beginner?

Thanks

Answer 1

Start learning JQuery. It's the best thing for JS development, ever.

• No, you don't need a webserver. JS is browser based.
• As for an IDE, any text editor would do. Vim would work fine.
• Use Firebug in Firefox for JS debugging. It makes it so much easier.
• Again, use JQuery. It's great.

Alex

Answer 2

1. http://www.gotapi.com is a good reference for documentation
2. You can use whatever IDE you would like -- it's mainly text
3. Firebug is great for debugging https://addons.mozilla.org/en-US/firefox/addon/1843
4. You can test locally -- JavaScript is run on the client anyways so no real limitations
5. Once you get the basics down you might want to look at jQuery -- it really allows you to do some fantastic stuff that has already been tested, etc. so you're not reinventing the wheel.

Answer 3

If you are talking about javascript in the browser, you can just load an html page that includes your .js file.

Firefox is probably the nicest browser for JS development. The debugging console is handy and you'll want to look into a couple of plugins: firebug (http://getfirebug.com/) and Venkman (http://www.mozilla.org/projects/venkman/).

If you're happy with vim, you'll probably find it good enough for js development. Textmate on the Mac is nice, too.

Answer 4

I'd highly recommend learning Javascript using jQuery. Although most languages are best to learn without a framework, I'd say javascript is the exception to that rule. jQuery is well documented, and takes out alot of the hacks that you generally need to get your code working in all browsers.

For debugging, I don't know of any specific tools, but Firebug on Firefox is very helpful.

There's no need to run a webserver, but you don't want to load the JS file directly either, most likely. Generally, you set up an HTML page, and include the javascript file from there.

Answer 5

Since you already have a java background, the easiest way to jump into Javascript would probably be to check out an O'Reilly book. You'll get the syntax questions answered easily and be able to move on rapidly.

Concerning an IDE, I use either Dreamweaver or BBEdit on OS X, or VIM. I'm probably not well versed in what is available, though, I tend to be an old hat.

Most debugging is alerts, sadly. IE has the "errors found on this page, click here for details" box when you mess something up, but this will usually only get you within a few lines of the problem (if you're lucky!)

No webserver is needed. You can preview everything in the browser of your choice

Tips: Stick to learning what you want to know. There are various frameworks available out there that may "make things easier" but don't worry about getting into those until you figure out the basics. It is not a very difficult language, but can sometimes be very frustrating. Just apply your prior knowledge and you should be just fine.

Answer 6

Check Crockford's javascript articles first.

Answer 7

If you're looking for a reference book on the language, JavaScript: The Definitive Guide is the book to get.

Visual Studio is by far the best Javascript debugging environment, but that's not useful to you if you're limited to Linux & Mac. On that platform, I would agree with the suggestions for Firefox with Firebug and Venkman.

Answer 8

Keep it simple, and test everything across multiple browsers. Compared to the strictly controlled compilation of Java, you'll find Javascript is fuzzy and unpredictable. Many things don't behave themselves.

I don't use jQuery myself, but I'm starting to wish I did. Like many of the better javascript libraries, it papers over some of the cracks and makes the language more regular.

Answer 9

If you already use InelliJ Idea, it also has pretty good support for javascript development. It does highlighting, autocompletion, and some level of code validation. For debugging, the best tool I know is Firebug extension. As reference material, I suggest the book Javascript: The definitive guide, from O'Reilly.

Answer 10

You can use any texteditor to write javascript. I like Ultra Edit because it has syntax highlighting and code folding and sftp browser (almost any advanced text editors have), so it really doesn't matter. notepad++ is good and free with many features including highlighting and folding.

To debug javascript you can use firebug which is firefox addon. You don't need to use alerts. You can write console.log(somevar) and see value in firebug console. Check more information on firebug console api.

And you don't need webserver to run javascript. Just write html file with some javascript and open it with your favorite webbrowser. You might also want to check javascript frameworks like jquery, mootools or Javascript MVC. They all have good documentation and tutorials.

w3schools has basic javascript tutorial for beginners

Answer 11

You could run through Eloquent JavaScript, though some of it might be a bit elementary if you're an experienced programmer. Coming to grips with all the weird quirks of this language is probably the biggest challenge.

Answer 12

Try your best to learn it WITHOUT relying on a library first. Since you have background in C, its going to be a quick learn for you, so do so without being flavored by jQuery or Prototype. Learn to build a good XMLHTTP Request, manipulate the DOM, build your own objects, etc etc. Once done, look at all the libraries and see which suits your needs the best.

Always test in the latest browsers, and then work your way back.

If you're a very visual learner, the Head First series is good.

Answer 13

Oh, lastly, Aptana is an excellent IDE for javascript (and css). The free version is good enough for learning.

Answer 14

If you want to start from the beginning, then I always suggest starting here:

http://www.w3schools.com/js/default.asp

Someone else mentioned Eloquent JavaScript, which is a wonderfully formatted online tutorial that does a good job of linear teaching through the various concepts.

Even though you are an experienced programmer, these are simple references that will introduce you to 95% of the core language capabilities. Not that I have a problem with either, but please do not begin your journey with Crockford articles, or JavaScript: The Definitive Guide. In my experience that is the sort of information you digest after you have already been using JavaScript for a few months. Once you start getting into public and private methods, overloading, and class creation you are into "style", and not necessarily substance.

People don't like to reference w3schools because it does not begin with object oriented techniques and tutorials, and it has an outdated appeal. It is a big mistake, because before you get into the advanced stuff I strongly suggest you begin with the fundamentals. After you get those down, I suggest you pick up John Resig's book Pro JavaScript Techniques. John does a better job of covering some of the advanced techniques without getting into a bunch of the academic tripe you get elsewhere.

I also wrote this post, which did surprisingly better than I thought:

http://blog.reindel.com/2007/10/16/mastering-javascript-concept-and-resource-guide/

Answer 15

This is a great page to learn Javascript.

http://www.hunlock.com/

He covers all sort of areas without depending on Libraries. Which is the best way to learn. Once you understand what Javascript is really about, please go ahead and choose a library of your liking.

Answer 16

Douglas Crockford has several videos on Javascript on the YUI Developer Theater that are very good. There are two series I would recommend

The JavaScript Programming Language

Advanced JavaScript

which can be found at this link.

Answer 17

There is a good JavaScript book by Marijn Haverbeke. It is a very good introduction for the beginner.

Answer 18

I prefer working with Textmate and the jQuery bundle. It is my editor for everything, SVN commit mesages, Git commit messages, html, css, javascript, python, fooling around, typing blog posts, you name it.

Answer 19

Since you have proficiency in C, C++ and Java, I'll advice you to void comparing Javascript to these. Javascript has a similar syntax, but is fundamentally very different. It's a prototype-based, language. It has lexical scope, and it has first-class functions. Those are all aspects that are foreign to said languages. It is not without reason that Javascript has been called scheme with Java-syntax.

Answer 20

I think that there are a lot of good answers here with a lot of good suggestions, however, I also disagree with most of the answers that say "start learning with jQuery." I'm passionately against learning a framework for a language before learning the language in which the framework is implemented. You're automatically creating a level of abstraction for yourself. Knowing the language prior to learning jQuery or any other framework will help enhance your ability to understand what the framework is doing, how to write better code, and how to implement a feature into the framework that you wish was there but isn't.

With that said, here's a set of resources that I have found to be extremely helpful in learning JavaScript (some of them have already been mentioned):

Websites

• W3Schools JavaScript Reference
• Douglas Crockford's Website

Books

• Head First JavaScript. This book is really good at getting you up to speed on the synxtax of JavaScript and what it's capable of without getting you bogged down into the technical implementations of the language. It also helps connect the dots between JavaScript and the DOM.
• JavaScript: The Good Parts At approximately 150 pages, this is a relatively easy read that explains the good parts of the language and the bad parts of the language. This book will make you a better JavaScript programmer by staying away from the 'awful parts' of the language while also helping you to stick to the good parts and writing more clear, maintainable, expressive code.

Videos

• Douglas Crockford's videos on "Advanced JavaScript" (1, 2, 3)
• Douglas Crockford's video on "JavaScript: The Good Parts"

Frameworks

• jQuery. This seems to be the favorite around Stack Overflow. I've done some work with it and it really is a good library.
• Prototype. This is another library that I enjoy using. It's class creation and inheritance support are nice as well as its API.

IDEs

• Aptana Studio is the best JavaScript IDE that I've ever used. It has all of the features you'd expect from a powerful IDE with respect to JavaScript.
• Notepad. You don't really need anything other than a web browser and text editor for writing JavaScript, so if this floats your boat, then go for it.

Yes, there are more websites, books, and videos that can help you get started, but for someone that has a programming background, I can't imagine that picking up JavaScript would be utterly difficult. Additionally, there are other frameworks available, but jQuery and Prototype are the ones with which I'm most familiar and have found them to be really useful.

Answer 21

• The W3Schools website is a good place to learn the basics. It also has a great reference section: http://www.w3schools.com/js/default.asp

• The Firefox plugin "Firebug" is great for debugging.

• No, you don't need a webserver to run Javascrpt.

Answer 22

Debugging JavaScript; If you insert the line

     debugger;

in your JavaScript then your browser will usually fire up a Debugger. With IE and VS installed (if you are doing ASP.Net for example) then you can debug in VS. With Firefox and Firebug installed this will start the Firebug debugger which is helpful as the "set breakpoint" functionality in Firebug seems to be unreliable - at least in my case.

Answer 23

Since you come from a background in imperative languages, I would strongly recommend that you get to understand the power of closures and functions as first order values. In my experience, this is something that does not come naturally to java or c++ programmers.