An Intensive Exploration Of jQuery With Ben Nadel (Video Presentation)

Posted February 11, 2009 at 11:34 AM

Tags: Javascript / DHTML

The following video and slide show is my presentation: An Intensive Exploration Of jQuery With Ben Nadel. The presentation covers most aspects of the very robust feature-set provided by the jQuery library. While I cannot go too in-depth on any one particular topic, I do try to cover and thoroughly demonstrate what I feel are the most important parts of the jquery library. I hope that in this presentation I can at truly get across to you how essential the jQuery library is to optimal web development; I tell you this in all seriousness - I will never start another web development project without jQuery.

The following is a table of contents for the video, An Intensive Exploration Of jQuery With Ben Nadel:

1. Introduction
2. What Is jQuery
3. UI Effects - Pain Free Animation
4. Why I Didn't Like jQuery At First
5. jQuery For Developers
6. Anonymous Methods
7. $() Factory Method
8. Wrapping DOM Elements
9. jQuery Selectors
10. jQuery Selector Moment of Bliss
11. Working With The $() Collection
12. Attributes And Values
13. Moving Elements Around
14. Traversing The DOM
15. Filtering The jQuery Collection
16. Iterating Over The Stack
17. jQuery Closures - Awesome Voodoo Magic!
18. Eventing Binding And Triggering
19. Custom Event Types
20. jQuery AJAX
21. Monitoring AJAX Requests
22. jQuery Data() Method
23. Extending jQuery - Plugins And Selectors
24. jQuery Is Mad Awesome
25. jQuery Resources
26. Thank You For Listening

Post Comment  |  Ask Ben  |  Other Searches  |  Print Page

• Add To Del.icio.us
• Add To Digg
• Add to Spurl.net
• Add to Wists
• Add to Simpy
• Add to Newsvine
• Add to BlinkList
• Add to Furl
• Add to reddit
• Add to FARK
• Add to BlogMarks
• Add to Yahoo! My Web
• Add to smarking
• Add to Ma.gnolia
• Add to Segnalo

Reader Comments

Very well done. I've been in love with jQuery since I started looking into it.

I would have to say so far my favorite feature would be the ability to do this:

function show(i){
$('ul.li').eq(i).show().siblings().hide();
}

after I learned how to use it, the ".siblings()" function really rocked my world.

Great job Ben! Was hoping you'd post this. You have a great teaching style. Hope you do more of these in the future.

Great presentation, Ben. I'm only 10 minutes in, but am loving it already. I've done a litle jQuery development, and like you, was pretty "humbugged" out about it being "all UI."

Heresy!

Suffice to say, I'm getting comfortable and watching the rest :)

Yay! wOOt!

</cliff>

Good job Ben, I think it's indispensable to get the CF community more in touch with javascript. It's worth noting that most js frameworks are capable of the things you describe in your preso, and as such I always invite people to have a look at several frameworks (jQuery, Ext, Prototype, Dojo, Mootools, etc.) so they can see which one "feels" best for them (and sometimes see what plugins are available). They're fine choices (at least as far as the main ones go), it's usually down to preference.

@Thomas,

During the live presentation, someone asked, "Why do you think jQuery has become so popular with ColdFusion developers." I basically said that, well one, its becoming popular everywhere, so we're just part of that revolution. But two, when you try jQuery, there's something that just feels "right" about it. Even if you've tried other Javascript libraries, jQuery feels more natural for some reason. I can't even put my finger on it, it just does.

@Ben,

You're kinda making my point there. hehehe What feels right/more natural to some feels wrong/awkward to others. I personally don't like jQuery as much. I like Prototype and Ext better. And so nobody can say I'm set in my ways, I started with Prototype, then tried jQuery and didn't like it as much so stayed with Prototype. I later tried Ext and liked it, so now that's what I use. Some of my friends also didn't really like jQuery for whatever reason. That's why I say try them all out. As far as the basic features, it's pretty quick to give them a spin and see what feels right/better. Having said that, I don't want anybody to take this as a knock on jQuery. It's an excellent framework.

@Thomas,

At the end of the day, you gotta go with what feels best for you, cause at the end of the day, you need to get your work done as efficiently as possible.

Just as a point .. you were referring to 1000 seconds with the delay/speed for the effects.. while it says 1000 it's milliseconds, thus 1000 = 1 second.. but i'm assuming you already know this :)

@BinaryKitten,

Ahh, yes, thanks. That's the nerves talking :)

None of your scripts work in my Netscape 4! What are you trying to pull?

What software did you use to make the presentation?

Did you post it somewhere else? Maybe UGTV?

@Mike Leung

re: Netscape 4.... urmm ... http://browser.netscape.com/ they stopped support and production of the netscape browser completely in march 2008.

@Mike,

If it makes you feel any better, it doesn't work in my Hyper Text Player either :)

@Henry,

I used Camtasia.

Thanks Ben for posting this online. Great presentation

Great presentation, Ben! It seems like so long ago that we first discovered jQuery. And the engineering under the hood has only improved since then!

