Flex For Java Architects Ledroff Breizh Jug V Blog Cc

Flex for Java Architects

Flex RIAs with BlazeDS, Spring et Hibernate
(built with Maven)

François Le Droff
http://www.droff.com
®

Copyright 2008 Adobe Systems Incorporated. All rights reserved.

François Le Droff

®


François Le Droff

“Just another Java guy”
Adobe Technology and Service Innovation
Ad b T h l dS i I i
10 years in IT web 1+n.0)
OSS geek :
OS projects : qsos, xradar , fna,
Member of ossgtp, ParisJUG, ParisJBUG
Speaker at MAX, et Solution Linux
blogs :
http://www.droff.com
http://blogs.adobe.com/francoisledroff/
p g

®


What about you?

Java !
Spring, JEE ?
ORM (JPA, EJB, iBatis, Hibernate) ?
UnitTest (JUnit, TestNG, …) ?
Ant and/or Maven ?
Hudson, CC ?

Flex ?
ActionScript MXML
Flex Remoting, AMF
e e ot g,
And may be
BlazeDS, LCDS
FlexUnit
Cairngorm

®


Adobe “Innovating on both sides of the glass”

®


“In front of the glass” Flex !
“Behind the glass” Java !

®


The RIA leader technology: Adobe Flex 3

ADOBE FLEX 3
Action Script 3
MXML

Free, open source framework
Less time needed to develop
Expressive, highly interactive apps
X-platform, consistent deployment

®


Adobe Flex Builder 3

Eclipse plugin
Code hinting, debugging
WYSIWYG Design view
Memoruy and performance profilers
SDK FB : Charting components advanced
components,
datagrid
Testing Support

®


Flex app development and deployment

Flex Builder IDE Browser
Flex SDK Flash Player
MXML ActionScript

Flex Class Library SOAP HTTP/S AMF/S RTMP/S

Web Server
Compile
XML/HTTP
LC Data Services
REST
SOAP Web Services J2EE Application Server

Existing Applications & Infrastructure

®


Flex Frameworks and Tools

From a Java perspective
pp

Developing
Frameworks
F k
Testing
Building
B ildi

®


Flex Frameworks and Tools: Developing

Flex IDEs
Eclipse
FlexBuilder
Code completion, refactoring, graphical UI editing, profiling
Enterprise Factory IDE
Peter Martin’s Cairngorm plug-in (soon)

IDEA IntelliJ
Netbeans Plugin ?
g
vi, emacs

®


Flex Frameworks and libraries

MVC frameworks:
PureMVC
Cairngorm micro-architecture

There are two libraries you can use to create your Cairngorm projects
Cairngorm – This is the main Cairngorm library that must always be imported
Cairngorm Enterprise - This is an optional library that must be used if you are
using LCDS
Cairngorm Enterprise was created to remove Cairngorm’s Dependency on LCDS
EnterpriseServiceLocator provides support for LCDS Producer and Consumer

®



Inversion of Control (IoC) Container :
flicc: http://flicc sourceforge net
http://flicc.sourceforge.net
parsley: http://www.spicefactory.org/parsley
smarty pants: http://code.google.com/p/smartypants-ioc
LowRA: http://osflash.org/projects/lowra

prana: http://www.pranaframework.org SpringActionScript
swiz: http://code google com/p/swizframework
http://code.google.com/p/swizframework
vegas: http://code.google.com/p/vegas
fling: http://fling.riaforge.org
flex-ioc: http://code.google.com/p/flex-ioc

Many others interesting initiatives on top of flex frameworks
Anvil
Mate

®



Lots of AS3 and Flex OS components
Lots of commercial Flex components
f ll

Flex Ecosystem is expanding very quickly
following a similar path to Enterprise Java

®


Flex Logging and Debugging

Similar to LOG4J,
Flex 3 includes a logging
framework
to define custom Log targets.
gg
ThunderBolt AS3 :
custom Flex log target
log to Firebug in Firefox or to a
stand alone AIR console.

Many tools to inspect the component at runtime
•

try KapIT lab tools
•

®


Flex code generation and quality tools

