Dustin Diaz » Screencasts

Screencast 05: Build your own Ajax Contact form in less than 15 minutes

polvero@gmail.com (Dustin Diaz) — Wed, 28 Feb 2007 07:39:38 +0000

Today I felt the “mini” effect as the result of a second-hand digging from a website called miniajax (I thought about this intro sentence for all of about two minutes). Today that website was dugg. There is a link directly at the top of that page linking to my Ajax Contact Form I wrote near a year and a half ago of July ‘05. I thought to myself… “wow, that darn thing is still kickin.’” Then it occurred to me, that it would probably be a good idea just to show people how to make their own ajax contact form… surely it would only take about 15 minutes.

A challenge unto myself was born. Hence, this screencast. Now let me give you some facts straight up before you watch this. The form built in the video is not spam proof. The goal was to finish something quick and dry (and dirty) in less than 15 minutes. I also played a few sound tracks in the background just so I have a good idea of how much time I had left (probably only entertaining myself).

Nevertheless, a fully functioning, ajax driven, email form was built. Cheers. Hope you enjoy the ‘cast :)

Download the Quicktime Version (18 MB | 13 minutes 21 seconds)

If you cannot see the video below: get the DivX Web Player (available for both Win & Mac)

Screencast 04: Beer, music, Textmate, and YUI

polvero@gmail.com (Dustin Diaz) — Sat, 24 Feb 2007 22:06:41 +0000

In the fourth installment of the screencast series, I demonstrate how to do a very simple tree toggle with JavaScript, CSS, and HTML. However, I don’t feel that this was the point of this particular screencast, since there are, perhaps, already a bajillion tree togglers out there already. This one instead, focuses on how I get stuff done.

There are times when you just want to see how somebody works on a daily basis. You know, just to peak over someone’s shoulder without them knowing you’re there. I picked a simple task (such as the tree toggler) and put myself in an environment that I am most comfortable in (beer, music, textmate, and YUI). And voila! This short movie was put together without me talking this time, but hopefully you will enjoy the music. Cheers!

Download the Quicktime Version (18 MB | 14 minutes 34 seconds)

If you cannot see the video below: get the DivX Web Player (available for both Win & Mac)

Screencast 03: Developing an Object Oriented Web Service

polvero@gmail.com (Dustin Diaz) — Sat, 16 Sep 2006 23:49:06 +0000

In the third installment of the screecasts here at WSwI I’m glad to produce a whopping 45 minute episode which will teach you a good approach to developing JavaScript A.P.I.’s using Object Oriented methodologies as well as an all around practical usage of Yahoo! User Interface utilities; most notably the Connection Manager and Custom Event.

For this particular screencast I had decided to publish the the code in its fullness so that you may play around with it yourself to get a better understanding of it all. See Yahoo Services Demo. One exception you might notice in the demo code (that is different from the screencast) is that I’ve added one extra bit to prove a point of having an onWebServiceSucess. Eg:

onWebServiceSuccess in action

YAHOO.elseWhere = function() {
	var f = new YAHOO.WebService;
	f.onWebServiceSuccess.subscribe(
		function() {
			console.log("i'm just here for the ride");
			// excellent place to log your ajax stats
		}
	);
}();

You’ll see the beauty in the fact that YAHOO.elseWhere didn’t have to know what anyone else was doing with the web service - and all he/she needs to do is set up the Base WebService object and subscribe to the onWebServiceSucess method. Also, FYI for the accompanying code - you may actually experience a few onFailure’s coming back due to the fact that my server is being hit pretty hard at the moment. Otherwise, Enjoy!

Download the Quicktime Version (53 MB)

If you cannot see the video below: get the DivX Web Player (available for both Win & Mac)

Screencast 02: Ajax with Connection Manager

polvero@gmail.com (Dustin Diaz) — Tue, 05 Sep 2006 04:57:33 +0000

As it turns out, the first screencast episode turned out rather well. There were some rough edges and some things that can be smoothed out. In any case I present to you the second installment of the screencast series for your viewing pleasure. In this 25 minute episode I explain how to set up a connection object and create a basic webservice model.

As usual the setting is informal and there are some stray comments that hopefully do not deter you away from the focus of the screencast. Enjoy!

Download the Quicktime Version (31 MB)

If you cannot see the video below: get the DivX Web Player (available for both Win & Mac)

Screencast 01: YUI Basics and DOM Hijacking

polvero@gmail.com (Dustin Diaz) — Mon, 28 Aug 2006 04:58:23 +0000

I’ve finally decided to launch an idea I’ve had in the back of my mind for quite some time so today I present to you the first episode of the WSwI Screencasts. In this episode I demonstrate some of the fundementals of the Yahoo! User Interface utilities and how we can add progressive enhancements to our webpages with only applying the basics.

As a confirmation to the loyal Podcast listeners, this is not a replacement. The podcasts will still continue to hit the web sound waves and hopefully the screencasts will behave as a solid compliment. Enjoy!

Download the Quicktime Version (19 MB)

If you cannot see the video below: get the DivX Web Player (available for both Win & Mac)