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
    Being a Dev Dad

    I get asked loads of questions every day but I'm always surprised that they're rarely questions about code or even tech -- many of the questions I get are more about non-dev stuff like what my office is like, what software I use, and oftentimes...

  • By
    Animated 3D Flipping Menu with CSS

    CSS animations aren't just for basic fades or sliding elements anymore -- CSS animations are capable of much more.  I've showed you how you can create an exploding logo (applied with JavaScript, but all animation is CSS), an animated Photo Stack, a sweet...

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!