MooTools 1.2 Beginner's Guide - Review

Monday, November 08 2010

15 minute read

MooTools 1.2 Beginner's Guide, authored by Jacob Gube (of Six Revisions) and Garrick Cheung (a MooTools Community team member with an impressive work resume) and published by Packt Publishing on December 2009, is a book aimed at, as the title suggests, new comers to the MooTools library. The book aims to provide a solid foundation for MooTools new comers, and assumes a limited knowledge of Javascript, HTML, and CSS. This book aims at not just at providing a laundry list of MooTool function definitions, but at providing a complete coverage of how MooTools geared towards a beginner.

Overall Assessment: 5/5

This book rocks. This is a superb book and excellent resource not just to learn MooTools, but the authors also succeed in installing some pretty important general programming concepts. The authors far exceeded my expectations for this title, and although I have been using MooTools fairly regularly for almost two years, I too picked up a few things. This is truly a great foundational type of book, not just for MooTools but for web development in general. This book, I believe, has done something I feel is very much needed for MooTools to really take off even more than it has - it has made the framework very approachable and attractive to people not just trying to decide what JS framework to use, but also to those people who aren't even sure what a framework is.

Writing Style

The overall writing style was fluid and lucid, along with some actual good humor intermixed. Though geared at beginners, the tone was never condescending; not once did I feel like the author was 'talking down' to the reader. It truly is an easy to follow book that even a novice in Javascript could follow with ease. The book is chock full of code samples, all explained line by line, and there are often many screenshots that accompany code to show what exactly the code is doing. As far as errors go, I came across no writing errors, kudos to the reviewer / editor, and only one minor code error.

Required knowledge

The authors state that some basic JS / HTML / CSS knowledge is assumed, but they do an excellent job on not relying on that assumed knowledge; all concepts are thoroughly explained and I feel that anyone who is interested would be able to pick up and follow the book, even with little to nill CSS / HTML experience.
The book advertises an emphasis on 'doing' and less of a focus on theory - something that the authors deliver, providing extensively detailed comments, explanations, and screenshots for pretty much every topic discussed. I believe the authors successfully walked the line of theory / application, providing just enough theory to explain most topics but not enough to bog a beginner down. And the code samples / exercises are fantastic. Early on, the Fx class is introduced and I feel as if it would really hook readers into the book - I certainly appreciated it.
I've had a difficult time finding great books (not just MooTools, but most subjects) aimed at beginners - too many books assume knowledge that beginners might not have, other books dumb down the content too much that it's hard to pull anything useful from it. This book is one of those rare cases where everything just fits. I feel that if I were a beginner to MooTools again, this book would have been perfect and would have saved me months of figuring things out by myself. With my current knowledge level, it was at the least a very great refresher and I learned quite a few things from it; a great way to fill in any gaps of knowledge I may have had from teaching myself.

Coverage of MooTools and Programming Concepts

I'll repeat myself here and say how impressed I was how the authors don't just teach MooTools, they also teach good programming habits. The easy route to take would have been just to describe how MooTools work, but this book does not stop there. Early on, the authors focus heavily on Javascript obfuscation; decoupling JavaScript embedded in HTML elements. Higher level programming concepts are just not explained, but reinforced throughout the book – be it through the clean code examples, mentioning it multiple times, or including it in ‘tip boxes’ (such as why using single quotes instead of double quotes is typically preferred).
Object Oriented Programming is explained very well. AJAX, while MooTools implements it, is also given thorough coverage. All these 'extra' concepts that aren't strictly MooTools are handled beautifully; the authors clearly know what they were doing when writing this book.
As mentioned earlier, it's often hard to find a beginner book for a topic that doesn't require tons of knowledge of other topics. With this book, however, someone who is not just a MooTools novice, but also a novice to web development and has maybe only heard of MooTools could pick this book up and get an excellent overview of the entire Javascript / HTML / CSS / Landscape.

Book Structure

The book is divided into chapters which each cover a particular area. Each chapter is broken down in a general structure similar to
  • Theory
  • Examples (Time for Action)
  • Example explanation (What just happened)
  • Occasionally a self test or pop quiz
  • Repeat

