Monday, March 25, 2013

10 Things A Good Flex Developer Should Know

I just read this article by "Jeremy Mitchell" here.
Its a nice one, have a look. Happy Learning :)

(Let me copy paste the text as well, in case his blog preferences etc. change)

It takes more to be a good Flex programmer than simply knowing how to use some built-in Flex containers and controls. It takes significantly more.

Here's my take on the subject...along with some resources or some keywords that you can easily Google.

Please comment on this blog if you feel like I've overlooked anything (which is inevitable) or if you know of some valuable resources that I should add.
1. Object-oriented programming (OOP)
The language on which Flex is based, ActionScript 3, is a fully object-oriented language. Although not an easy concept to grasp, object-oriented programming is a prerequisite to learning Flex. If your prior experience includes OOP (Java, C#, Ruby, etc), then you're set. If not, you'll need to pick up an OOP book and start learning ASAP.

* Head First Java (Java? Yes, I know. But trust me.)
* Object-oriented programming with ActionScript 3.0

Note: Some of you may be asking - "What about design patterns?". Let's take one step at a time, shall we? Concern yourself with understanding classes and objects, interfaces, inheritance, composition, polymorphism, encapsulation, etc. Only then should you even consider looking at design patterns. In fact, if I write a post entitled "10 Things A GREAT Flex Developer Should Know", design patterns will be on that list.
2. ActionScript / MXML
ActionScript is the programming language used along with MXML to create Flex applications. MXML is tag-based declarative language written in XML. Each MXML tag is mapped directly to a corresponding ActionScript class. MXML is primarily used by Flex developers to lay out the UI, whereas, ActionScript is used for business logic. Exceptions apply, of course.

The Flex Framework includes hundreds of ActionScript classes and interfaces used to develop Flex applications. Your skill level as a Flex developer is tied directly to your proficiency with ActionScript and MXML.

* Flex in a Week
* Tour De Flex
* Essential ActionScript 3.0

Note: Get comfortable with the Flex Language Reference. As a Flex developer, you will use it on a daily basis.
3. Debugging
A large portion of any developer's time is spent debugging. Obviously, debugging is required to track down the root cause of bugs. However, debugging is also a great way to learn a new code base.

Fortunately, there are many tools available to assist you with your debugging efforts. Invest some time in learning these tools. Your investment will pay dividends immediately.

* Flash Builder 4 Debugger
* De MonsterDebugger
* Kap Inspect

4. Event-driven programming
Flex applications are event-driven. Every action is the result of an asynchronous event.

As a Flex developer, you must know how to respond to events and how to create and dispatch events. To accomplish this, a solid understanding of Flex's event architecture is required including familiarity with the following concepts:

* Built-in events (Flash Player or Flex Framework events)
* Custom events (Events created by the developer that extend the Event class or one of its subclasses)
* Event dispatchers, event broadcasters (See EventDispatcher class and its dispatchEvent method)
* Event listeners, event handlers (See EventDispatcher class and its addEventListener & removeEventListener methods)
* Event Flow (capture, target & bubbling phases; target vs. currentTarget)
* Event objects, event types (See Event class and subclasses)
* Event default behavior (See Event class and subclasses and its preventDefault method)

5. Data binding
On the surface, data binding is a no brainer. Bind the value of one property to the value of another property using curly bracket notation. When the value of the source property changes, so does the value of the destination property.

However, there is overhead associated with data binding and indiscriminate use can have performance implications. A solid understanding of data binding will help you determine when it is appropriate and when it is not.

* Flex Tips - Using Bindable Metadata Events
* Michael Labriola's presentation entitled Diving in the Data Binding Waters

6. Item renderers
One characteristic of a well-designed Flex application is the presentation of data in a visually-compelling manner. Flex provides a number of list-based controls (DataGrid, List, TileList, HorizontalList, etc) responsible for the presentation of data. However, only with the help of an item renderer can a list-based control customize the display of the data.

You will spend a lot of time working with item renderers. Get very comfortable with how they work.

* Flex Examples - Item Renderers in Practice
* A Deep Dive into Flex 4 Lists and Layouts

7. Accessing remote data
Do you know of many applications that don't interact with data? Me neither. Learn how to retrieve data via HTTPService, WebService and RemoteObject. A Flex architecture framework may also help you with this (see #9).

* Retrieving and handling data with HTTPService
* Retrieving and handling data with WebService
* Retrieving and handling data with RemoteObject

8. Styling / Skinning
Let's not forget that Flex is a UI technology and as such certain design expectations exist. As a Flex developer, you should be able to customize the look and feel of your Flex applications using CSS styling and/or graphical or programmatic skins.

With Flex 4, there are no more excuses. Spend a little time getting to know the right side of your brain for once. It's a nice change of pace, and it will help differentiate yourself from other Flex developers.

* Flex Style Explorer
* ScaleNine
* Introduction to Flex: Part 3 - Styles & Skins

9. At least one Flex architecture framework
Most Flex architecture frameworks enforce a separation of concerns by implementing an MVC (model-view-controller) application design. In addition, many of these same frameworks dictate how your code should be organized and packaged within your Flex project.

Although many would argue that frameworks are unnecessary, I believe that Flex developers benefit in many ways from the experience of using one. Simply witnessing the techniques (good or bad) employed by a framework to solve complex architectural issues contributes to your growth as a Flex developer / architect.

Also, it's hard to deny the fact that framework experience will substantially increase your marketability as a Flex developer. Jesse Warden recently told me "There are a few shops that don't use frameworks, but those are rare. It's in 'fashion' whether we like it or not." I agree with Jesse.

* Cairngorm
* Parsley
* PureMVC
* Mate
* Swiz
* Robotlegs

10. Component lifecycle & the display list
I wasn't convinced of the need to learn the Flex component lifecycle or the display list until I wrote my first "custom" component (actually, it was a semi-custom component that extended Canvas). Until that time, I used built-in Flex components and blissfully lived in MXML land where the display list was handled for me. Never once did I encounter an addChild, createChildren or commitProperties method, and I used the creationComplete event for everything.

My first custom component utilized a handful of asynchronous events, and I could not reliably predict the order in which each event would be handled. Only after I learned of the Flex component lifecycle methods and dirty flags could I regain control.

These lifecycle methods are already there. Learn how they work and use them to your benefit. Your life will be easier and you'll lose less hair.

* Colin Moock's Lost ActionScript Weekend - The Display List
* Creating New Components in Flex 3
* Diving Deep with the Flex Component Lifecycle
* Understanding the Flex 3 Component and Framework Lifecycle

Thursday, December 3, 2009

Basic Flex

Flex ! Its been quite some time that I have been working in Flex. I am here to put into words my understanding of the Flex development. Lets start with some basic questions - What is Flex? Which technologies compete Flex? Why choose Flex? What are different tools/technologies involved in Flex application development?

flex-ing here! But what is Flex?
If you are familiar with Adobe Flash then it would be very easy for you to understand what Flex is. It is a development technology to create the same kind of applications (Rich Internet Applications) as Flash does. Creating RIA in Adobe Flash becomes complex when using timelines etc, alternatively Flex is a programatical approach.

Static web pages are dinosaurs, lets talk a bit about RIAs (Rich Internet Applications)
Paradigm of displaying simple text and static images on web pages has shifted towards more sophisticated, interactive, responsive, and dynamic web applications. Such applications have a broad spectrum - ranging from simple e-commerce applications that use multimedia content to more complex ones like animations (using Adobe Flash), games (using Adobe Flash), interactive content (Ajax Framework), and even Desktop applications (using AIR).

Is Flex one of its kind?
Not really ! As we discussed that Flex is used to build RIAs. There are various other technologies to build RIAs, each having some plus and minus. We would go into details of only Flex but meanwhile we would be using a comparison based approach to discuss others. Examples of RIA frameworks include Ajax, Curl, GWT, Adobe Flash/Adobe Flex/AIR, Java/JavaFX, Mozilla's XUL and Microsoft Silverlight.

I don't like Flex but its better than others
Its open source - I can use it as long as I need it, I can modify it as much as I want to !
It creates applications in smaller size - uses Flash Player's framework cache to keep libraries and classes saved. This reduces the downloadable size of your application ! (ping me if you need explanation)
It has got looks because you use it aesthetically - Adobe creative suit can be used to build custom skins/templates for visual components in flex. (Caution: Flex is very bad at styling. Most stylish people like other graphics tools to keep Flex visual components upto mark)

Convinced to use Flex. Now what?
Following THINGS make up the Flex platform:
i) Adobe AIR - to build desktop applications using web development technologies in flex
ii) Adobe Flex SDK - contains both Adobe Flex Framework and Adobe Flex Compiler

Adobe Flex Framework - classes and libraries used to build RIAs can be downloaded separately
Adobe Flex Compiler - compiles application code into SWF binary files and can be downloaded separately

iii) Adobe Flash Player 9 - crossplatform client runtime for (web-based) RIAs built in Flex

Following Products are helpful but cost money:
Adobe Flex Builer 3 - an IDE that contains Adobe Flex SDK, Flex Designer, and Flex Debugger
Adobe Flex Charting - libraries to draw different type of charts in Flex applications
Adobe Flex LiveCycle Data Services - data management services

We would dig into some more stuff in the next post. So keep visiting :)

Are you a nerd! Go read more
Flex Learning Paths
An Animated Overview of Flex

For serious developers only !