Dojo Tutorials

By  on  

Over the last few months, I've written several Dojo Toolkit tutorials to help explain basic and intermediate Dojo concepts.  Here's a rundown of the tutorials that have been released thus far:

Classy JavaScript with dojo.declare

The dojo.declare method is the foundation of class creation within the Dojo Toolkit. dojo.declare allows for multiple inheritance to allow developers to create flexible code and avoid writing the same code routines. Dojo, Dijit, and Dojox modules all use dojo.declare; in this tutorial, you'll learn why you should too.

Dojo Charting

Presenting statistical data in a readable, eye-catching manner is important, but it can also be difficult. The dojox.chartingsystem was created to alleviate those pains by allowing developers to create dynamic, unique, and functional charts from varying sets of data. In addition, dojox.charting provides numerous themes and chart types to allow developers to display their data any way they'd like. This tutorial will show you how to create basic charts with varying data, plots, axes, and themes.

Advanced Charting with Dojo

While most developers only need basic charts, dojox.chartingis capable of highly advanced charts: charts with animations, charts that respond to changes in data, and charts that respond to events. In this tutorial, you will learn about using some these advanced capabilities within dojox.charting.

Dialogs & Tooltips

User interaction is extremely important in building responsive, interactive web applications. Web browsers provide basic methods for user interaction in the form of alerts and dialogs, but this functionality is not elegant or flexible. Dijit, the Dojo Toolkit's UI framework, provides cross-browser, extendable, and themeable answers to what the browser's basic functionality lack, in the form of dijit.Tooltipdijit.Dialog, anddijit.TooltipDialog. In this tutorial, you'll learn about each of these widgets, sample usages of each, and the ins and outs of creating them.

Dijit Editor

Dijit's Editor widget is everything a developer looks for in aWYSIWYG editor: flexible, themeable, and above all, functional. In this tutorial, you'll learn how to easily implement dijit.Editor (programatically and declaratively), customize its toolbars, and include Editor plugins from DojoX.

Ajax with Dojo

Ajax has become a fundamental technique for creating dynamic, usable web applications. In this tutorial, you'll learn about the Dojo Toolkit's Ajax communication methods, including basic XHR concepts, how to customize your Ajax calls, handling multiple types of data, and strategies for cross-domain JSON gathering (JSONP).

There are plenty more tutorials available, written by Dojo committers and contributors.  Expect more to come!

Recent Features

  • By
    Responsive Images: The Ultimate Guide

    Chances are that any Web designers using our Ghostlab browser testing app, which allows seamless testing across all devices simultaneously, will have worked with responsive design in some shape or form. And as today's websites and devices become ever more varied, a plethora of responsive images...

  • By
    CSS vs. JS Animation: Which is Faster?

    How is it possible that JavaScript-based animation has secretly always been as fast — or faster — than CSS transitions? And, how is it possible that Adobe and Google consistently release media-rich mobile sites that rival the performance of native apps? This article serves as a point-by-point...

Incredible Demos

  • By
    Flashy FAQs Using MooTools Sliders

    I often qualify a great website by one that pay attention to detail and makes all of the "little things" seem as though much time was spent on them. Let's face it -- FAQs are as boring as they come. That is, until you...

  • By
    Multiple Backgrounds with CSS

    Anyone that's been in the web development industry for 5+ years knows that there are certain features that we should have had several years ago. One of those features is the HTML5 placeholder; we used JavaScript shims for a decade before placeholder came...

Discussion

  1. Laurent

    Hi,
    I am new dojo user and I would like to have assistance on the page called “check-username.php” in the script “Check a Username’s Availability”.
    I imagine that an application checks for an answer in a database with the page “check-username.php” but what could be its structure?
    Thank you for your response.
    Regards

  2. idan

    hi same here what is “check-username.php” like ?
    I can’t reproduce it.

    thx

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!