Code Generation
XDoclet : ActionScript Plugin
@actionscript.class
flex-annotations.aixcept.net annotations:
@ActionScript
@Cairngorm
Flex-mojos
JAXB
MDA (acceleo plugin made by AC)
…

Code Quality control
FlexPMD (work in progress engaged by AC)
AS3NCSS (work in progress engaged by AC)

®


Flex Frameworks and Tools: UnitTesting

FlexUnit : http://opensource.adobe.com/wiki/display/flexunit/FlexUnit

®


Flex Frameworks and Tools: Unit Testing

FlexUnit
Very similar to JUnit

Event test enabled

Fluint : http://code.google.com/p/fluint/
p gg p

®


Code Coverage – Flexcover - Custom Compiler Approach

http://code.google.com/p/flexcover

®


Flex Frameworks and Tools: Testing

Functional Testing
Selenium for Flash
Fluint, FlexMonkey, FunFX, …
Other commercial products based on Adobe’s Flex Automation API :
p
Mercury QTP
IBM Rational Functional Tester
RIATest

Load and Stress Testing
JMeter, OpenSTA, Grinder
Adobe’s Data Services Stress Testing Framework
Other commercial (Flex/AMF specific) products :
NeoLoad
WebLoad

®


Mock Frameworks

mock-as3: http://code.google.com/p/mock-as3
Used by Adobe Consulting
Mock4AS: http://code.google.com/p/mock4as

®


Flex Frameworks and Tools: Building

Ant :
FlexAntTasks
Ant : Antennae

Maven :
M
•
Flex-mojos
•
Alternatives :
•
• ServeBox
• and Israfil

Archetypes
•

®


Managing Dependencies

Maven (or Ant + Ivy)

Demo : http://localhost:9999/hudson/job/cairngormenterprise/site/dependencies.html

®


Flex Frameworks and Tools: UnitTest within your Build

FlexUnit within your build

Maven

®


Flex Frameworks and Tools: Building and CC

Quality within your build : CC

Demo : http://localhost:9999/hudson/

®


Flex Frameworks and Tools: Building : Quality

Quality Reports within your build
AS3NCSS
http://localhost:9999/hudson/job/cairngorm/site/javancss.html

FlexPMD
http://localhost:9999/hudson/job/cairngorm/12/pmdResult/

®


Flex Frameworks and Tools: ASDocs

®


LCDS
&
BlazeDS

®


Blaze DS Overview (source Xebia)

®


Blaze DS Overview : AMF (source Xebia)

®


Feature Comparison

BlazeDS LiveCycle Data Services ES
Feature

√ √
Java Remoting

√ √
Web Proxy
b

√ √
JMS Adapter

√ √
AJAX Client Libraries

√ √
Administrative Console

√ √
Clustered Messaging

√ √
Pub/Sub Messaging

