JavaScript and Web development, they're like Statler and Waldorf (you know... the crotchety old critics from The Muppet Show). They're great. But it wasn't always that way. How about some history?
JavaScript is a scripting language first introduced by Netscape to allow code to run client side in a browser. Despite its name, JavaScript has absolutely nothing to do with the Java language. They share some syntax, both being derived from the "C" style of languages, but have drastically different programming paradigms. JavaScript is a dynamic language and while it has a lot of quirks and gotchas, it also has a lot of features.
The early years of JavaScript were troubled. Microsoft eventually provided a mostly compatible implementation of "Jscript," which they branded with a confusing and pointless acronym buzzword: DHTML (standing for Dynamic HTML, which just meant that JavaScript could modify the HTML document). As you can imagine, "mostly compatible" equated to a real pain for developers. We had to use JavaScript for features such as input validation, but the browsers' implementations were all slightly different or downright buggy. This meant a lot of "browser sniffing" where you had code that detected when you were running in IE and did something different as a result.
My general approach in this period was to write JavaScript code only when I HAD to. It required a lot of effort, especially testing compatibility in multiple browsers, and frequently resulted in messy code with different paths for different browsers.
Initially when you wanted to send data from the client to the server you'd post a form or click a link with data. The browser would send the data and load a whole new page. This was effective, but slow and not very efficient. It also made Web applications "feel" like Web applications. Along came XMLHttpRequest, which was a means for JavaScript to send and receive data in the background. Using "DHTML" the script could then update just portions of the page to reflect the new data. It took years for XMLHttpRequest to standardize across browsers in a way that was broadly usable. Once it did, the term AJAX was coined. AJAX stands for Asynchronous JavaScript and XML, but the "X" part is silly. You can use XML with AJAX, but it's not required and most programmers don't. (JSON is generally preferred.) I guess calling it "AJ" wouldn't have caught on in the same way!
JSON (pronounced "Jason") is a text-based format for data exchange. It stands for "JavaScript Object Notation," because the format is literally JavaScript:
{
"Name": "John Smith",
"Number": 10,
"Friends": ["Rose", "Martha"]
}
JSON is similar to XML in that it's a mechanism for encoding data as text in a way that is readable by humans and parsable by computers. It's more compact and lighter weight than XML, but also has fewer features and doesn't support things like meta-data or attributes.
Despite being based on JavaScript, JSON can be used everywhere and has parsers available in every language. I've used it successfully in many projects far from the Web.
Around 2006, an open source developer named John Resig released JQuery, a library/framework written in JavaScript. JQuery does two main things for client-side development: 1) it papers over browser incompatibilities so that you can treat browsers mostly the same, and 2) it provides a new paradigm and abstractions for client-side programming. The most basic example is that it allows a programmer to find and manipulate elements of a document far more easily than before, using selector style syntax adapted from CSS. It looks very cryptic at first, but is easy to read once you are experienced:
//hides all paragraph elements that have the "Secret" class applied.
$("p.Secret").hide();
JQuery's tag line is "Write Less Do More," and it was a true renaissance. Suddenly client-side code was small and concise and mostly just worked in every browser. It was now worth the effort to push some functionality from the server to the client and write more advanced client-side applications.
It's one of the most successful and widely adopted libraries around and remains in active use everywhere. According to Wikipedia, it's used by 65% of the 10,000 most visited Web sites. That's big!
In addition to the core project, there are related projects—like JQuery UI that provides user interface widgets like date pickers, tab controls and menus. JQuery Mobile is an HTML5 framework for building mobile Web sites. Additionally there are a lot of user-contributed plugins for JQuery, and it's easy to write your own extensions.
JQuery and AJAX have enabled Web developers to do more with JavaScript, and this has generated lots of new frameworks and interest in using JavaScript in new places. Here's a brief tour of some of them:
CoffeeScript: Basically a precompiler for JavaScript, in the same way that C++ used to be for C. CoffeeScripts adds syntactic sugar and new features, but is compiled down to pure JavaScript.
KnockoutJS, AngularJS, JavaScriptMVC, Backbone.js: These (and others) are part of a new breed of framework that does Model-View-Controller, or templating and databinding on the client side. They can be a big help in developing rich applications; some of them specifically target single page applications. I've personally had good success with Knockout, but haven't used the others much.
Node.js: This is a different animal entirely. Rather than client-side, Node.js is actually a server side application that uses JavaScript. It's frequently used to create lightweight HTTP server applications, such as Web services that support client-side code.
And if you're interested in learning more, check these out:
http://en.wikipedia.org/wiki/Javascript
http://stackoverflow.com/q/61088