Flex For Java Architects Ledroff Breizh Jug V Blog Cc

Flex for Java Architects

Flex RIAs with BlazeDS, Spring et Hibernate

(built with Maven)(built with Maven)

François Le Droff

®

Copyright 2008 Adobe Systems Incorporated. All rights reserved.

http://www.droff.com

François Le Droff

®


François Le Droff

“Just another Java guy”

Ad b T h l d S i I iAdobe Technology and Service Innovation

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.comhttp://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 ?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 3ADOBE FLEX 3Action Script 3

MXML

Free, open source framework

Less time needed to develop

Expressive, highly interactive appsExpressive, highly interactive apps

X-platform, consistent deployment

®


Adobe Flex Builder 3

Eclipse pluginCode hinting, debugging

WYSIWYG Design view

Memoruy and performance profilers

SDK FB : Charting components advancedSDK FB : Charting components, advanced datagrid

Testing Support

®


Flex app development and deployment

Flex Builder IDE Browser

Flex SDKMXML ActionScript

Flash Player

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

CompileWeb Server

J2EE Application Server

LC Data ServicesXML/HTTPRESTSOAP Web Services

Existing Applications & Infrastructure

J2EE Application ServerSOAP Web Services

®


Flex Frameworks and Tools

From a Java perspectivep p

DevelopingF kFrameworksTestingB ildiBuilding

®


Flex Frameworks and Tools: Developing

Flex IDEsEclipse

FlexBuilderCode 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: PureMVCPureMVC

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 importedCairngorm – 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 netflicc: 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.orgswiz: http://code google com/p/swizframework

SpringActionScriptswiz: 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

AnvilAnvil

Mate

®



Lots of AS3 and Flex OS components

f l lLots of commercial Flex components

Flex Ecosystem is expanding very quickly

following a similar path to Enterprise Javafollowing a similar path to Enterprise Java

®


Flex Logging and Debugging

Similar to LOG4J,

Flex 3 includes a loggingFlex 3 includes a logging framework

to define custom Log targets.g g

ThunderBolt AS3 :

custom Flex log targetcustom 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

®


• try KapIT lab tools

Flex code generation and quality tools

Code GenerationXDoclet ActionScript PluginXDoclet : ActionScript Plugin

@actionscript.class

flex-annotations.aixcept.net annotations:@ActionScript@Cairngorm

Flex-mojos

JAXB

MDA (acceleo plugin made by AC)

…

