AJAX First Steps

So, yeah, its Christmas eve…and guess what I had some extra time this afternoon! So, I decided to take some of the initial steps to learn AJAX. I decided to start off with prototype. For a pretty simple example I found a quick zip code lookup tutorial by Pete Freitag.

Here are the peices/parts:

The HTML
[html]

zip:

[/html]The JavaScript (ZipCode.js)
[js]
function checkZip() {
if($F(‘zip’).length == 5) {
var url = ‘checkZip.cfm’;
var params = ‘zip=’ + $F(‘zip’);
var fullUrl = url + “&” + params;
var ajax = new Ajax.Updater(
{success: ‘zipResult’},
url,
{method: ‘get’, parameters: params, onFailure: reportError});
}
}
function reportError(request) {
$F(‘zipResult’) = “Error”;
}
[/js]

The ColdFusion (checkZip.cfm)
[html]

Please enter a valid zip code.

SELECT name, state FROM zips
WHERE zip =

#ziplookup.name#, #ziplookup.state#

Zip code not found.

[/html]

There is also a zip code db (MySQL) for the data end of things.

Considering the lack of code I’m thinkin’ that is pretty slick to get external data into an HTML page with no page refresh. I’m pleased so far.

Helpful resources found so far:
Quick Guide: http://particletree.com/features/quick-guide-to-prototype/
Scriptaculous Wikie for Prototype: http://wiki.script.aculo.us/scriptaculous/show/Prototype
Unofficial Prototype documentation: http://www.sergiopereira.com/articles/prototype.js.html#UsingAjaxUpdater

Merry Christmas!

I want to learn AJAX

Becuase I have tons of extra (ha!) time and incessant need to learn new things, I’m going to start a project that I’ve had in mind for a while: The project is a simple system to manage development items associated to multiple projects. Beacuse I want to learn about AJAX and its associated frameworks, I figured that I’d attempt the project while evaluating the following: script.aculo.us & Spry.

I’ll keep you updated on the progress, and any information/comments you can push my way will be greatly appreciated.

Also, I believe that the Rocky Mountain Adobe User’s Group is planning a presentation on AJAX in January.

RMAUG Resources

As promised here are the links & resources for the “No More Flex Clones!” Presentation given last night’s at the RMAUG User Group Meeting:

Initial inspiration and source of much of the presentation content (This is where you can grab the source skin files):
Designing Flex 2 skins
http://www.adobe.com/devnet/flex/articles/flex_skins.html

Cool explorer app built by Adobe Consulting…nice place to start with Flex & CSS:
Flex 2 Style Explorer
http://examples.adobe.com/flex2/consulting/styleexplorer/Flex2StyleExplorer.html


Great set of captivate movies by Jesse Warden about getting a design into Flex.
Photoshop -> Fireworks -> Flex: End to end designing for Flex applications
http://www.jessewarden.com/flex/photoshop_fireworks_flex/

[Slides PDF]

Qualcomm Updates its site

Qualcomm updated its site recently. With the announced partnership with Adobe Flash Lite developers and the the BREW crowd should check it out:
QUALCOMM BREW | Home

Annual BREW Conference
The annual BREW Developer Awards are a prime opportunity to recognize
the best applications and services in wireless. Here’s your chance to
be recognized by your peers and industry leaders for your outstanding
contributions in developing mobile applications based on the BREW
solution. Winners will be revealed at an awards ceremony held at the
BREW 2007 Developers Conference in San Diego June 20 – 22, 2007. Submissions are due by Febuary 28th, 2007. QUALCOMM | BREW 2007 | Awards

BREW Gaming
Progress in wireless handset design and capabilities allow BREW to
offer a truly enticing 3D mobile gaming environment. BREW-enabled games
benefit from CDMA2000 1xEV-DO and other high speed networks to enable
downloading of graphically impressive games. Check out the BREW Gaming site.

AS3.0 Cookbook…a good place to start and a fine resource.

ActionScript 3.0 Cookbook by Lott, Schall & Peters is an excellent book. This book allows you to quickly jump into AS3 Programming, as well as a nice reference for those items that need to be resolved quickly during the development process.

Each topic is grouped to provide information on specific problems so they can be accessed quickly and easily. This allows for the book to be used as a reference so you don’t have to read it from cover to cover…you could if you wanted to however. Along with each topic, this book provides many useful code examples. Not only that, but the authors explain why they used the code approach they did for that example.

That brings up another bonus point for this book; its simplicity. The book is extremely easy to understand. It does not however gloss over the more intricate points of a and goes into great detail without overwhelming the reader.

A few chapters to jump into are:

Chapter 8, The BitmapData chapter:
This chapter introduces the BitmapData class that was introduced in Flash 8, but is extremely usefully and simple to implement in Flex 2/Flash Player 9.

Chapter 6, the Display List chapter:
This chapter contains critical information on the rendering model in Flash Player 9, which has been completely re-designed

Chapter 20, the chapter on XML:
This chapter includes great information on dealing with XML in AS3, which has changed significantly from AS2 (say hi to e4x). This book explains most things you’ll need to do with XML in AS3.

Flex 2 Resources That I Use

Flex.org

http://www.flex.org (Check out Documentation
& Getting Started)

Documentation
ZIP from flex.og (http://www.adobe.com/go/flex_documentation_zip)

Forums:

http://tech.groups.yahoo.com/group/flexcoders/ (Very
Active)

http://tech.groups.yahoo.com/group/flexcomponents/

http://www.adobe.com/cfusion/webforums/forum/index.cfm?forumid=60

Blogs I keep an
eye on:

http://weblogs.macromedia.com/mchotin/

http://weblogs.macromedia.com/khoyt/index.xml

http://quietlyscheming.com/blog/

http://coenraets.org/

http://kuwamoto.org/

http://weblogs.macromedia.com/swebster/

http://weblogs.macromedia.com/amcleod/

http://www.darronschall.com/weblog/

http://weblogs.macromedia.com/pent/

http://www.onflex.org/ted/

Developer
Center

http://www.adobe.com/devnet/flex/

Adobe Product
page

http://www.adobe.com/products/flex/