If you haven't already, you might want to take a look at Slideshare (http://www.slideshare.net). I see it used for slides in presentations by front-end developers at Yahoo, Google, and Mozilla - including jQuery's John Resig.

@David,

Thanks for the kind words. I love jQuery and I don't mind trying to get others to love it to :)

I like in Slide 4 when you say "Someone" showed you jQuery and you thought it was lame. I don't know who did that, but they were definitely lame! Morons like that probably showed you CSS too and you thought that was lame at first too. Probably showed you Flex before it was popular! Those kinds of people irk me to no end.

Man, if I could get my hands on THAT guy, I would teach him a thing or two. Give him whatfore!

By the way, the next thing you don't like yet, but you will is ExtJS. It's for business applications.

@Ben

I agree that you have to use what you are comfortable with, but at the same time you do need to at least try to get comfortable with what a majority of the community is using. The only reason that I say that is because there are times when you will leave a project and others will have to come in behind you. If you are using some obscure library (not to say that jQuery, prototype or mootools are) you have created a bigger issue than there needed to be.

@Glen,

When I talked about my initial response, I said it was a "fear response," not a legitimate one :) jQuery is awesome, and yes, your advice is always much appreciated.

@Brandon,

That is a good point. If you are jumping in and out of projects, having the same library understanding creates a common language and methodology.

Awesome! The best jQuery Video Tutorial of the Web!

@Fernando,

Rock on! Thanks a lot.

Ben,

I started watching the presentation last night and then finished it the first thing this morning. Great job! I'm a newbie to jquery and even to java script. Of course I jumped into it with the jqGrid plugin and I've managed to create a subgrid in a grid without really understanding what the code was doing. Your presentation help bring some light where there was only darkness. Like most folks I don't get to start at the edge of the pool, but get thrown right into the middle of the deep end. You've given me a life preserver so at least I'm keeping my head above the murky water.

Thanks again, Jim

Holy s-word Ben.

That was maybe the most effective, comprehensive, well-architected presentation I've ever even seen. You literally took people foreign to jQuery from beginner to intermediate knowledge in under 2 hours, with a primer on plug ins and a pretty good overview of the voodoo of closures!

So impressive. Thanks a million, on behalf of the world.

Also, it wouldn't hurt to post a link where folks can donate to "The Ben Nadel Educational Fund" to cover the cost of your Camtasia license and all of the extra bandwidth you're going to need when you start doing video blogs 24/7 instead of textual, hint.

Also, since Camtasia lets you do record a sub-selection of your screen it doesn't hurt to position your IDE/slideshow/browser chromelessly around a 640x480 portion of the screen to cut down the filesize dramatically. That resolution is usually enough for good code visibility and audio isn't affected obv. I noticed your blow was down for a while last night, I'm assuming because of 8 million people watching that video at the same time.

Blog. That was the most ridiculous typo probably in history (judged by the distance between the intended letter (g) and the typed letter (w). That'll teach me to try to author comments while conversing on a telephone.

@Jim, @David,

Thank you guys so much for the kind words. That really means a whole lot to me! Really, you have no idea.

@David,

I will play around with the 800x600 next time. I thought about going that way, but it just seemed so small. The size I did was actually a sub-section of my screen (I have a huge monitor). But, the live presentation was done on an 800x600 and it went find. Good feedback.

Thanks for the great video!
Cheers,

Amazing tutorial, I love jQuery, but there is alot of boring stuff about it out there. This tutorial really makes me realize how strong it actually is. Thanks so much!

WOW! Great presentation! As a professional educator, may I say you have a rare gift. There are a lot of people in the world who understand a subject well, but have little talent when it comes to communication that knowledge. You obviously have both. Even though I had only a modest knowledge of programing in general and none of jQuery, I found your presentation both understandable and engaging. The only thing I would change (if indeed your authorware has this option) would be to include a pause button so viewers could stop and digest the information every so often (your explanation of closures was great, but afterward I needed a break, so some kind of mental-Tums!). Thank you.

Great job Ben!

I've been using JQuery for awhile now. I started with prototype and quickly switched to JQuery.

While I'm not a big fan of Microsoft, I was pleased to hear that Microsoft announced plans (Sept. 2008) to incorporate it into their Visual Studio toolset which does provide JQuery some weight as far standards go.

http://www.eweek.com/c/a/Application-Development/Microsoft-Adopts-OpenSource-jQuery-JavaScript-Library/

Hi Ben - Brilliant presentation from what I have seen so far - any chance of making it available as a download? The length creates problems for me watching on line in one go. Cheers, Bruce

@Fred,

Thank you so much for the kind words. Coming from an actual teacher, what you say has serious weight and is very meaningful to me.

@Bruce,

I can look into figuring that out.

Ben - I'll second the request for an 'offline' copy of this.

All the best

</cliff>

Superb video Ben, your presentation style is very clear and easy to follow. Seems you're a natural?

I've already got an off-line version by the way - looked in my browser cache (I use Opera) found a huge file (134Mb), changed the extension to .flv - plays back in any media player that includes FLV playback!

Hope you don't mind?

<goes scurrying to look in his cache... B->>

@RPR,

No problem my man. At the end of the day, I'm just trying to add value to your work life :)

OK - so I've been trying to capture a copy using both Firefox and Opera on a work PC running Vista which I'm not familiar with. Can anyone tell me where the cache for Opera or Firefox could be on this machine?
cheers
Bruce

offline version pls

Fanstastic presentation sir...

you should have put your work-out credentials on the screen also :-).

