Sean Moore Flex Best Practices

7/31/2019 Sean Moore Flex Best Practices

1/48

Flex Best PracticesSean Moore

Sean the Flex guyKannopy, Inc.

http://www.seantheflexguy.com

http://www.actionscriptcheatsheet.com

twitter: seantheflexguy

http://www.kannopy.com
http://www.seantheflexguy.com/http://actionscriptcheatsheet.com/http://www.seantheflexguy.com/http://actionscriptcheatsheet.com/http://www.kannopy.com/http://www.kannopy.com/http://actionscriptcheatsheet.com/http://www.seantheflexguy.com/http://actionscriptcheatsheet.com/http://www.seantheflexguy.com/


2/48

Any fool can write code thata computer can understand.

Good programmers write

code that humans can

understand.

- Martin Fowler


3/48

Do you want to maintain this?

char x[]="((((((((((((((((((((((",w[]="\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b\b";char r[]={92,124,47},l[]={2,3,1,0};char*T[]={" |"," |","%\\|/%"," %%%",""};char d=1,p=40,o=40,k=0,*a,y,z,g= -1,G,X,**P=&T[4],f=0;unsigned int s=0;void u(int i){int n;printf("\233;%uH\233L%c\233;%uH%c\233;%uH%s\23322;%uH@\23323;%uH \n",*x-*w,r[d],*x+*w ,r[d],X,*P,p+=k,o);if(abs(p-x[21])>=w[21])exit(0);if(g!=G){structitimerval t= {0,0,0,0};g+=((g>3)+1);o=p;m(x);m(w);(n=rand())&255||--*w||++*w;if(!(**P&&P++||n&7936)){ while(abs((X=rand()%76)-*x+2)-*w


4/48

Flex Best Practices articles

Flex best practices Part 1: Setting up your Flex projecthttp://www.adobe.com/devnet/flex/articles/best_practices_pt1.html

Flex best practices Part 2: Development practices

http://www.adobe.com/devnet/flex/articles/best_practices_pt2.html
http://www.adobe.com/devnet/flex/articles/best_practices_pt1.htmlhttp://www.adobe.com/devnet/flex/articles/best_practices_pt2.htmlhttp://www.adobe.com/devnet/flex/articles/best_practices_pt2.htmlhttp://www.adobe.com/devnet/flex/articles/best_practices_pt1.html


5/48

Source of the standards

Based on extensive research into existing Flex,

Flash, ActionScript, Java, C/C++ standards

Reviewed/edited by prominent members of

Flash/Flex community

Reviewed/edited by Adobe Flex Team


6/48

Planning


7/48

UML

Consider using UML to model application

Start simple, dont go overboard

Dont try to model the entire application

Package ,Class, Interface diagrams

Sequence diagrams

*Component diagrams


8/48

Code Generation

Consider using code generation tools

(Round trip diagram to source code)

(Generate diagrams from existing code)

Enterprise Architect,

VASGen

Cairngen


9/48

Application Development Frameworks

Use frameworks for team-based development efforts

Know when NOT to use a framework

FrameworkCairngorm

PureMVC

Mat

Swiz

Application/Business logic

More Design Patterns

StrategyFacade


10/48

Design Patterns

Consider using design patterns:

Strategy

Command

Singleton

MVC

Decorator

Faade

Composite


11/48

Third Party APIs

Integrate third party libraries and APIs to save time

Dont re-invent the ScrollBar!

flexlib

Degrafa

Papervision

Tweener


12/48

Final target platform[s]

Plan ahead for AIR deployment

Offline mode

Local DB

Occasionally connected

Prevent code conversion and refactoring later

Thin Clients

Linux


13/48

Workspaces


14/48

Use Workspaces to Stay Organized

Close old projects.Use separate/new workspaces.

Cluttered / Slow Clean/Fast


15/48

C:\kannopy\flex\client\

TwitterFlexClient

TwitterFlexClient.mxml

Workspace/Project hierarchy

Project

Workspace

Main Deployable MXML File

UpperCamelCase


16/48

Setting up


17/48

Use the defaults (consistency across projects/organizations)

*Unless using local development server

define path during project creation process

Flex project output

Development: "bin-debug

Deployment: "bin-release


18/48

Source code

Standard used by other languages (Java, C)

Place Code

Here


19/48

Source Control

If not already: Use source control (SCM)

Track changes to codebase

ALWAYS have a backup

Critical in team environments

Merge, difference, tag, branch, etc.


20/48

Source Control

Subversion, CVS, Perforce, GIT

Subclipse for Flex Builder/Eclipse

Dont include .project file or /settings directory

(specific to each developers machine)


21/48

Managing SWC dependencies

Use libs directory

Reference shared SWC libraries using Flex

Library path (under project properties)

Place SWCs

Here


22/48

Handling assets


23/48

File naming


24/48

File naming Donts

Do not use when naming files:

spaces

special characters

acronyms or abbreviations

periods


25/48

File naming standards

MXML files & Actionscript Class files

TwitterFlexClient

Uppercamel casing

Actionscript Interface Names

ILoggingTargetUppercamel casing , Begin file name with capital letter I


26/48

Coding standards


27/48

Use packages for code organization

Use the following formatfor package names:

top level domain

(TLD)

application owners

name

project name

logical grouping of

related files

Use lowerCamelCase for package names


28/48

Packages

Dont use verbs, adjectives, adverbs for package names

Name packages according to their classes:

vo contains AccountVO, PhotoVO

package com.seantheflexguy.bestPracticesExample.vo {}


29/48

Classes

Append class types to the class name:

validators, formatters, events, and errors

com.seantheflexguy.burrow.validators.DateValidator

Append the skin type to the class name

com.seantheflexguy.burrow.skins.ExitButtonSkin

Append Base to superclass name

mx.charts.chartClasses.AxisBase


30/48

AS3 Class organization

Initial comment

Package definition

Imports Metadata

Event

Style Effect

Class or interface definition


31/48

AS3 Class organization

Static variables

Instance variables

public / public const

internal protected

private /private const

Constructor

Getters/setter variables and methods

Methods (grouped by functionality vs. scope)


32/48

Classes

Favor composition (HAS-A) over inheritance (IS-A )

Not a hard rule, use when appropriate


33/48

Interfaces

Defines contract for implementing classes

Enables runtime polymorphism

Advantages:

Classes can implement multiple interfaces

Classes cannot extend multiple classes

Leaves class open to extend another class


34/48

Interfaces

public interface ISearchService

{

function search( criteria:String ):void;

}

public class SearchService implements ISearchService

{

public function search( criteria:String ):void

{

}

}


35/48

Variables

Use meaningful and descriptive variable names:privatevar tmpHoldr;

One variable declaration per line of source code:var a = 1; var b = 2;

Always strongly type variables:privatevar users:ArrayCollection;

Separate each variable declaration with a blank line

Avoid the word object in identifiers:privatevar userObject;


36/48

Variables

Prefix Boolean variable names with can, is, or hasprivatevar isAuthenticated:Boolean;

Capitalize constants: DOMAIN, PORT, IP_ADDRESS

Prefix getter/setters with underscores and place thegetter method above the setter method

Use fully qualified classpaths for event types com.seantheflexguy.burrow.events.LoginEvent


37/48

Methods

Use meaningful and descriptive method names:privatefunction doIt():voidprivatefunction updateAfterEvent():void

Use blank lines in between method definitions

Group methods in a class by functionality vs. scope(related functions)

Include a verb in method names:

privatefunction validateUser():void

Use access modifiers for method definitions:

private, public, internal, protected


38/48

Methods

Specify types for method argumentsparseResults( rawXMLData:XML ):ArrayCollection

Always provide return type

even if it is void(returns nothing) or * (any type)

Use blank spaces to separate keywords from parentheses

if (isAuthenticated) {}

Do not use spaces to separate method names from parentheses

getResults ():void


39/48

MXML

XML Header

Root component (w/ namespaces)

Metadata

Event Style

Effect

Style definitions (external css file)

Scripts (only one Script block)

Non visual components

Visual components


40/48

MXML

Place the ID attribute as the first attribute for MXML elements

Group associated attributes together on one line


41/48

MXML

Indent nested MXML elements


42/48

CSS

- Comment styles

- Group similar definitions

- One declaration per line

.exitButton{fillAlphas: 0.76, 0.52, 0.75, 0.65;

fillColors: #009933, #009966, #00cc66, #009999;

color: #ffffff;textRollOverColor: #ffffff;

themeColor: #009966;

}

/**

*

* Defines style information for the Exit

* button control for the main UI.

*

*/


43/48

CSS

Avoid in-line CSS

Avoid naming class selectors based on appearanceUse lowerCamelCase for class selector names

Use class selectors instead of type selectors when possible.TitleWindow{}


44/48

ASDoc/**

*

* Use white space and leading asterisks increase comment readability

* Do not use special characters in ASDoc comments (Hoses up ASDoc tool!)

*

*/
- Use supported HTML to format the ASDoc output
@ - Comment text should always precede any @ tags

@private - Use @private for hiding classes from ASDoc@return - Use @return for methods with return types

@see - Use @see for items that have relationships


45/48

Unit testing


46/48

Unit Testing

Use standard OOP best practices in test cases

Encapsulation, inheritance, polymorphism, abstraction

Document the test code

Use clear and concise test method names

Write simple test case methods

Apply the too simple to break rule for your unit tests

Test complex methods and calculated properties not simple VOtype classes


47/48

Books


48/48

Books

Programming Flex 3

Head First Design Patterns

Pragmatic Programmer

Beautiful Code

Code Complete

Programming Pearls

Gang of Four (GOF) Design Patterns: Elements of Reusable Object-Oriented Software

The Productive Programmer

The Art of Interactive Design

The Design of Everyday Things

Dont Make Me Think

Date post:	05-Apr-2018
Category:	Documents
Upload:	meet2harpal123
View:	220 times
Download:	0 times

Sean Moore Flex Best Practices

Documents