I was very pleased how the authors broke down each chapter. The theory sections explain what is going on behind the scenes (but not too complex), and then immediately examples are given which can easily be followed along with.
The code examples are thoroughly discussed line by line, I never felt as if anything was ambiguous or unexplained. After the example code, a section describing what happened (from more of a general point of view often) is given, wrapping up the example and ensuring nothing is left unexplained.
The occasional self test or pop quiz help to reinforce that the reader understood what happened, and the tests and quizzes are very simple – they usually just involve changing a function call or recalling some information discussed previously.
I do have a major gripe here though, and it’s that the pop quizzes provide answers immediately by bolding the correct answer. By providing the answer within the question, it doesn’t give the reader any time to arrive at the correct answer themselves, as they already know it; even if they try to suppress the fact they know the right answer, the satisfaction of figuring it out is taken away to some extent. There are not many pop quizzes, and because of the way the rest of the book is written, I can’t justify not giving the overall book a 5 star rating. This is a minor issue, albeit fairly important since the book’s audience is beginners, and I think books like this would benefit from having the answers provided after the questions are asked, and not immediately visible when asked.
Many chapters also have multiple theory / code examples, but the general structure of theory -> code / line by line analysis -> post code breakdown is followed pretty consistently by the authors throughout the book.

Content Format

Code is cleared typefaced, and relevant lines of code that are to be discussed are bolded. I do have a minor gripe that there are a couple of places where the code does not properly line up, but those cases are few and far between.
New terms and important words that appear in non-code text are also bolded. There are also “Notes” and “Tips / Tricks” boxes which appear as boxes outside of text, used to direct attention to things related to the topics being discussed.

Chapter Analysis

Chapter 1- MooTools and Me

