Following best practices during the development process can help organize and structure an application. Standardized development provides clarity, stability, longevity and scalability. I worked with several members of the Flex community and the Adobe Flex Team to create this article outlining over 90 best practices for the Flex development process. Thank you to everyone who helped review the article. Also thanks to everyone who provided input!! And, thanks to Adobe for the opportunity to write this!!!

Here is a short passage from the article:

“In this article, you will learn how to manage assets so that your application’s dependencies will be well organized. I will also discuss widely accepted ActionScript 3.0, MXML, and CSS coding standards currently being practiced by the Flex development community. I’ll review ASDoc, a tool that you can use to create API language reference documentation as HTML from your application’s source code. In the application architecture section of this article I’ll show techniques that you can use to help define the blueprints for your application’s foundation. I will cover some of the application development frameworks that are available to Flex developers and discuss when it makes sense to use them and when it does not. Lastly, I will cover best practices for unit testing so that you can test your codebase and ensure the code will perform consistently.”

The last year has been an incredibly exciting one to say the least. A lot has happened for Adobe, for Flex, for the Flash community, for the world at large and for me personally. Looking back on this year I wanted a visual guide to show at a glance just exactly what I have been up to for the last 12 months. I needed this for myself, potential clients, my family and anyone else interested. There are still 12 projects I need to add but here is a start for now.  I had the extreme pleasure and honor to work alongside companies like 2Advanced, Universal Mind and Adobe Consulting. I wrote two articles for the Flex Developer Center on Adobe.com, two articles for O’Reilly’s InsideRIA, an article for Flash Magazine and I did three technical reviews for Flex books.

As an pretty neat wind down to 2008 you can see some of my code that made it into the big screen at MAX last week. A couple of people were kind enough to let me know about this and as I was looking through the MAX photo stream I stumbled across a photo that showed the before mentioned code. Pretty cool! (This is some really, really basic code I released on this blog last summer to show the new Flex 4 components.) I wasn’t able to make it out to MAX this year but my I was there in mind spirit and well…code.

Sean Moore Flex Source Code at MAX 2008

Stay tuned for more exciting happenings. I’m currently reviewing another book now and I should be working on more articles in 2009. I should also be giving some presentations at some of the user groups.

Lastly I’ve been working on some music to help unwind from coding and writing.Here is a remix I did (mp3) for a track by a group Digitalism. The song is called Taken Away. Here is another track in the works too.

As always thanks for stopping by and taking a moment to peek into my little corner of the world.

In case you missed it here is a link to the article discussing the Strategy Design Pattern that was recently featured on the O’Reilly, InsideRIA website. Writing the article was a really wonderful experience and I’m extremely excited to have another in the works now. More on that later. Here is a snip of the article, full link follows.

“The goal of this article is to help you gain a better understanding of the Strategy design pattern. The Strategy pattern is used to separate the areas of an application that differ from the areas of an application that remain the same. This design pattern sits on top of several fundamental OOP principals. For example the Strategy pattern uses the concept of programming to an interface rather than an implementation. Strategy also favors composition over inheritance. The reason you would use the Strategy pattern is to abstract an algorithm from a class and create a new class based on the algorithm. Using polymorphism the algorithms can be changed at runtime by the compositing class.”

Exploring the Strategy Design Pattern
November 3, 2008
http://www.insideria.com/2008/11/exploring-the-strategy-design.html

This was a great article to write and it solidified a lot of knowledge about OOP and Design Patterns. I may write another one on the Factory Method. Leave a comment if you have any interest.

In other news I’ll also have another Flex Best Practices article being published on the Adobe website soon.

