| JavaScript/Ajax |
Click to Hide |
| HTML Refresher |
This section begins the course with a fast-paced refresher to the most fundamental building block of any web page or application. Comprehensive coverage of the most commonly used HTML elements is presented along with important, but commonly misunderstood constructs such as META tags, DOCTYPE definitions, etc. Especially common topics such as HTML forms, tables, and frame sets are are presented. An introduction to the Document Object Model and how it relates (and doesn’t relate) to JavaScript along with a brief synopsis of how the DOM and W3C standards governing the DOM rounds of the section. |
| CSS Fundamentals |
This section includes a full crash course on CSS and picks right up where the previous section left off. The difference between content and presentation is emphasized, common layout patterns are implemented using pure CSS, and especially common CSS gotchas (of all kinds) are presented so that you don’t fall prey to them when time is of the essence. |
Introduction to JavaScript Part 1 |
An intense introduction to the core JavaScript language independent of any underlying Document Object Model (DOM) begins the next section of learning. Covers details of familiar programming constructs such as primitive data types, arrays, maps, loops, conditional logic, error handling, etc. Distinctions between technical nuances such as the difference between ECMAScript and JavaScript, JScript, etc. are provided in passing along with historical references that provides context as to how the language has evolved along with the web. |
Introduction to JavaScript Part 2 |
A continuation of the previous module that picks up on JavaScript’s object-oriented features with a specific focus on prototypal inheritance and a strong juxtaposition between prototypal inheritance and more traditionally used hierarchical inheritance from languages like C++ and Java. Built-in objects such as Object, Array, Math, Date, etc. are covered extensively and specific examples of using JavaScript’s dynamism to manipulate prototypal objects are presented. |
| DHTML Wrap Up |
This section rounds out the first block of core learning by tying HTML, CSS, and JavaScript fundamentals together in a unified way that is essential to the rest of the course. Using JavaScript to manipulate CSS style properties and manipulate the DOM is emphasized along with strong recommendations about how to debug and achieve an efficient development cycle with the help of Mozilla’s Firebug add-on. |
| Browser Hell |
This is a short section that rounds out the block with a strong admonition and motivation for not coding against the cold, hard metal of the web browser and instead choosing a JavaScript toolkit to make your life easier. A brief tour of the landscape of the many options available is presented and includes specific comparisons among features offered by several of the more prominent ones. |
| Dojo Toolkit Overview |
This section includes a fast-paced primer for getting Dojo up and running from source, a stable release, or from AOL’s Content Delivery Network. An overview of the toolkit’s overall architecture is followed by a discussion of how Dojo bootstraps itself into the page. The last half of the section includes material on Dojo’s most foundational standard library utilities in the tiny kernel of the library commonly referred to as Base that you’ll wish you’d known about a lot earlier in life. |
| Event Listeners and Pub/Sub Communication |
This section involves a discussion of two powerful communication techniques that may be used to manage the mayhem that is necessarily part of any reasonably complex web application: directly connecting event handlers to specific nodes and publish/subscribe mechanisms. Recommendations about when to use each of these constructs is given along with a thorough overview of the W3C standard on the Event object. |
| Ajax and Server Communication |
This section includes content on how to easily add asynchronous server communication into your application using the staple now known as Ajax. In addition to basic tasks such as making RESTful requests to the server with JSON and XML, this section also includes content on Deferreds, a powerful abstraction that significantly simplifies synchronous and asynchronous communication as well as other communication transports such as JSON with padding (JSONP), JSON-RPC, and security implications of using JSON. |
| CSS Selectors |
A thorough discussion of the various CSS selectors available and how to use them in your application to significantly simplify and lessen the overall footprint and complexity of your code. Specific examples are provided that make extensive of dojo.query, Dojo’s jQuery-like construct for looking up nodes by CSS selectors and using the dot-operator to chain together the method calls indefinitely. |
| Internationalization |
A short lesson on how to use Dojo’s extensive utilities for supporting an international audience by way of creating “string tables” formatting currency, numbers, and dates with little to no effort. Also, a demonstration of how to create your own module to support a language that is not yet part of the core implementation. |
| Drag-and-drop |
A nearly stand-alone lesson on using Dojo’s rich drag-and-drop abstractions. Learn the theory behind and application of making an object in the page draggable, constraining it within a specific space, creating custom avatars, turning a node into a specific kind of drop target, and more. |
| Animation and Effects |
A nearly stand-alone lesson on using Dojo’s rich machinery for animating content on the page. Add a wipe, slide, or fade with ease. Or, when the situation arises, animate arbitrary CSS properties. Coverage of chaining together animations and combining animations so that they run in parallel is also included. |
| Data Abstraction |
Writing brittle business logic to read and write data to/from the server has been a bane of even modern day web development. This lesson includes a strong overview of the dojo.data APIs for reading, writing, fetching by identity, and notifications. In particular the ItemFileReadStore and ItemFileWriteStore modules are exercised extensively and additional data modules from DojoX are covered as well. |
| Simulated Classes and Inheritance |
Although JavaScript isn’t Java and pure “classes” don’t exist in JavaScript, Dojo still provides an incredibly rich construct for simulating classes, which is especially helpful for situations in which modeling inheritance hierarchies makes decomposing the problem easier. This lesson digs into the nitty-gritty of this complex construct and provides a prelude to how the toolkit’s collection of widgets is built upon it. |
| Dijit Overview |
Dojo’s sophisticated set of form, layout, and general purpose application widgets (dijits) are known far and wide, and this lesson provides a foundational context for understanding the Dijit project. Special attention is given to the widget lifecycle as well as the ability to prototype dijits almost entirely in markup with minimal JavaScript through declarative syntax. You’ll also learn about the various themes (skins) that are available and how to create your own theme. |
| Form Widgets |
Of the three Dijit subprojects, the form widgets are by far the most interlaced and co-dependent. This lesson is all about taming the project into an understandable entity and learning how to use these out-of-the-box widgets to perform common tasks such as validating text boxes tying a combo box to a large data store, getting fancy buttons with little to no effort, etc. |
| Layout Widgets |
Although pure CSS is often the answer to achieving a custom layout, some patterns are too common not to wrap up into a reusable widget. This section digs into widgets such as stack containers, accordion container, border containers, and more. |
| Application Widgets |
Many widgets you’ll find yourself in need of don’t fit nicely into the form category nor are they intended for layout. This lesson is on all of those dijits that appear everywhere else such as tooltips, contextual menus, color palettes, and more. The impressive hierarchical Tree widget is given special attention as is the Editor. |
| The Grid Widget |
Of all the widgets on the web, none may be more in demand or potentially useful as a flexible data grid. This lesson is an in depth tutorial on using the data grid with a variety of back end data stores, how to use it against editable data sources, when to use which data store, and how to put this widget to work against live data sources |
| Specialized and Experimental Extensions |
DojoX is an absolute treasure trove of highly relevant subprojects. This lesson provides a comprehensive overview of what’s available in DojoX, how mature each of the subprojects are, and how they might save you time and effort in your web application. Subprojects of specific interest include dojox.storage, a mechanism for storing data that doesn’t involve cookies, the charting widgets, and the dojox.xmpp module for integration with Jabber. |
| 2D Drawing |
An extensive, nearly standalone tutorial on putting the dojox.gfx module to work to produce cross-browser implementations of 2D drawing that use whatever backend happens to be available, whether it be SVG, VML, canvas, Silverlight, or one that you write yourself. In addition to drawing with friendly API calls, you’ll also get a crash course in 3x3 matrix matrix operations -- the foundation upon which most of the dojox.gfx module is based |
| Comet |
This section provides a crash course in Comet -- a mechanism that’s commonly referred to as “reverse Ajax” or the way to “push” data from the browser. Learn about the Comet landscape, how to put comet to work in a hurry, what’s up and coming in the way of Comet-based projects, and the role Comet has played in shaping the HTML 5 specification. |
| Build Tools |
Dojo’s build tools are one of the most commonly overlooked entities in the toolkit, but can have the most significant impact on increasing your web app’s performance by consolidating and minifying scripts to dramatically reduce the overall latency incurred in multiple synchronous requests. This section is all about learning to get the most of out of these build tools to squeeze as much performance as possible out of your application. |
| Unit Testing |
This section includes material on writing and maintaining suites of unit tests for your web application--one of the most neglected aspects of a web app’s lifecycle. In addition to learning about writing good unit tests, you’ll also get exposure to Selenium, a powerful tool for automating interactive testing and more. |
| Production Considerations |
After your web application is built, tested, and ready to unleash, there are a number of considerations you’ll want to consider for production situations. This section rounds out the course by reviewing some of Steve Souders’ material on squeezing out the most performance possible from your web application as well as specific things you can do on the server side to gain performance for very little effort. |