This chapter covered what MooTools is and why it’s such a great framework, setting up MooTools on the reader’s system, and diving into a bit of code.
The introductory paragraph provides a great overview of the current web landscape and JavaScript’s place in it. MooTools is described convincingly and I like how within the first two pages already code is being provided.
The term ‘AJAX’ is tossed around frequently, but justifiably so. I appreciate the emphasis on it and the code that samples how MooTools makes creating a request much easier. The DOM (Document Object Model) is mentioned, but there exists no description for it, which might confuse complete newcomers.
The authors go from providing a step by step guide to settings up MooTools to immediately jumping into some code. I like this approach.
The descriptions of MooTools Core and MooTools More are handled well and at the perfect time. Figuring out this distinction took me a while when I first jumped into MooTools. The authors do a great job of explaining not just why MooTools is modular, but also what the whole concept of modularity implies and why it is important not to just bundle everything in one big honking file - something that is not necessarily common knowledge among beginning coders (at least it wasn't for me). This is an example of how the authors do a fantastic job at interweaving essential programming habits and concepts into a book whose goal isn’t to teach these concepts, but whose goal is to teach MooTools – and they do a great job at teaching both.
The following description of what an API is impressed me even more. I love how this book really breaks down all these universal coding concepts and makes them easily approachable to a novice getting into MooTools.

Chapter 2 – Writing Javascript with MooTools

Chapter 2 provided a great introduction to some general theory, discussed the concept of unobtrusive javascript, classes / OOP , chainability in MooTools, and the Fx class.
It begins with a great explanation of why MooTools should be used and the problems it addresses - namely, helping you write better JavaScript code. Then the authors discuss unobtrusive JavaScript (removing JavaScript functionality from your actual content) using an example of calls to a function that then call alert() once clicked, embedded in anchor (a) elements. I very much like this example and the way it is explained. The steps taken to show how to add an eventListener are excellent. Every line of code that changes is described along with an explanation. The authors hold the reader's hand through the example, but not in a condescending way or a way that dumbs down the text; I think a complete MooTools beginner would have no time at all grasping the concepts and implementation.
The discussion on unobtrusive javascript is excellent, I am very pleased that they introduced the concept so early on. It not only teaches people how to use MooTools, but good programming habits, which is just equally (if not more) important. Another concept they discuss is DRY (Don't Repeat Yourself), they do a good job and make it clear what exactly it is and why it's good practice.
A large part of this chapter was dedicated to Object Oriented Programming. Overall, very great section. However, the introduction and explanation of what a class is was, I felt, a bit a bit lacking. Perhaps a brief description of what OOP is and how it differs from functional programming would have been a goot fit here. I won't complain too much about it though, since a full course on OOP is outside the scope of the book; however, it would have been nice for a bit more thorough definitions.
The authors used an example of a Dog class to walk through the OOP principals. It was handled gracefully and I think it would have communicated to a complete beginner what OOP is. Defining classes, setting attributes and methods, inheritance, and object instantiation were all covered well and the example code was a great way to demonstrate the concepts - the code worked flawlessly and produced the expected output.
MooTools makes it very easy to do object oriented programming. While I feel there's room for improvement on how the authors introduced the concepts of OOP, the way they explain OOP in MooTools leaves nothing to be desired. They thoroughly but concisely explain how to set up classes, methods, what the initialize function is doing, etc, etc. With the level of MooTools knowledge I have (I'm not a developer of MooTools or anything, so there is definitely a lot I need to learn), I felt like they covered how OOP in MooTools worked in a way that was extremely accessible to a beginner without, leaving anything important out.

Chapter 3 - Discussing DOM Elements

This chapter covered the concept of the DOM and focused largely on the $() and $$() selectors.
It began with a introduction to what the DOM is. The description of the DOM is brief, but thorough. The authors provided a short refresher on CSS, which was nice. The CSS code the authors write is very clean and done properly. The advantage of using MooTool's built in selection method is made very clear and I am pleased with how well it is described - not only can you easily selects elements like you could via CSS, but MooTools also supports already supports CSS3 selectors. This seems in itself a great reason to use the framework for anyone who makes websites, especially web designers.
Coverage of both $ and $$ are excellent, along with the tip to use $ over $$ for performance. The authors also discuss why it is a better habit to use single quotes instead of double quotes, as you won't have to worry about escaping quotes as much.
With MooTools, you pass in only the ID of an element to $(), but you pass in a CSS selector to $$(). This distinction can be confusing at first, but the authors makes the difference clear and thoroughly explain it.
Psuedo-selectors are also discussed. The pseudo-selector ability is very very handy, and I wasn't aware of the full power of it. It is explained well and the example of Zebra striping a table is clear and easy to follow. The single to turn all even elements a certain background color is definitely an impressive demo and I think it does a good job at captivating interest (although I was aware of this ability, it is nice to see how eloquent it is, just a single line).

Chapter 4 - The Core's Useful Utility Functions

This chapter covered the MooTools Core, first focusing on browser detection, then covering other useful functions such as $time().
There is a heavy emphasis on browser detection early on. The authors do a fantastic job at explaining how powerful MooTool's built in Browser system is. The three components, Browser.Feature, Browser.Engine, and Browser.Platform are outlined in the beginning, given a brief description, and then examples are provided showing how to use each component. They mention xPath, but I would have like more discussion of why it is relevant and what significance it has.
The example for for determining rendering info is great. The authors also describe Browser.plugin - I was unaware of Browser.plugin to detect for flash presence, very nifty.
$time and $clear
The example using $time was incredible. It clearly explained another important feature not just about MooTools, but about development in general - testing how long something takes to run. The example to introduce it was timing how long between an alert being called and the user closing it. I think this is one of the best ways to introduce the concept of timing processes, and it gives the user direct control over the start / end time, and lets them play around with it and see how that is an analogy to how long a process would take to do something.
$clear and $periodical were also great sections, and were explained well through another CSS example of moving a box.
The $extend() example is nice and reinforces the OOP concepts in a clear beginner friendly way
$each: The author show why $each is an excellent way to save time instead of writing for loops. However, it was a bit unclear about the arguments - the action section cleared it up though. The authors did a good job explaining and show how it could save time through the code example.
The core utility functions are described nicely. The subtle difference between $chk and $defined are thoroughly explained and clear. The explanation of how $try worked and how it is used was excellent. The other utility function explanations were brief, but it was clear how they could be used.
Excellent chapter, overall. The MooTools core provides functionality that many Javascript developers use on a daily basis, and as the MooTools core is, well, the core of MooTools, a book talking about it needs to be thorough. I felt that the authors did a superb job here and left nothing out.

Chapter 5 - Working With Events

Chapter 5 covered events and how MooTools handles them; specifically - defining events, how to add event listeners, how to create custom events and extent MooTool's event object, how to remove and fire off events, investigate MooTools events methods and properties
Events were always a pain for me, MooTools handles them beautifully, so I had high expectations from this chapter from the start, and it lived up to my expectations.

What are events
The authors cover the idea of events. The introductory section is good, it doesn't bog down the user with details. In MooTools, when specifying an event (for example, 'click'), the 'on' is removed (the W3C specification is 'onClick'). The authors state you must do this, but I would have liked more of an explanation of why MooTools chose to do this.
The authors divide events into five groups - window events, form events, keyboard events, mouse events, MooTools custom events. This is an excellent grouping and makes it easier to grab a hold of the concepts.
Window events are described as events that occur in background. There is a GREAT comparison of HTML event attribute / MooTools event names and descriptions that clear any confusion. MooTools custom mouse events are covered; mouseenter is very helpful does not fire for children elements. mouseleave is also very beneficial.
Event listeners are briefly described and a great example follows. The emphasis on code samples is good, and the example of highlighting the current form element is excellent. Attaching CSS classes is a common thing, and another very good example demonstrating its use is provided.

Creating custom events
I was very pleased with this section. They walk through the process of creating your own events via an example of detecting caps lock.
My only complaint with this section was that the syntax of condition == 0 ? 1 : 0 could be explained more, as it might confuse beginners.
This chapter was great, however, it was the only chapter that I found a code error. On page 137, the authors are describing the stopPropagation() method and say to add a line of code above a previous line, but the line of code to add is never given; the actual use of stopPropgation() is not exemplified. I don't count this too much against the authors though, because the code example that preceded it was very clear and it would be very easy for a beginner to simply call the function because it is described so well.

Chapter 6 - Brining Web Pages to Life with Animation

This chapter covered animation through the Fx class. It follows the same structure as the previous chapters and all the examples and descriptions were great. The previous chapters used the Fx class and methods such as tween(), and provided a good introduction, in a sense, to this one. The function calls should be a bit familiar to the reader already, but a great introduction is provided.
The chapter provides excellent examples of using tween(), fade(), and morph(). I really have nothing but positive feedback to give for this chapter.

Chapter 7 - Going 2.0 with AJAX

Chapter 7 discusses MooTool's Request class, how to create Request objects, how to get and send data to servers, and what HTTP are and how to work with them. Overall, I really enjoyed this chapter. The discussion on AJAX could have been a bit more thorough, but was sufficient to get the ideas across. The coverage of MooTool's Request class was excellent. I was unaware how easily MooTools allows you to handle HTTP headers; something covered real well.
JSON was introduced and covered as well; not just how to use JSON, but what JSON is. Again I was impressed how the authors cover topics that would appear at first to be outside the scope of MooTools, but they do a wonderful job making everything accessible to beginners. One of the examples the authors use is how to load an HTML document into an element; again, well written. AJAX is a pretty big buzz word, and the authors do a great job at explaining what it is and how MooTools makes it much easier to use.

Chapter 8 - Beefing Up MooTools:Using the Mootoools More Plugins

Chapter 8 covers MooTools More, using Fx.Accordian, OverText, and Drag plugins.
I don't have much to say about this chapter. It really delivers on covering the plugins it sets out cover. I think the authors selected the plugins to cover well. Covering more plugins probably would probably just have watered down the book, or made it unnecessarily longer. The three plugins were different enough and covered well enough that the reader should have no problem using any of the other plugins. Using and setting options for the plugins was covered very well.
The authors mention to use good markup so the page degrades nicely when Javascript is disabled. They do more than just mention it, as all their code is very nicely marked up and clean. They also include a useful note on accessibility in the Drag / Drop example. I was very impressed, again, with the Drag / Drop example. They not only demonstrated how to use it, but how to make a simple web game using it. Overall, excellent chapter.

Chapter 9 - Creating Your Own Plugins

Chapter 9 covered how to make your own plugins, designing a design sheet / document, creating a script and then extending it to a plugin, and writing good documentation for it.
I was blown away by this chapter. It was the perfect way to end the book, and provided so much useful information that I would buy the book for this chapter alone.
The design sheet section was superb. It described why and how to create a document that provided a general overview of your plugin, including what its purpose is and how it is used. This is not useful for only plugins, but for anything you develop. This chapter really reinforced not just how to use MooTools, but how to be a good developer.
It then discussed how to actually code the plugin. I loved this part. To first create the plugin, it broke it down into an actual use case - get something working, then extend it. In this case, the plugin was designed to add comments to pictures automatically based on alt tags. First the authors wrote a function to do it, then extended it by considering how it could be used; what options would be necessary to provide for configuration, how to make sure it doesn't interfere with other elements on the page, etc.
Lastly it talked about documentation, something extremely important that I feel not a lot of beginner books cover well enough. The authors describe not only how to and why documentation is important, but how to follow documentation standards already in place so others can more easily follow it. I have nothing but praise here, the authors do a fantastic job and it's a shame other beginner books aren't written this way.


I think this book is excellent. It is perfect for a beginner not only to MooTools, but a beginner to programming in general. It goes far beyond it's initial goal of making MooTools accessible to beginners; it also teaches good programming fundamentals and concepts. Not only is it good for beginning programmers, it's also excellent for skilled programmers new to to MooTools. While it does provide a good foundation for beginner programmers, it does so in such a way that it doesn't take away from actually teaching MooTools.

Even people with a good deal of experience using MooTools will take away a lot from this book. I picked up more than just a few tricks and it helped solidify my knowledge of MooTools. The code samples were superb and (apart from one minor error described above) flawless. I cannot recommend this book enough. There are few books aimed at beginners I have come across that surpass this one, and it definitely ranks up there as one of my favorite books.

My only real complaint is that is did not come out sooner when I was teaching myself MooTools, as it would have saved me a great deal of time and I would have made far less errors. However, it has just been published in December of 2009 so everything discussed is extremely relevant and new. If you want to use MooTools, if you're just getting into Javascript programming, if you want to solidify your MooTools knowledge, if you are considering any Javascript framework, you need to get this book. I cannot a better MooTools book or a better place to learn it.

Excellent work, kudos and thank you to Jacob Gube, Garrick Cheung, and Packt Publishing for delivering such an outstanding book.


blog comments powered by Disqus