I’ve also been researching Livecycle and BlazeDS a lot recently. I managed to get both set up and working on my laptop. There are a number of similarities however the default Livecycle setup runs JBoss and the default setup of Blaze runs Tomcat. So some system tweaks were needed here and there. In addition I also had an existing installation of Oracle that really hosed things up. The Oracle installer added some items to my laptops PATH variable which resulted in quite a bit of debugging. Next I installed MySQL. That was cool and I learned a lot. I’ve done the MySQL installation before however it’s been a while (4 years’ish). The next thing I did was locate a sample database from the web to play around with. I found a pretty large sample employees database on the web and installed it. Then I started trying to remember the various SQL statements needed to retrieve data, JOINs etc. While working on all of this I also found a way to expose my Blaze server to the open web, despite the dynamically assigned IP address from my ISP. That was really cool, but super slow. I was accessing the Blaze samples from my other computer across the web however it was too slow to deal with (not sure what the problem was there, more research is needed probably my upstream.) So the next steps are going to be to write some cool SQL statements to pull data from my sample database, then setup my Blaze application instance/context, write my Java classes (integrating my SQL), set up my remoting configurations and then finally I want to build a “dashboard” and pump the data into some Flex charts. I’m really busy with client work and articles right now so who knows when I’ll be able to finish but the whole experience was fun and I learned A TON.

I’ve also been working on a cool client Flex project and sneaking in time here and there for some music. Well gotta run for now, until next time… Happy Flexing!!

Here are five great Flex 3.0 and AIR books that are worth checking out in the next several months. Programming Flex 2 is an outstanding book and the updated Programming Flex 3 is sure to please. Creating Visual Experiences with Flex 3.0 by Juan Sanchez and Andy McIntosh is a must read and these AIR books also look really awesome. I’m putting these books on my radar for those cold winter (stay-at-home) nights approaching…

Programming Flex 3: The Comprehensive Guide to Creating Rich Internet Applications with Adobe Flex

Authors: Chafic Kazoun, Joey Lott

Available: September 24, 2008

Publisher: Adobe Dev Library

Description:

If you want to try your hand at developing rich Internet applications with Adobe’s Flex 3, and already have experience with frameworks such as .NET or Java, this is the ideal book to get you started. Programming Flex 3 gives you a solid understanding of Flex 3’s core concepts, and valuable insight into how, why, and when to use specific Flex features. Numerous examples and sample code demonstrate ways to build complete, functional applications for the Web, using the free Flex SDK, and RIAs for the desktop, using Adobe AIR. This book is an excellent companion to Adobe’s Flex 3 reference documentation.

More info.

Adobe AIR: A Guide for Developers

Authors: Mark Blair, Andrew Muller, Andrew Spaulding

Available: February 1, 2009

Publisher: Adobe Dev Library

Description:

The only authoritative resource on Adobe AIR’s first full release, with content created, reviewed, and critiqued by Adobe’s AIR team. Lots of resources exist for Adobe AIR and more are on the way, but most try to cover too much information for a technology that’s changing rapidly. What most developers need right now is a definitive introduction to Adobe AIR: How it works and how to develop for it. Written and approved by Adobe experts who know the real story behind AIR, the information in this book comes straight from the source.

More Info.

Professional Adobe Flex 3

Authors: Joseph Balderson, Peter Ent, Jun Heider, Todd Prekaski, Tom Sugden, Andrew Trice, David Hassoun, Joe Berkovitz

Available: February 24, 2009

Publisher: Wrox

Description:

With Professional Adobe Flex 3, put your prior experience with Flash, Actionscript and XML-based language to good use and learn how to use the Flex 3 platform to create rich Internet and Apollo applications. Understand the potential of the Flex 3 platform through practical examples and hands-on advice on topics like developing applications in MXML, creating custom flex components, charting, targeting Apollo runtime, and data interconnectivity. In addition, this book addresses the ways that you can contribute to the development of Flex 3, which is open source.

More info.

Creating Visual Experiences with Flex 3.0

Authors: Juan Sanchez, Andy McIntosh

Available: November 17, 2008

Publisher: Addison-Wesley Professional

Description:

Don’t settle for Flex’s boring, standard user interface: set your Flex applications apart with the breakthrough skinning and programming techniques found in Creating Visual Experiences with Flex 3.0. Leading Flex developers Juan Sanchez and Andy McIntosh show how to build Flex and AIR applications that are stunningly beautiful — and amazingly usable. You’ll learn how to apply state-of-the-art branding and visual design techniques that add value to all your Flex applications, no  matter what they do or who you’re building them for.