Any luck making an offline version available?

This is by far the best video presentation on JQuery I have seen on the internet; and I have searched far and wide, high and low.

@LBJ,

Thank you very much! That is a great compliment.

Super Good Lessons. Thanks for your time and effort!

@Geoffrey,

Thank man, glad to know its appreciated.

Hi Ben me again. Just watched this for the third time (I have a copy on local). There's a lot to take in (nearly 2 hours) but each viewing makes things clearer.

Was wondering if your presentation material (html/cfm) is available anywhere? The code examples (demos) you show would be good to study in more detail?

It looks as though you've done these materials on some fancy server-side thing, so maybe it's not straight-forward for you to just zip-up and offer as a download?

Sorry Ben, ignore my last (stupid) comment. Yes, there's a link at the top!!

Very impressive, thanks a lot for this fantastic work.

@Axel,

Glad you liked it!

Amazing.

Really opened my eyes to the power of jQuery, and demonstrated the possibilities excellently with good clear easy to understand English.

Thank you Ben.

@Trevor,

Glad you liked it. jQuery is really awesome. I seriously never start a web application project without it! It's as essential as the keyboard in front of me.

I personally use only plain javascript when short scripts are required, but when it get too tedious to write it "pure js" then I use JQuery - fantastic for animations and ajax calls.
Very nice site you have done, have you done all the design by yourself? I'm impressed (wish I had the photoshop skills you have).

@Marko,

Nothing wrong with some plain old Javascript :) Of course, when you include jQuery in every site, the need for it becomes less. Although, even in the callback methods, I still find myself using the THIS object rather than wrapping it in $() every time... depends on what I need to do.

Great video. Added this to http://TUTlist.com

Thanks Ben for doing and sharing this. I am in love with jQuery, it's bad my boyfriend is a jealous type :)

@Anna,

No worries - it just forces him to up the effort to compete ;)

awesome!!

Thanks, nice stuff.

Need I say WOW!

It looks really amazing so far.... I'm trying it out now as we speak... (Fingers Crossed) Also how do you get Adobe ColdFusion Certified? Is it worth it? How much does it cost?

@Jody,

I think the test was like $150 or something. You just have to sign up to take it at a testing center. I can't remember where I found the list of testing locations (they are not Adobe specific - just general testing centers that host it). I think it was worth it because it really got me to look into things I had not previously explored.

Amazing work Ben. Best tutorial i've every watched, took a while to get through but it covered so much. Thanks for sharing your knowledge. Praise be to jQuery!!

Thank you for this! You definitely helped build my knowledge of jQuery (I've only been using it for about a week now); especially to do with the closure stuff you mentioned.

Awesome presentation!!! I've used jQuery before and I loved it right away. But I never got the chance to learn all the possibilities of it. Thanks for the Video and the inspiration.

greez, Timo

PS: I blogged an article about your presentation on my website.

@Timo,

Really glad you liked it!

nice presentation! Is there a way to download this video?

Ben... this is by far the most educational and easy-to-watch jQuery video/tutorial/introduction I've come across. I'm a designer who started to learn dev by necessity a few years ago, and began working in JS just recently, and jQuery very shortly thereafter.

I was already amazed by jQuery's ability to make working in JS faster and easier, just as it's said to be, but your video has really opened my eyes.

Thank you! Not only that, but I plan to spend a lot more time learning new tricks as I continue to scan thru your blog. Thanks Ben, your obvious enthusiasm and excitement for your field not only shows, but is contagious as well. Kudos!

Cheers,
Lelando

@Lelando,

Wow, that's awesome! It's great to hear the perspective from a designer and know that it's making sense. Trust me, the more you play with jQuery, the more you're going to love it.

Excellent presentation. Very laconic and informative. Thanks

Hey I guess the video is down. Is there anyway you can upload to youtube or vimeo or some other service? Greatly appreciated.

Post Comment  |  Ask Ben

Post A Comment

Comment Etiquette: Please do not post spam. Please keep the comments on-topic. Please do not post unrelated questions or large chunks of code. And, above all, please be nice to each other - we're trying to have a good conversation here.

Please review the following issues:

Author Name:
Author Email:
Author Website:
Comment:	Formatting: <strong>bold</strong> <em>italic<em>
	Remember my information
	Subscribe to entry *
	Send me a copy of this comment (as part of the comment thread)

 

* If you subscribe, any new posts to this thread will be sent to your email address.