One of my side projects required the use of jQuery and AJAX to add interactivity to the website. What is jQuery and AJAX? They are both frameworks built on top of its base language, javascript.I haven’t alot of experiences dealing with javascript before so i’ve no choice but to start from the base language.

Regardless of prior programming experiences, i would still recommend learning a new programming language the proper way. Grasping the correct syntax and coding conventions could help a long way. I took about 4 days going through a series of web resources to learning javascript and shortlisted some of the best tutorials. Just follow through step by step.

0. Read up on fundamentals of Javascript

Javascript is the language of the browser.

Javascript used to be a client-side programming language running client web scripts. It’s primary purpose is to add interactivity to an otherwise static page. Javascript is normally used in conjunction with HTML & CSS to enrich your web contents. However, it has become more popular as a server scripting language in recent years, with Node.js being the new kid in town.

Eloquent Javascript by Marjin Haverbeke, is available freely online. Besides introduction to the language in depth, it also covers coding style and using javascript in the browser. “eloquent” isn’t an overstatement.

A Re-introduction to JavaScript. This introduction is on the Mozilla Developers Network, and it’s pretty dense in contents with many code examples. It would recommend quickly reading through to get a first impression of the language.

1. Go through the Javascript course at Codecademy.com

Codecademy revamped its courses to learning javascript and touted itself as “the easiest way to learn how to code”. There are currently two courses on JS: “Getting started with Programming” and “Javascript Quick Start Guide” Both of these courses are awesome way to dip into the JS pool and get a feel of the syntax of the language.

If you are already familiar with other programming languages, you can start with “Javascript Quick Start Guide”. If you are fresh to programming, “Getting started with programming” is tailored for you. Codecademy is free, but sign up is required.

2. Screencast tutorials at TheNewBoston

The New Boston for javascript has an awesome set of screencast tutorials geared for beginners. It’s a good way for beginners to follow and get a feel of how javascript programs are structured. I generally like screencast tutorials alot more because it’s easier to follow than written scripts.

3. Install and Learn Firebug(or Chrome Developer Tools)

Firebug is a plugin for Firefox browser that assists you in building and debugging web pages. If you prefer Google Chrome or Safari, check out the built-in developer tools.

Open developer tools panel by press Option + Cmd +I on mac, or Ctrl+Shift+I on the PC.

Check out some of the useful guides on using both of these tools:

• Firebug
  • Introduction to Firebug on CSS-Tricks
  • 10 Reasons Why You Should Be Using Firebug
• Developer Tools
  • Developer Tools Website
  • Google Chrome Developer Tools: 12 Tricks to Develop Quicker by Paul Irish

4. Begin Learning a JavaScript Library - jQuery

The point of a javascript library is to sugar down the painful stuff, which could mean extensive amounts of coding just to achieve simple functionalities. There are quite a number of javascript libraries available for free over the web but jQuery is probably the most popular and widely used library. For a start, read through the jQuery Documentations to get an idea of the ease of using javascript libraries as opposed to javascript raw language.

5. Work through the tutorial at Try jQuery

Try jQuery is just like codecademy which offers hands on tutorial to learning jQuery. I find it most beneficial by constantly referring back to jQuery API while going through the tutorial.

6. Screencast jQuery tutorials at TheNewBoston

Again, The New Boston for jQuery is a pretty good goto place to quickly get on hand with using jQuery optimally and see how professional use the library.

So the above pretty much summed up my 4 day adventure into javascript. I hope this plan can help you become good at javascript and build wonderful websites! If you have any other good javascript tutorials to recommend, please leave them in the comments below!