More info.

Adobe AIR Cookbook: Solutions and Examples for Rich Internet Application Developers

Authors: David Tucker, Marco Casario, Koen De Weggheleire, Rich Tretola

Available: November 20, 2008

Publisher: Adobe Dev Library

Description:

The hands-on recipes in this cookbook help you solve a variety of tasks and scenarios often encountered when using Adobe AIR to build Rich Internet Applications for the desktop. Thoroughly vetted by Adobe’s AIR development team, Adobe AIR Cookbook addresses fundamentals, best practices, and topics that experienced web developers and application designers have inquired about most. This collection also includes solutions for using this runtime environment to build truly innovative applications.

More info;

Autumn is here again and it’s time to review some of the happenings from the summer. Here are 43 hand selected Flex and ActionScript 3.0 libraries, APIs, tips, and tricks.  There have been several new APIs launched, Cairngorm was open sourced, a Flex 3 update was released and Grant Skinner created a new tweening engine. There have been new Flex application development frameworks released. There was a Flex code generator update and there have also been some design pattern updates released. You don’t want to miss out on this link round up!

Introducing Flex SDK 3.1 and Flex Builder 3.0.1
Flex SDK 3.1 is what the team considers a milestone build, a certification of all of that work and a roll-up into a build that is recommended for all users
http://www.adobe.com/devnet/flex/articles/sdk3_fb301.html

Cairngorm Moved to Adobe Open Source
http://weblogs.macromedia.com/amcleod/archives/2008/08/cairngorm_moved.html

Flex Architecture Basics - Models & Data Transfer Objects
Demonstrates a relatively easy way of setting up a small Flex application using a model and a data transfer object
http://nwebb.co.uk/blog/?p=228

Tutorial: ActionScript 3 Dragging Methods
This tutorial is all about dragging an object around the stage.
http://flashmymind.com/Tutorials/Actionscript/Advanced/actionscript-dragging.php

Flex Paginate Component
A little paginator component
http://www.darklump.co.uk/blog/?p=112

ModuleManager and IModuleInfo - loading Flex Modules dynamically
http://lowpitch.com/blog/2008/08/17/modulemanager-and-imoduleinfo-loading-flex-modules-dynamically/

Getting started with Degrafa
Simple code example by Mike Huntington
http://www.mikehuntington.com/?p=22

Advanced CSS with Degrafa
Another great code example by Mike Huntington
http://www.mikehuntington.com/?p=31

Alcon 3
Rewritten for Adobe AIR. This is a little debuger/logger, I used to use this back in the AS2 days and really enjoyed it. I still need to check this out but I’m sure it’s really cool.
http://blog.hexagonstar.com/alcon/

Remove css type selector warnings in Flex Builder
Quick little tip to remove css type selector warnings from the Flex Builder problems panel
http://www.nutrixinteractive.com/blog/?p=135

VBox, HBox with gradient background
http://www.igorcosta.org/?p=160

Flex designer/developer workflow video tutorials
A series of short tutorials that cover using Fireworks CS3 and Flex Builder 3 to create a visual theme for Flex applications.
http://www.ashorten.com/2008/08/11/flex-designerdeveloper-workflow-video-tutorials/

Six reasons to use ActionScript 3.0 - Lee Brimelow
http://www.adobe.com/devnet/actionscript/articles/six_reasons_as3.html

Custom flex skins
Creating web-applications with flex 3 is great. there are a ton of pre-made components, and an open-ended architecture to allow you to create your own.
http://the.fontvir.us/b10g/?id=111

Writing components in Flex, part 1
http://labs.flexperiments.nl/writing-components-in-flex-part-1/

Writing components in Flex, part 2
http://labs.flexperiments.nl/writing-components-in-flex-part-2/

Flash Enabled Blog Actionscript 3 API roundup
http://flashenabledblog.com/2008/08/26/as3-actionscript-3-classes/

Create bitmap data object from a display object
http://www.flexer.info/2008/08/20/how-to-make-a-bitmapdata-from-a-displayobjectuicomponent/