Code Quality controlFlexPMD (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

FlexUnitVery similar to JUnit

Event test enabled

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

®


p g g p

Code Coverage – Flexcover - Custom Compiler Approach

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

®


Flex Frameworks and Tools: Testing

Functional TestingSelenium for FlashSelenium for Flash

Fluint, FlexMonkey, FunFX, …

Other commercial products based on Adobe’s Flex Automation API : pMercury QTP IBM Rational Functional TesterRIATest

Load and Stress TestingJMeter, OpenSTA, Grinder

Adobe’s Data Services Stress Testing Framework

Other commercial (Flex/AMF specific) products :Other commercial (Flex/AMF specific) products : NeoLoadWebLoad

®


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

M• Maven :• 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 buildAS3NCSShttp://localhost:9999/hudson/job/cairngorm/site/javancss.html

FlexPMDhttp://localhost:9999/hudson/job/cairngorm/12/pmdResult/

®


Flex Frameworks and Tools: ASDocs

®


LCDS&&

BlazeDSBlazeDS

®


Blaze DS Overview (source Xebia)

®


Blaze DS Overview : AMF (source Xebia)

®


Feature Comparison

Feature BlazeDS LiveCycle Data Services ES

Java Remoting √ √

b √ √Web Proxy √ √

JMS Adapter √ √

AJAX Client Libraries √ √

Administrative Console √ √Administrative Console √ √

Clustered Messaging √ √

Pub/Sub Messaging √ √

Web container-based messaging service (100’s of √ √Web container based messaging service (100 s of 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 √

®


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

l /f k b il f J d Flopen source tools/frameworks built on top of Java and Flex

®


By the way …

What is ?What is ?

®


What’s Maven again ? (very short definition)

A build tool

A dependency management tool

•

• A documentation and quality lreporting tool

®


What is Maven anyway ? (its architecture)

Pluginjar

Pluginflex mojos

Projects to build Maven Core flex-mojos

Plugin

to build

Pluginwar

Local machine Remote repository or local install

®


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

• Antlr • Ear • Javancss • Release• Ant• AntRun• AspectJ• Assembly

• Eclipse• Ejb• Ejb3• Exec

• Jboss• Jcoverage Jdepend• Jdiff• Jelly

• Repository• Resources• Repository• Sablecc

• Assembly-report• Cargo• Castor• Changelog

• Flex-mojos• Flex-annotations• Groovy• Help

y• Jetty• Jpox• Jspc• Jxr

• Site• Slimdog• Source• Surefire

• Changes• Commons-attributes• Checkstyle• Clean

• Hibernate2• Idea• Install• Issue

Jxr• MAnt• Native• One• Par

Surefire• Surefire-report• Taglist• Tomcat• Verifier

• Clover• Csharp• Cobertura• Compiler

• It• Jalopy• Jar• Javacc

Par• Plugin• Pmd• Project-info-reports• Rar

Verifier• Xslt• War• Wsdl2java• Xdocletp

• Deploy • Javadoc• Rar • Xdoclet

• 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.in order to provide a coherent view of software projects.

A Common project metadata formatPOM = Project Object Model = pom.xmlj j p

Contains metadata about the project

Location of directories, Developers/Contributors, Issue tracking system, Dependencies, Repositories to use etcRepositories to use, etc

®


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

A common directory organizationOur sample of 6 nested projects : /Our sample of 6 nested projects : • src/

– main/• java/• java/• flex/• resources/• webapp/

– test/• java/java/• flex/• resources/

– site/

®


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

generate-sources jsources

compile

test

mojo

mojo

plug-inspackage

integration-t t

mojo

user

e.g. mvn install

install

deploy

testmojo

mojobindingsg deploy

Well-known phases

g

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

®


p g g /p g g

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 repositoryNo more relative paths!Easy to share between teamsEasy to share between teams

Dependency managementTransitive dependency management

Ap y g

Snapshot handling

Multi-module built

B C

DEnvironment dependent builds based on profile

Project documentation site and report

D

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 madean original pattern or model from which all other things of the same kind are 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 youy g y

®


How do I integrate Flex,How do I integrate Flex, BlazeDS, and Spring ?

( h )(with Maven)

How do I write less codeHow do I write less code through maven archetypeflex annotation code generation and auto-wiring techniques?

®


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

f fIt helps you generate a multi-module maven project : a flex front-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 BlazeDSBlazeDS remoting SpringFactoryg p 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)With Maven (FlexMojos) Code generation through flex-annotation

FlexUnitFlexUnit

ASDoc, Dependency management, Quality control

®


Fna Demo– Project Generation and Build

Objectives

Generate a projectGenerate a project through a maven archetypeyp

Build, deploy and test (on jetty and hsqldb)(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 archetypehibernate-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 assemblyblazeds _service_config is a shared resource handled through maven assembly

®


Deploy and test your project (2mn)

• Go to the newly created project root

Launch the build :• Launch the build :• mvn install

• Go the java web application module root to deploy your web application on• 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 theFlex-N-Spring projectFlex N Spring projectArchitecture

®


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

AS

Ge MaS3 C

ode neration

aven build

Spring Auto Wiring Service

d

®


Auto Wiring Service

Cairngorm applied to Flex N Spring

Arthur Ford- [email protected]

Add a Contact Contact list

ToDoList

FrontControllerArthur

[email protected]

Ford [email protected]

Zaphod – [email protected]

Arthur – [email protected]

Tricia– [email protected]

Marvin = [email protected] a Contact

CMD CMD CMD

TodoListPModel+ saveItem

BusinessDelegate

TodoList

model.getTodoList

+ saveItem+ removeItem

Wir

ing

Serv

ice

Serv

ice

ToDoList

Spri

ng A

uto

CairngormE t

Serv

ice

Serv

ice

Serv

ice

Domain L Integration TierView Layer

Presentation Layer

Event

®


Layer Integration TierView Layer Layer

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 generationCode generationtechnique

®


VO Code Generation

The flex remoted objects are generated through flex-annotationsJust add to your java remoted object @ActionScript and @ActionScriptProperty annotationsJust 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

W iWrapping up …

®


Maven and Spring for Flex : Summary

This maven and spring integration approach allows you tocapitalize on your in-house Java/JEE/Maven/Spring expertise techniques and toolscapitalize on your in house Java/JEE/Maven/Spring expertise, techniques and tools

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 :Ti i t k t i iti t th j tTime consuming tasks to initiate the project :

set up the project (modules) structure organization

Write your build file, your somehow complex pom.xml files :y , y p pconfigure/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 archetypeYou still have to configure Eclipse (and FB) the « maven » way

®


Resources

®


Resources: Learning

FlexActionScript Developer Site- http://www.adobe.com/devnet/actionscript/

Flex Developer Site - http://www adobe com/devnet/flex/Flex Developer Site - 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/

BlazeDSBlaze DS - http://www adobe com/go/opensource blazedsBlaze DS 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 devguideLCDS ES Developer Guide - 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.htmlhttp://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

FrameworksCairngorm - http://opensource adobe com/wiki/display/cairngorm/CairngormCairngorm 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 andhttp://marceloverdijk.blogspot.com/2008/01/code-by-convention-with-flex-and-spring.html

®



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

Maven presentations : http://blogs.codehaus.org/people/vmassol/

Maven Flex plugins:

Fl j htt //d fl j i f /Flex-mojos http://docs.flex-mojos.info/

ServeBox http://www.servebox.com/foundry/doku.php?id=m2f2plugin

Israfil http://www.israfil.net/projects/mojo/maven-flex2-pluginp // /p j / j / p g

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/

Fl M j t t i lFlex-Mojo tutorial

The Flex, Spring and BlazeDS full stack

http://www.adobe.com/devnet/flex/articles/fullstack_pt3_print.html

®


p _p _p


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

Testing FlexUnit - http://opensource.adobe.com/wiki/display/flexunit/FlexUnitp // p / / p y/ /

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

ThunderBolt AS3 Console - http://code.google.com/p/flash-th d b lt/ iki/Th d B ltAS3C lthunderbolt/wiki/ThunderBoltAS3Console

LibrariesGoogle Code Lots of Flex libraries and frameworksGoogle 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/j g g

®


Questions ?

®


Flex For Java Architects Ledroff Breizh Jug V Blog Cc

Technology

Transcript of Flex For Java Architects Ledroff Breizh Jug V Blog Cc