Learning jQuery

The first issue of Visual jQuery Magazine is now available from the Visual jQuery website. The website is an excellent reference for the jQuery API. In fact, it hooks right into the comments of the latest jQuery version, formatting everything into a highly readable, visually appealing page. The new monthly magazine extends the Visual jQuery brand to a PDF-format publication.

Issue 1 features an interview with jQuery’s developer John Resig, an analysis of what sets jQuery apart from other JavaScript frameworks, a quick look at a few plugins, an introduction to the jQuery Object, and much more.

Editor Yehuda Katz has put a lot of work into releasing a first issue that is both beautiful and informative. Visit Visual jQuery Magazine or download it here (1.7MB PDF). Congratulations, Yehuda. We look forward to many more great issues to come.

JonBob and I have been working on a TextMate bundle for jQuery over the past few weeks. If you’re not familiar with TextMate and you own a Mac, you should definitely check it out. It has saved me countless hours of repetitive keystrokes with its bundles, which contain commands, code snippets, templates, and macros that are triggered by pressing special key combinations or clicking menu items.

The jQuery bundle that we put together mostly consists of “tab triggers” for various functions, but it also includes context-sensitive help derived from the online documentation and some nice syntax highlighting. After selecting jQuery as your file type in TextMate, you could, for example, type ready and press the Tab key to produce this:

$(document).ready(function() {
  // Stuff to do as soon as the DOM is ready;
});

It’ll then select the commented line (line 2 in this example) for you so you can start typing right away, replacing the comment with your code. Hit the Tab key once more and it drops you onto a new line below the closing brackets. If you want to learn more about a function that you’ve typed in, just click anywhere inside its name and press Control + H. You’ll get official documentation on the function.

Get the Bundle

So, how can you get this cool jQuery bundle and speed up your coding? First, you’ll need TextMate, of course. If you don’t have it yet, download the 30-day trial. Then you’ll need to either check out the bundles from the Subversion repository (advanced) or download and install the GetBundles bundle.

A new feature has been implemented; all jQuery code snippets we post will now be linked to the appropriate part of the documentation. So, for example, when we post:

You can click on the function names "find," "hide" and "end" for more information on the functions. These definitions are culled from the same XML file that powers the official API documentation.

Welcome to the new Learning jQuery — a multi-author weblog with the aim of sharing information about this most amazing of JavaScript libraries. As we post entries, you might begin to notice that the three authors — Karl, Dan, and JonBob — approach jQuery, JavaScript, and life in general from three different perspectives. Our programming experience ranges from beginner to advanced, so we hope to appeal to all levels of other programmers out there as well. We'll do our best to make each entry clear, concise, and understandable, and we'll also try to place them in categories according to level of difficulty. If you have questions or critiques or suggestions for improvement, well, that's what the comments are for. Enjoy! p.s. This entry probably should have been the first one on the blog, but in the rush and excitement to get this thing rolling, we jumped right in with some code.