FCG 1.0 (Flex code generator)
Goes final and open source
http://www.dehats.com/drupal/?q=node/45

New ActionScript 3 Singleton Method
Daniel Love’s version using static initializers
http://www.daniellove.net/blog/?p=81

CSKDebugger
AIR debuger for Mac
http://ultra-web.co.uk/?p=178

Fill Colors
Fill Colors is the embodiment of the separation between style and layout in Flex and a demonstration of what’s possible in terms of skinning a Flex application
http://www.fillcolors.com/

gTween
Animation tweening library by Grant Skinner
http://www.gskinner.com/blog/archives/2008/08/gtween_a_new_tw.html

Functional Testing Framework for AIR AJAX apps based on Selenium
http://corlan.org/2008/08/15/functional-testing-framework-for-air-ajax-apps-based-on-selenium

Yahoo! Music API
The Yahoo! Music API gives developers access to the Yahoo! Music catalog of artists, albums, tracks, videos, ratings and more. It provides numerous ways to browse the catalog: through charts, search, similarities, genres, artists, and user recommendations and ratings.
http://developer.yahoo.com/music/

ActionScript 3 Flexible Layout Class
The NpFlexLayout Class is designed to simplify aligning DisplayObjects to stage dimensions and responding to changes in stage dimensions at run time by a user or between different users.
http://www.blog.noponies.com/archives/109

mediacorelib - media core library for ActionScript 3.0
The MediaCoreLib is an Actionscript 3.0 library toolset for playing audio or video files effortlessly. MediaCoreLib allows you to manage a playlist and seemlessly crossfade tracks.
http://code.google.com/p/mediacorelib/

Servebox ActionScript Foundry
An ActionScript 3 / Java framework designed for Flex 2 applications development. Its design is based on several design patterns,
http://www.servebox.com/foundry/doku.php?id=

Flest Framework
Flest is an ActionScript3 / Flex application framework for building enterprise level RIAs. It uses such design pattern as Controller, Factory, Command, etc. High efficiency, simplicity and practicality were set as its mandatory design features.
http://code.google.com/p/flest/

Guasax Flex/AIR MVC - The MVC Flex/AIR Framework
Guasax is an ease of use programming framework to provide ordered and scalable Flex applications. Life cycle of guasax framework is based in the MVC pattern to take on our program actions
http://www.guasax.com/guasax/web/en/index.php

Flex Mojos - HelloWorldTutorial
Tutorial for building a simple Hello World Flex application with flex-mojos
http://code.google.com/p/flex-mojos/wiki/HelloWorldTutorial

Scott Evans - public discussion of new FlexBuilder 4 IDE features
Scott Evans, a lead engineer on the FlexBulder team, has started a new blog - Getting and Setting  that will be for public discussion of new FlexBuilder 4 IDE features.
http://gettingandsetting.com/

dpHibernate - Hibernate lazy loading with Adobe BlazeDS
dpHibernate is a custom Flex Library and a custom BlazeDS Hibernate adapter that work together to give you support for lazy loading of hibernate objects from inside your flex applications.
http://blog.mikenimer.com/index.cfm/2008/5/21/dpHibernate–Hibernate-lazy-loading-with-Adobe-BlazeDS
http://code.google.com/p/dphibernate

Alternativa3D — browser 3D-engine based on Adobe Flash
Create 3D-scenes in Flash: objects, mechanisms, buildings visualization. Import geometry from 3D-formats, upload textures (including animated). Three-dimentional projects and games, basic physics simulation (friction, collision).
http://alternativaplatform.com/en/alternativa3d/

KwikUML - build UML models of ActionScript and PHP classes
A tool to quickly build UML models of ActionScript and PHP classes and interfaces, as well as, SQL Entity Relationship Designs (ERDs). Built on Adobe’s AIR runtime, this desktop application allows you to not only build those models but export PNGs of the models for use in specification documentation and generate stub code from the models to use as a starting point once it’s time to actually begin development.
http://labs.otuome.com/kwikuml

KitchenSync
KitchenSync is an ActionScript 3.0 library for sequencing animations and other time-based actions.
http://code.google.com/p/kitchensynclib/

