Marcos Placona
Marcos Placona
Developer evangelist at Twilio, GDE and in ❤️ with Open Source
11 min read

Categories

  • books
_Book reviewer Marcos Placona Publisher: Packt. Author(s): Dan Wellman_

This is another of my reviews about a jQuery book. I keep getting more

and more excited at every new release, and the more I read about it,

the more I think this is really a great library.

As you might have noticed,

on the past few months I’ve been actively using jQuery on all of my

projects, and recently at work, we even replaced most of our <a href=”http://labs.adobe.com/technologies/spry/” mce_href=”http://labs.adobe.com/technologies/spry/” class=”broken_link”>Spry</a> stuff with jQuery. I think Spry is a great library, but jQuery is simply easier to use, and a lot lighter.

I aim here to give a brief, but well elaborated review of the book jQuery UI 1.6. I know the new version of the jQuery UI was released

just a few days ago (second week of March 2009), but there weren’t any

changes to syntax or the way you use the library, but a few new things

you can do, which I should be covering in the coming posts.

I **believe** a new version of the book should be released in

the next few months, but if you (like me) can’t wait to get your hands

“dirty” with all jQuery UI goodness, go on and get the book. I promise you will not regret.

The book splits up in 12 chapters packed with visual examples and code.

Every chapter talks about a widget present on the UI. The thing I like

the most about each chapter is when at the very beginning of it, the

author explains a very simple usage of the widget, and develops a more

complex example as the chapter rolls. It is a very nice concept, as if

you are a beginner, you will not frustrate yourself by having to read

and understand every single piece of the code to have a working

example. Everything is well commented and explained. The chapters are:

  • Introducing jQuery UI
  • Tabs
  • The Accordion Widget (click <a href=”http://www.packtpub.com/sites/default/files/jquery-ui-1-6-the-user-interface-library-for-jquery-sample-chapter-3-the-accordion-widget.pdf” mce_href=”http://www.packtpub.com/files/jquery-ui-1-6-the-user-interface-library-for-jquery-sample-chapter-3-the-accordion-widget.pdf” target=”_blank”>here</a> to preview)
  • The Dialog
  • Slider
  • Date Picker
  • Auto-Complete
  • Drag and Drop
  • Resizing
  • Selecting
  • Sorting
  • UI Effects

Chapter One is an introduction to jQuery UI and all of its

functionalities. It gives you links to library download, as well as

links to the example code on the book. It’s more of a broad intro than

anything else, and things start to get exciting on the next chapter. I

just think it is important to mention that chapter one gives a brief

introduction to Unit Testing, theming and explains the differences

between the minified version and the uncompressed version.

Moving on to Chapter Two, things start to “get hot”,

and the author describes the usage of tabs, and goes deeply on how to

style it, make configurations, programmatically control them and its

events, and how to use Ajax with it. I really like how the examples are

shown, and how the author uses multiple browsers on each of the

examples. jQuery is supposed to be cross-browser library, hence the

multi-browser examples. There’s a really cool example using Ajax Tabs

and the Flickr API.

Chapter Three talks about the structure of the Accordion Widget,

as well as styling, configurations and custom events. I won’t talk too

much about this chapter, as you can simply click <a href=”http://www.packtpub.com/sites/default/files/jquery-ui-1-6-the-user-interface-library-for-jquery-sample-chapter-3-the-accordion-widget.pdf” mce_href=”http://www.packtpub.com/files/jquery-ui-1-6-the-user-interface-library-for-jquery-sample-chapter-3-the-accordion-widget.pdf” target=”_blank”>here</a> and read the whole chapter located on the publisher’s website

Chapter Four and Five are the least interesting chapters in my

opinion. They are presented really well, and use the same concept as

the whole book, with all the examples and code samples. I just think

Dialog Boxes and Sliders are a bit useless in the current situation.

They are really application specific, and won’t be used on a day-to-day

basis. I cannot really recollect the last time I used a slider or a

dialog box. The book gives superb information regarding configuration

and theming on the two chapters though.

Now, to my favourite of all, Chapter Six. Date

pickers are just cool, and the jQuery UI date pickers are the coolest I

have ever seen. You can use them to control a whole logic on a system,

and have infinite options for configuration. The book gives a

systematic demonstration on how to configure the date picker, as well

as how to change its appearance, internationalization, alternative

animations and the use of Ajax. There’s a very cool example at the end

of the chapter that shows a mash up of most of the properties, using a

server side page to display already used days on the calendar.

I would say Chapter Seven really dispenses any

further comments. Auto-complete textfields are really cool and popular

at the Web 2.0 era. The author starts showing a very simple

implementation, and uses it to develop the example into a more complex

that uses server data. Everybody know how an auto-complete field works,

but there’s a few tricks used here to make it look cooler and more

interactive.

Onto Chapter Eight, draggables and droppables are the

subject. Most of us had a play with drag & drop one day. Some of us

simply used flash to do it. Others went further and used Java Script. I

don’t think there’s anyone who had fun doing that using simple java

script. It used to be all messy, and you’d have a whole folder with

*.js files. With the jQuery UI, it couldn’t be easier. The author

describes thoroughly all the configurations needed to drag stuff on the

screen, and then gives a complete explanation on how to create your

droppables, which are mainly where you want to allow your draggable

objects to be dropped. There is a very nice example at the end of the

chapter on how to create a little maze game using drag & drop. I

did it myself, and it didn’t take me more than 20 minutes to follow the

tutorial.

Again, Chapter Nine reminds me of Chapter Three and

Four. Resizables are interesting stuff, but you only have to use it, if

it’s really specified. The author shows how to resize areas on the

screen, but really, the most impressive is when an image is resized,

but the ratio is kept. This stuff is neat, and you can see that a lot

of thought has been put into it. In this chapter, a few of the other

chapters are re-used. The author resizes tab controls here, and you can

see how easily integrated this library can be.

Chapter Ten gives some very nice examples on how to select

objects on the screen. It works pretty much the same way you do on your

desktop, by selecting items on the screen and moving them around, or

into another folder. A very nice implementation of selection would be

the integration with Drag & Drop, so you could select your items,

and then move them around. A very cool example is given here using tabs

and selection. I love how the selectable methods are explained here.

Chapter Eleven is all about sorting, and on this chapter you can

see how easily the author can create real nice boxes with sortable

items with a minimum effort required. There’s some very useful

examples, and while reading this chapter I could almost see myself

using some of them for a few of my projects. There’s an area dedicated

to connected callbacks that gives a nice explanation on the six events

that can be used, and which occasions to use them. There’s a cool

example at the end of the chapter that shows you how to create a

customizable home page. Pretty much, like iGoogle, where you can really customize how the website presentation will be to your computer.

Going to the last chapter, Chapter Twelve shows an

exciting number of web effects that can be used to jQuery UI. This

chapter gives examples of usage on the following effects:

  • blind
  • bounce
  • clip
  • drop
  • explode
  • fold
  • highlight
  • pulsate
  • puff
  • scale
  • shake
  • slide
  • transfer

It shows examples of every single web effect described

above, and give a nice and easy explanation on why and how things

happen. It’s almost like a “How Things Work”, but for the web effects.

There’s some pretty neat stuff in there, and some other things I just

wouln’t be bothered to use.

One nice comment the author gives at the end of the chapter, is that

this book and all of it’s examples, do not aim to show only how to

use the library, but also how powerful and flexible the library can be.

I’d like to leave here my special thanks to the fine guys at <a href=”http://www.packtpub.com/” mce_href=”http://www.packtpub.com/” target=”_blank”>Packt</a> who sent me this book for evaluation and technical review