Web container based messaging service (100 s of
container-based (100’s
√ √
clients/CPU)

√
Dedicated messaging service (1000’s of clients/CPU)

√
Per-client Quality of Service

√
Data Management Service

√
Data Paging

√
Flex-LiveCycle Integration

√
RIA-to-PDF Generation

√
Offline Data Synchronization (AIR)

√
WSRP/Portal Integration

√
SiteMinder Integration

®

32

Fna !

http://code.google.com/p/fna/

Fna is a set of samples, mavenized flex open source contributions (cf.
flex-contrib-spring and event-source) and maven archetypes that uses
open source tools/frameworks b il on top of J
l /f k built f Java and Fl
d Flex

®


By the way …

What is ?

®


What’s Maven again ? (very short definition)

A build tool

•
A dependency management tool A documentation and quality
•
reporting tool
l

®


What is Maven anyway ? (its architecture)

Plugin
jar

Projects Plugin
Maven Core
to build flex-mojos
flex mojos

Plugin
war

Local machine Remote repository or local install

®


What is Maven anyway ? (its plug-ins, a few of them…)

• Antlr • Ear • Javancss • Release
• Ant • Eclipse • Jboss • Repository
• AntRun • Ejb • Jcoverage Jdepend • Resources
• AspectJ • Ejb3 • Jdiff • Repository
• Assembly • Exec • Jelly
y • Sablecc
• Assembly-report • Flex-mojos • Jetty • Site
• Cargo • Flex-annotations • Jpox • Slimdog
• Castor • Groovy • Jspc • Source
• Changelog • Help • Jxr • Surefire
• Changes • Hibernate2 • MAnt • Surefire-report
• Commons-attributes • Idea • Native • Taglist
• Checkstyle • Install • One • Tomcat
• Clean • Issue • Par • Verifier
• Clover • It • Plugin • Xslt
• Csharp • Jalopy • Pmd • War
• Cobertura • Jar • Project-info-reports • Wsdl2java
• Compiler
p • Javacc • Rar • Xdoclet
• Deploy • Javadoc • Xmlbeans
• XRadar

®


What is Maven anyway ? (a common project format and organization)

Maven is really a process of applying patterns to a build infrastructure
in order to provide a coherent view of software projects.
A Common project metadata format
POM = Project Object Model = pom.xml
j j p
Contains metadata about the project
Location of directories, Developers/Contributors, Issue tracking system, Dependencies,
Repositories to use etc
use,

®


What is Maven anyway ? (a common project format and organization)

A common directory organization
Our sample of 6 nested projects :
• src/
/
– main/
• java/
• flex/
• resources/
• webapp/
– test/
• java/
• flex/
• resources/
– site/

®


What is Maven anyway ? (a common way to build application)

generate-
sources mojo
j
compile
mojo
test
mojo
plug-ins
package
integration-
test
tt
mojo
user install
mojo
e.g. mvn install
g bindings
g
deploy

Well-known phases

The lifecycle depends on the project type (packaging)
Defined in pom.xml (pom, jar, ear, war, etc)
Ex: <packaging>swc</packaging>
p gg /p gg

®


What is Maven anyway ? (it’s even much more)

Artifact repository :
Used to store all kind of artifacts
SWCs, SWFs, JARs, EARs, WARs, EJBs, ZIPs, plugins, …
All project interactions go through the repository
No more relative paths!
Easy to share between teams

A
Dependency management
Transitive dependency management
p y g
Snapshot handling B C
Multi-module built
D
Environment dependent builds based on profile

Project documentation site and report
j

Project templating through archetype

®


Maven : Archetypes

Archetype is a Maven project templating toolkit.
an original pattern or model from which all other things of the same kind are made.
made
provides a great way to enable developers quickly in a way consistent with best practices
employed by your project or organization

http://maven.apache.org/plugins/maven-archetype-plugin/index.html

®


Fna flex-library-archetype-archetype Demo

mvn archetype:generate -DarchetypeVersion=1.3-SNAPSHOT
-DarchetypeGroupId=com.adobe.ac
-DarchetypeArtifactId=flex-library-archetype
-DarchetypeRepository=http://fna.googlecode.com/svn/trunk/fna/fna_m2_repository/
DarchetypeRepository=http://fna googlecode com/svn/trunk/fna/fna m2 repository/

®


flex-library-archetype-archetype : FlexBuilder support

Import your generated project into eclipse
The eclipse and FB are already generated for you
yg y

®


How do I integrate Flex,
BlazeDS, and Spring ?

(with
( h Maven)
)
How do I write less code
through maven archetype
flex annotation code generation
and auto-wiring techniques?

®


I use Fna Blazeds-autowired-spring-hibernate-archetype

It helps you generate a multi-module maven project : a f front-
flex f
end application communicating with the backend through Adobe's
BlazeDS
It showcases lots of tips and tricks on BlazeDS, Spring Integration

®


Spring / BlazeDS / LCDS

Spring (Hibernate JPA) with Flex through BlazeDS
BlazeDS remoting SpringFactory
gp g y
Auto-wired spring service bean into BlazeDS remoting

NB: Recent fna non-related news on spring :
http://www.springsource.org/spring-flex
http://blog.springsource.com/2008/12/17/using-spring-blazeds-integration-m1/
http://coenraets.org/blog/2009/01/new-springblazeds-integration-test-drive/

®


Maven and Flex

Spring BlazeDS Flex application
With Maven (FlexMojos)
Code generation through flex-annotation
FlexUnit
ASDoc, Dependency management, Quality control

®


Fna Demo– Project Generation and Build

Objectives

Generate a project
through a maven
archetype
yp
Build, deploy and test
(on jetty and hsqldb)

®


Generate and Build your project (2mn)

mvn archetype:generate -DarchetypeVersion=1.3-SNAPSHOT -
•
DarchetypeGroupId=com.adobe.ac -DarchetypeArtifactId=blazeds-autowired-spring-
hibernate-archetype
hibernate archetype -
DarchetypeRepository=http://fna.googlecode.com/svn/trunk/fna/fna_m2_repository/

®


A Maven multi-module project approach

Discover your « mavenized » Flex BlazeDS Spring project, its modules :

java_* are plain old maven java projects
flex_* are flex-mojos project
blazeds _service_config is a shared resource handled through maven assembly
service config

®


Deploy and test your project (2mn)

Go to the newly created project root
•

Launch the build :
•
mvn install
•

Go the java web application module root to deploy your web application on
•
a jetty instance :
mvn jetty:run
•

®


Deploy and test your project (2mn)

http://localhost:8080/fna_java_webapp/
•

®


Review the
Flex N Spring
Flex-N-Spring project
Architecture

®


A Flex application auto-wired to a BlazeDS/Spring back-end
Generation
AS Code

Ma
S3

aven build
d
Spring
Auto Wiring Service
®


Cairngorm applied to Flex N Spring

ToDoList

Add a Contact Contact list
FrontController
Arthur Ford
Ford- ford@perfect.com
Zaphod – zaphod@email.com
Arthur – arthur@dent.com
arthur@dent.com
Tricia– tricia@mcmillan.com
CMD CMD CMD
Marvin = marvin@email.com
Add a Contact

Business
Delegate
model.getTodoList
TodoList
TodoListPModel
+ saveItem
+ removeItem ToDoList

Service

Service
Spring Auto Wiring

Service

Service

Service
Cairngorm
Event
E t

Presentation Domain
Layer Integration Tier
View Layer Layer
L

®


A few magic details : Spring AutoWiring

With a simple SpringFactory (and/or JavaAdapter) approach, you need to
configure each new Java remote object service in remoting-config.xml.
g j g g
@RemotingDestination (JDK5 annotation) allows you to autowire Spring
beans directly into BlazeDS.

®


A few magic details : Spring AutoWiring

The SpringAutowiringBootstrapService checks all @RemotingDestination
annotated classes
registers them within BlazeDS at runtime.
dynamically creates the Spring Factory.

®


Code generation
technique

®


VO Code Generation

The flex remoted objects are generated through flex-annotations
Just add to your java remoted object @ActionScript and @ActionScriptProperty annotations

®


VO Code Generation

Add the flex-annotations factory to your maven build

®


Maven (and Spring) for Flex

Wrapping up …
W i

®


Maven and Spring for Flex : Summary

This maven and spring integration approach allows you to
capitalize on your in-house Java/JEE/Maven/Spring expertise techniques and tools
in house expertise,
write less code (Most of the integration plumbing is generated)
rely on a efficient build (continuous integration, test, dependencies and quality checks,
documentation, release)

The price to enter :
Time consuming t k t i iti t th project :
Ti i tasks to initiate the jt
set up the project (modules) structure organization
Write your build file, your somehow complex pom.xml files :
y ,y pp
configure/identify the classpath , project dependencies, maven plugins
configure the code generation and autowiring tools

The Solution: eliminate the ramp-up time by using fna maven archetype
You still have to configure Eclipse (and FB) the « maven » way

®


Resources

®


Resources: Learning

Flex
ActionScript Developer Site- http://www.adobe.com/devnet/actionscript/
Flex Developer Site - http://www adobe com/devnet/flex/
http://www.adobe.com/devnet/flex/
Flex Development Guide - http://learn.adobe.com/wiki/display/Flex/Getting+Started
Flex 3 Language Reference – http://livedocs.adobe.com/flex/3/langref/
LiveCycle Data Services ES - http://www.adobe.com/products/livecycle/dataservices/

BlazeDS
Blaze DS - http://www adobe com/go/opensource blazeds
http://www.adobe.com/go/opensource_blazeds
Blaze DS Developer Guide - http://livedocs.adobe.com/blazeds/1/blazeds_devguide
Blaze DS Javadoc - http://livedocs.adobe.com/blazeds/1/javadoc/

Adobe Labs - http://labs.adobe.com/

®


Resources: Learning

LiveCycle Data Services ES

LiveCycle Data Services ES -
http://www.adobe.com/products/livecycle/dataservices/
LCDS ES Developer Guide - http://www adobe com/go/lcds26 devguide
http://www.adobe.com/go/lcds26_devguide
LCDS ES Javadoc -
http://livedocs.adobe.com/livecycle/8.2/programLC/programmer/javadoc/index.
html
LiveCycle Data Services ES Language Reference -
http://livedocs.adobe.com/livecycle/8.2/programLC/common/langref/index.html
LCDS ES Stress Testing Framework -
http://labs.adobe.com/wiki/index.php/Flex_Stress_Testing_Framework

®


Resources: Frameworks and Tools

Frameworks
Cairngorm - http://opensource adobe com/wiki/display/cairngorm/Cairngorm
http://opensource.adobe.com/wiki/display/cairngorm/Cairngorm
PureMVC – http://puremvc.org
Prana - http://www.pranaframework.org

Code Generation:
Flex-annotations http://flex-annotations.aixcept.net/
XDoclet ActionScript plugin http://xdoclet.codehaus.org/Actionscript+plugin
Acceleo http://www.acceleo.org/pages/accueil/en

Spring flex integration projects
@RemotingDestination annotation :
http://marceloverdijk.blogspot.com/2008/01/code-by-convention-with-flex-and-
http://marceloverdijk blogspot com/2008/01/code by convention with flex and
spring.html

®



Building Maven
Maven archetype: http://maven.apache.org/plugins/maven-archetype-plugin/index.html
Maven presentations : http://blogs.codehaus.org/people/vmassol/
Maven Flex plugins:
Flex-mojos htt //d
Fl j http://docs.flex-mojos.info/
fl j if/
ServeBox http://www.servebox.com/foundry/doku.php?id=m2f2plugin
Israfil http://www.israfil.net/projects/mojo/maven-flex2-plugin
p // /p j / j/ pg
Maven Flex (flex-mojos) archetypes:
http://code.google.com/p/fna/
http://blogs.adobe.com/francoisledroff/
http://code.google.com/p/maven-blazeds-spring-archetype/
Flex-Mojo tutorial
Fl M j t t i l
The Flex, Spring and BlazeDS full stack
http://www.adobe.com/devnet/flex/articles/fullstack_pt3_print.html
p _p _p

®



Building Ant
Antennae - http://code google com/p/antennae/
http://code.google.com/p/antennae/

Testing
FlexUnit - http://opensource.adobe.com/wiki/display/flexunit/FlexUnit
p // p / / p y/ /
Flexcover - http://code.google.com/p/flexcover/
ThunderBolt AS3 Console - http://code.google.com/p/flash-
thunderbolt/wiki/ThunderBoltAS3Console
th d b lt/ iki/Th d B ltAS3C l

Libraries
Google Code – Lots of Flex libraries and frameworks
Flex.org - http://flex.org/software/components

®


References : Creative Commons and other open source graphics
and photos remixed here

http://commons.wikimedia.org/wiki/Image:Netbeans-Duke.png
https://duke.dev.java.net/images/comfyChair/index.html
http://flickr.com/photos/nicozz/1107511223/
http://flickr.com/photos/flattop341/1085739925/
http://flickr com/photos/flattop341/1085739925/
http://blog.xebia.fr/2008/09/16/blazeds/
http://www.breizhjug.org/
jg g

®


Questions ?

®


Flex For Java Architects Ledroff Breizh Jug V Blog Cc

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (6)

Similar to Flex For Java Architects Ledroff Breizh Jug V Blog Cc

Similar to Flex For Java Architects Ledroff Breizh Jug V Blog Cc (20)

More from François Le Droff

More from François Le Droff (12)

Recently uploaded

Recently uploaded (20)

Flex For Java Architects Ledroff Breizh Jug V Blog Cc