as3xls - read and write Excel files in Flex
Supports reading text, numbers, formulas, and dates from Excel version 2.x-2003 and writing text, numbers, and dates. Formulas also update to reflect changes in cells they reference.
http://code.google.com/p/as3xls/

ASDebugger - A run-time debugger for AS3 Projects
The ASDebugger allows you to trace variables. It has support for strings, integers, arrays, dates, arraycollections, objects and everything in between.
http://labs.flexperiments.nl/asdebugger/

as3corelib update
This is an ActionScript 3 library that contains a lot of useful APIs for working with AS3.
http://code.google.com/p/as3corelib/

swix framework - Flex development framework
Swiz is a framework for Adobe Flex that aims to bring complete simplicity to RIA development. Swiz provides Inversion of Control, event handing, and simple life cycle for asynchronous remote methods. In contrast to other major frameworks for Flex, Swiz imposes no JEE patterns on your code, no repetitive folder layouts, and no boilerplate code on your development. Swiz represents best practices learned from the top RIA developers at some of the best consulting firms in the industry, enabling Swiz to be simple, lightweight, and extremely productive.
http://code.google.com/p/swizframework/

Gaia - open-source front-end Flash Framework for AS3 and AS2
Gaia is an open-source front-end Flash Framework for AS3 and AS2 designed to dramatically reduce development time.
http://www.gaiaflashframework.com/

Penne Framework - lightweight framework for developing in Flex and Air
version 1.0 of The Penne Framework, a simplified Flex and Air framework, as a second option to the popular Cairngorm Framework.
http://www.flexpasta.com/index.php/2008/04/19/introducing-the-penne-framework-for-flex-3/

An ActionScript Compiler Written In ActionScript
“It’s enough to warm the cockles of one’s heart. ActionScript nerds around the globe can celebrate their graduation to “real programmer” status (whatever that means).”
http://www.brooksandrus.com/blog/2008/08/27/an-actionscript-compiler-written-in-actionscript/

Flex 4: flex.components

Here is a very simple example that displays some of the components that are located in the new flex.components package.  The SWF is interesting because it is visually a little different than the classic Flex theme. No CSS has been altered in this example. Flash Player 10 is required to view the SWF.  The following Flex 4 components can be seen: Panel, CheckBox, List, RadioButton, TextArea, TextInput, ToggleButton, HSlider, VSlider, VScrollBar, HScrollBar.

JPG showing the components: Flex 4 components screehshot

SWF with the functional components: Flex 4 components SWF

Here is the sample source code:

<?xml version=”1.0″ encoding=”utf-8″?>
<Application xmlns=”http://ns.adobe.com/mxml/2009″
layout=”flex.layout.VerticalLayout”
backgroundColor=”white”
xmlns:ns=”library:adobe/flex/gumbo”>

<Script>
<![CDATA[

/**
*
* @project Flex 4 flex.components example
* @author Sean Moore, http://www.seantheflexguy.com
* @date: August 29, 2008
*
*/

private function onButtonClick():void
{
trace(">>onButtonClick");
}
private function onListSelectionChanged(event:Event):void
{
trace(">>onListSelectionChanged");
trace("event.currentTarget.selectedItem="+event.currentTarget.selectedItem);
}
private function onRadioButtonClick():void
{
trace(">>onRadioButtonClick");
}

]]>
</Script>

<Panel title=”Flex 4 flex.components example” width=”500″>
<Button click=”onButtonClick();” label=”Flex 4 Button” />

<CheckBox label=”Flex 4 CheckBox” />

<Group>
<Rect width=”200″ height=”100″>
<stroke>
<SolidColorStroke weight=”1″ color=”#000000″ alpha=”0.5″ />
</stroke>
</Rect>
<List content=”['row one','row two','row three','row four']” selectionChanged=”onListSelectionChanged(event);” />
</Group>

<RadioButton label=”Flex 4 RadioButton” click=”onRadioButtonClick();”/>

<TextArea height=”50″ content=”Flex 4 TextArea.”/>

