Quick Dojo Setup Snippet for MooTools Developers

By  on  

We're all used to aliasing methods within our favorite JavaScript frameworks. For example, you'll see the following pattern within jQuery:

(function($) {
	//your jQuery here, referenced by $
})(jQuery);

You may also see the following pattern within MooTools code:

(function($) {
	//your MooTools here, referenced by $
})(document.id);

Within the Dojo community I frequently see the following pattern:

;(function(d, $) {
	//your dojo here, selector engine referenced by $
})(dojo, dojo.query);

I love that pattern but I've created my own that I think will be a bit easier for MooTools developers looking to use Dojo:

;(function(d, $, $$) {
	//your dojo here
	//byId referenced by $
	//selector engine referenced by $$
})(dojo, dojo.byId, dojo.query);

While the $$ method is unique to MooTools, Dojo features both a byId method to get a single node and a query method to retrieve multiple nodes. You could just as easily retrieve one element with dojo.query but I like the security (and speed) that associating $ with byId gives me.

Recent Features

  • By
    Send Text Messages with PHP

    Kids these days, I tell ya.  All they care about is the technology.  The video games.  The bottled water.  Oh, and the texting, always the texting.  Back in my day, all we had was...OK, I had all of these things too.  But I still don't get...

  • By
    CSS Animations Between Media Queries

    CSS animations are right up there with sliced bread. CSS animations are efficient because they can be hardware accelerated, they require no JavaScript overhead, and they are composed of very little CSS code. Quite often we add CSS transforms to elements via CSS during...

Incredible Demos

Discussion

  1. Wonderful, Mr Walsh!

  2. CarlitoS

    Man, sorry to bother, but why did you change the layout of the Code? Now is almost illegible.

    (Sorry if I have bad English, I’m kinda rusty)

  3. @CarlitoS: Not sure what you mean.

  4. Joe

    What’s with the semicolon in the front of the last two code snippets?

  5. @Joe: It’s a built-in safety for if there’s no “;” on the previous line. Learned that from Dojo Lead Pete Higgins.

  6. CarlitoS

    What I meant was that earlier you used to have the code inbetween frames with gray backround. Now the code is over white background and the font color is like gray 35%. Also the size looks like 4 points, I wear glasses but still is hard to read it. Thanks!

  7. @CarlitoS: Ahhh, the comments in the syntax highlighter. I’ll address that soon.

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