<TextInput text=”Flex 4 TextInput”/>

<ToggleButton label=”Flex 4 ToggleButton” />

<HSlider />
<VSlider  />

<VScrollBar />
<HScrollBar  />

</Panel>

</Application>

Note that the <Group> element is not required to use the List component. It’s been added to help show where the List is in the example SWF. (Sorry that the code hasn’t been beautified…)

The Nature Conservancy - Protecting Nature, Preserving Life

Thanks to the Adobe Developer Connection for putting together this awesome program! Authors that contributed work to the ADC from June through August in 2008 were each given an opportunity to choose from 5 charities to donate $100 to. The ADC Write and Give Program generated $6200 USD in Q3 of 08!! That’s fantastic! I donated to the Nature Conservancy for my work on the Flex Best Practices series. Shout out to the other authors who also contributed to the ADC Write and Give Program.

Sheri German
http://www.swanilda.com/

Paulo Caroli
http://caroli.org/

Ayo Binitie
http://mrbinitie.blogspot.com/

Louie Penaflor
http://www.restlessthinker.com/blog/index.php

Jonathan Tabak
http://www.panachetech.com/

Jim Babbage
http://www.communitymx.com/blog/index.cfm?blogger=32

Nick Myers
http://www.cooper.com/

DryIcons
http://dryicons.com/

Tom Green
http://www.tomontheweb.ca/

Kumar Vivek
http://blog.i2fly.com/

John Wylie
http://www.activata.co.uk/

Samir Dash
http://www.mobilewish.com/

David Tucker
http://www.davidtucker.net/

Bill Bejeck
http://www.adobe.com/devnet/flex/articles/flex_grails.html

Henrik Lindahl
http://www.kodgruppen.com/

Sebastien Arbogast
http://sebastien-arbogast.com/

Zee Yang
http://www.flexlive.net/

Thanks again to Hong Qiu for all the help with the article. The second part of the Best practices series is in the works and should online in the next couple months. Thanks to Edward Sullivan the Product Manager at the Adobe Developer Connection as well.

Additional information can be found on the ADC Blog.

Just a quick post regarding Flash Forward 2008. There is a killer line up this year including: David Carson, Erik Natzke, Grant Skinner, Keith Peters, Lee Brimelow, Paul Ortchanian, Tinic Uro, Luke Bayes, Stacey Mulcahy and Branden Hall to name a few. David Carson should certainly have some interesting insight for the Flash community. I am extremely fortunate enough to have acquired a pass to this incredible event. If you want to chat or grab a coffee hit me up. Contact info follows:

email: info@seantheflexguy.com
twitter: http://www.twitter.com/seantheflexguy

Extra-mega-super thanks to Phillip Kerman for the hook up.

Hope to see you there…

Here is a great book from Manning about AIR development that you might want to check out. Topics include: windowing, menus, file system, drag-and-drop, local databases, SQLite, HTML in AIR, network connectivity and also updating/distributing apps. Flex and Flash based AIR development techniques are covered. “Adobe AIR in Action introduces AIR to developers familiar with Flash and Flex, showing them how to build solid AIR-driven desktop applications. Using examples, the expert authors walk web developers through the new topics they will need to develop AIR applications for the desktop.”

You can download two free sample chapters from the book in PDF format here:

Introducing Adobe AIR (1.7 MB)

Applications, windows and menus (3.1 MB)

You can also check out the Table of Contents here.

Shout out to the great authors: Joey Lott, Kathryn Rotondo, Sam Ahn and Ashley Atkins. (And an extra special thanks to Kathryn for sharing that other source code.) Props to Karen Tegtmeyer as well for coordinating my involvement with the review effort.

Visit the companion website here:
http://www.manning.com/lott/

I actually had the extreme pleasure of doing some technical reviews of the book while it was being written. As a thank you Manning placed a quote from me on the back of the book. In addition my name appears in the acknowledgments. This is a huge, huge honor and I am extremely thankful. Thank you very, very for the opportunity.

Here are some photos of my copy of the book.

Adobe AIR In Action - Manning

Adobe AIR In Action - Sean Moore Quote