Adobe
Products
Acrobat
Creative Cloud
Creative Suite
Digital Marketing Suite
Digital Publishing Suite
Elements
Photoshop
Touch Apps
Student and Teacher Editions
More products
Solutions
Creative tools for business
Digital marketing
Digital media
Education
Financial services
Government
Web Experience Management
More solutions
Learning Help Downloads Company
Buy
Home use for personal and home office
Education for students, educators, and staff
Business for small and medium businesses
Licensing programs for businesses, schools, and government
Special offers
Search
 
Info Sign in
Welcome,
My cart
My orders My Adobe
My Adobe
My orders
My information
My preferences
My products and services
Sign out
Why sign in? Sign in to manage your account and access trial downloads, product extensions, community areas, and more.
Adobe
Products Sections Buy   Search  
Solutions Company
Help Learning
Sign in Sign out My orders My Adobe
Preorder Estimated Availability Date. Your credit card will not be charged until the product is shipped. Estimated availability date is subject to change. Preorder Estimated Availability Date. Your credit card will not be charged until the product is ready to download. Estimated availability date is subject to change.
Qty:
Purchase requires verification of academic eligibility
Subtotal
Review and Checkout
Adobe Developer Connection / Flex Developer Center /

The Flex, Spring, and BlazeDS full stack – Part 1: Creating a Flex module

by Sébastien Arbogast

Sébastien Arbogast
  • http://sebastien-arbogast.com

Created

2 June 2008

Page tools

Share on Facebook
Share on Twitter
Share on LinkedIn
Bookmark
Print
BlazeDS Flex JBoss MySQL Tomcat

Requirements

Prerequisite knowledge

Prior experience working with Flex Builder to create applications is useful, but not required. Some knowledge of working with BlazeDS is also helpful.

User level

Intermediate

Required products

  • Flex Builder 3 (Download trial)
  • BlazeDS (Download trial)

Sample files

  • todolist1.zip (8 KB)

Additional Requirements

Spring

  • Download

In this three-part article series, I'll cover the step-by-step process to create an application with a Flex/BlazeDS/Spring/Hibernate/MySQL architecture, built with Maven. The application is a standard to-do list that allows you to add, delete, and edit tasks from a list.

I'd like to acknowledge my friend Velo from Brazil who developed flex-mojos, a Maven plug-in that allows communication with Maven to build Flex projects. Without Velo's help, this project would not be possible.

Before we move on to the real thing, just a few words of caution:

  1. The application that we are going to build in this tutorial is by no means a real-life application. It can certainly be improved and adapted but those improvements are left as an exercise because they are not related to what we really focus on here: communication between the Flex front-end and the Spring back-end.
  2. One of the main pieces of this project is the flex-mojos from Velo. There are other Flex building Maven plug-ins available, but at the time of this writing, none of them offer the configuration options needed to build this project. If you are interested in seeing official Maven support built into Flex, you can cast your vote.

Project scope

The objective of this article series is to build a to-do list application that provides functionality to create, modify, delete, and display task items in a Flex UI. Figure 1 shows the global architecture we will implement:

The technology stack of the sample to do list project
Figure 1. The technology stack of the sample to do list project

The most challenging part of the project is setting up the Maven build. This project could have been built with Ant, but I don't particularly enjoy writing Ant scripts. As for using an IDE to build projects, depending on a particular development environment is usually not a good idea because any serious project needs some degree of testing and continuous integration. Even though Maven is not perfect, I still see it as the best solution.

As for JBoss, it's not a requirement at all—it just happens to be what I'm using. If you prefer, you could use a simple Tomcat setup instead.

To see the finished version of this sample project, view the demo.

Creating a root Maven project

The first thing we have to address when creating a Flex/BlazeDS project with Maven is to determine the right location for configuration files. Both the Flex compiler and BlazeDS server-side libraries require XML configuration files that describe AMF channels, destinations, adapters and so on. These files are usually named remoting-config.xml and services-config.xml. In order to prevent duplicating those configuration files, it might be tempting to put everything into one single war-packaged Maven module. But after some consideration this brings up other issues: this monolithic project setup is not really compliant with Maven standards and mixing Flex and Java compilers in the same module is not optimal. For these reasons, I decided to split the client-side and the server-side into two modules with a root pom-packaged module. And to avoid duplicating configuration file, we'll create a third shared module.

With that out of the way, let's get started. If you haven't already, be sure to download the sample files. The instructions provided assume that you have already installed Maven, Java, MySQL, and JBoss or Tomcat. If you need help with installation and setup, visit the respective websites to learn more about the installation process.

First, let's create the root todolist module. Create an empty Maven project using the default archetype. To do this, open a command line in the directory where you want to create the project. Then, run the following command:

mvn -DgroupId=org.epseelon.samples -DartifactId=todolist archetype:create

The command above creates a basic JAR project that we will modify to serve as a root module. Here are the steps:

  1. Delete the "src" directory in the newly created module
  2. Edit pom.xml and change packaging to "pom" instead of "jar"
  3. Add the following repositories to the POM:
<project> … <repositories> <repository> <id>flex-mojos-repository</id> <url>http://flex-mojos.googlecode.com/svn/trunk/repository/</url> <releases> <enabled>true</enabled> </releases> <snapshots> <enabled>false</enabled> </snapshots> </repository> <repository> <id>epseelon-repository</id> <url>http://m2repo.epseelon.org/</url> <releases> <enabled>true</enabled> </releases> <snapshots> <enabled>false</enabled> </snapshots> </repository> </repositories> <pluginRepositories> <pluginRepository> <id>flex-mojos-repository</id> <url>http://flex-mojos.googlecode.com/svn/trunk/repository/</url> <releases> <enabled>true</enabled> </releases> <snapshots> <enabled>false</enabled> </snapshots> </pluginRepository> <pluginRepository> <id>epseelon-repository</id> <url>http://m2repo.epseelon.org/</url> <releases> <enabled>true</enabled> </releases> <snapshots> <enabled>false</enabled> </snapshots> </pluginRepository> </pluginRepositories> </project>

The first repository contains the flex-mojos created by Velo and the second one is my repository, where you can find BlazeDS libraries. At the time of this writing, BlazeDS libraries are not available in a public repository. But there is an issue you can vote for if you want it to happen.

It's a best practice to specify an explicit version for plug-ins, especially since we'll have submodules using maven-assembly-plugin and a maven-dependency-plugin. Add the following build section to the pom.xml file:

<build> <pluginManagement> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-dependency-plugin</artifactId> <version>2.0</version> </plugin> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-assembly-plugin</artifactId> <version>2.2-beta-2</version> </plugin> </plugins> </pluginManagement> </build>

Now that we've updated the pom.xml file, the next part involves building the Flex module. We'll work on that in the next section of this article.

Creating a Flex module

Building the Flex module is relatively straightforward. There are several Maven plug-ins designed to handle Flex-based projects, including ServeBox and Israfil. However, the last time I tested them, neither of these plug-ins was suitable to work with BlazeDS projects. I was therefore very excited to discover that Velo developed his own Maven plug-in named flex-mojos. And I have to say that he's done an excellent job, because it's working great, as you will see.

Before creating the Flex module, you need to open a command line in the todolist directory you've created above. Then, run the following command:

mvn archetype:create \ -DarchetypeArtifactId=maven-archetype-flex \ -DarchetypeVersion=1.0 \ -DarchetypeGroupId=dk.jacobve.maven.archetypes \ -DgroupId=org.epseelon.samples \ -DartifactId=todolist-ria \ -DpackageName=

This archetype creates a Flex project under the root module created above, but it uses israfil mojo by default. So once you've created your subproject, the next step is to replace the israfil plug-in configuration with the flex-mojos plug-in, as shown below:

<plugin> <groupId>info.rvin.mojo</groupId> <artifactId>flex-compiler-mojo</artifactId> <version>1.0-beta3</version> <extensions>true</extensions> <configuration> <locales> <param>en_US</param> </locales> </configuration> </plugin>

You can also delete the properties section, because flex-mojos uses its own version of the Flex compiler. Last but not least, add the following dependencies section to the POM:

<dependencies> <dependency> <groupId>com.adobe.flex.sdk</groupId> <artifactId>playerglobal</artifactId> <version>3.0.0.3.0.0.477</version> <type>swc</type> <scope>external</scope> </dependency> <dependency> <groupId>com.adobe.flex.sdk</groupId> <artifactId>flex</artifactId> <version>3.0.0.3.0.0.477</version> <type>swc</type> </dependency> <dependency> <groupId>com.adobe.flex.sdk</groupId> <artifactId>framework</artifactId> <version>3.0.0.3.0.0.477</version> <type>swc</type> </dependency> <dependency> <groupId>com.adobe.flex.sdk</groupId> <artifactId>framework</artifactId> <version>3.0.0.3.0.0.477</version> <type>resource-bundle</type> <classifier>en_US</classifier> </dependency> <dependency> <groupId>com.adobe.flex.sdk</groupId> <artifactId>rpc</artifactId> <version>3.0.0.3.0.0.477</version> <type>swc</type> </dependency> <dependency> <groupId>com.adobe.flex.sdk</groupId> <artifactId>rpc</artifactId> <version>3.0.0.3.0.0.477</version> <type>resource-bundle</type> <classifier>en_US</classifier> </dependency> <dependency> <groupId>com.adobe.flex.sdk</groupId> <artifactId>utilities</artifactId> <version>3.0.0.3.0.0.477</version> <type>swc</type> </dependency> </dependencies>

After making those modifications, run "mvn install" from the todolist directory. If everything is set up correctly, you'll be presented with a BUILD SUCCESSFUL message. You can now use Flash Player to view this SWF:

todolist/todolist-ria/target/todolist-ria-1.0-SNAPSHOT.swf

At this point we have set up the Flex compiler plug-in and it is working on a simple client-only application. In the next installment of this three-part article series, I'll describe the process to create the server module based on Spring and Hibernate.

Where to go from here

Read Part 2 of this article series to learn how to develop the server module and work towards completion of the to-do list sample project.

In the meantime, visit the Flex Developer Center to find the latest articles, sample projects, and tutorials. Also, see the Flex online documentation to get specific details about working with Flex to create applications.

And to learn more about working with Flex and BlazeDS, read this article: Collaborative data entry with Flex and BlazeDS.

Creative Commons License
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License

More Like This

  • Creating a basic CRUD application using Flex and PHP with Zend AMF
  • Building a data-driven Flex and Java application with WebORB for Java
  • DigiPri Widgets sales dashboard – Part 2: Setting up the server application
  • Using the Flash Builder database introspector with PHP
  • Adobe Flex, BlazeDS, and Hibernate JPA on Tomcat and MySQL — Part 1: Putting it all together in a simple demo application
  • Integrating a simple Flex search application with Grails
  • Integrating Flex with Seam using Flamingo
  • Flex, BlazeDS, and Hibernate JPA on Tomcat and MySQL – Part 2: Extending the demo to use linked database relations
  • The Flex, Spring and BlazeDS full stack – Part 2: Writing the to-do list server
  • The Flex, Spring and BlazeDS full stack – Part 3: Putting the application together

Tutorials & Samples

Tutorials

  • Flex mobile performance checklist
  • Flex and Maven with Flexmojos – Part 3: Journeyman
  • Migrating Flex 3 applications to Flex 4.5 – Part 4

Samples

  • Twitter Trends
  • Flex 4.5 reference applications
  • Mobile Trader Flex app on Android Market

Flex User Forum

More
07/25/2011 Flash Player Debug Issues - Safari 5.1 & Chrome 13
04/22/2012 Loader png - wrong color values in BitmapData
04/22/2012 HTTPService and crossdomain.xml doesn't work as expected
04/23/2012 Memory related crashes in Flex application

Flex Cookbook

More
04/06/2012 How to detect screen resize with a SkinnableComponent
02/29/2012 Embed Stage3D content inside Flex application components
02/15/2012 Custom WorkFlow Component
02/09/2012 Using Camera with a MediaContainer instead of VideoDisplay

Products

  • Acrobat
  • Creative Cloud
  • Creative Suite
  • Digital Marketing Suite
  • Digital Publishing Suite
  • Elements
  • Mobile Apps
  • Photoshop
  • Touch Apps
  • Student and Teacher Editions

Solutions

  • Digital marketing
  • Digital media
  • Web Experience Management

Industries

  • Education
  • Financial services
  • Government

Help

  • Product help centers
  • Orders and returns
  • Downloading and installing
  • My Adobe

Learning

  • Adobe Developer Connection
  • Adobe TV
  • Training and certification
  • Forums
  • Design Center

Ways to buy

  • For personal and home office
  • For students, educators, and staff
  • For small and medium businesses
  • For businesses, schools, and government
  • Special offers

Downloads

  • Adobe Reader
  • Adobe Flash Player
  • Adobe AIR
  • Adobe Shockwave Player

Company

  • News room
  • Partner programs
  • Corporate social responsibility
  • Career opportunities
  • Investor Relations
  • Events
  • Legal
  • Security
  • Contact Adobe
Choose your region United States (Change)
Choose your region Close

North America

Europe, Middle East and Africa

Asia Pacific

  • Canada - English
  • Canada - Français
  • Latinoamérica
  • México
  • United States

South America

  • Brasil
  • Africa - English
  • Österreich - Deutsch
  • Belgium - English
  • Belgique - Français
  • België - Nederlands
  • България
  • Hrvatska
  • Česká republika
  • Danmark
  • Eastern Europe - English
  • Eesti
  • Suomi
  • France
  • Deutschland
  • Magyarország
  • Ireland
  • Israel - English
  • ישראל - עברית
  • Italia
  • Latvija
  • Lietuva
  • Luxembourg - Deutsch
  • Luxembourg - English
  • Luxembourg - Français
  • الشرق الأوسط وشمال أفريقيا - اللغة العربية
  • Middle East and North Africa - English
  • Moyen-Orient et Afrique du Nord - Français
  • Nederland
  • Norge
  • Polska
  • Portugal
  • România
  • Россия
  • Srbija
  • Slovensko
  • Slovenija
  • España
  • Sverige
  • Schweiz - Deutsch
  • Suisse - Français
  • Svizzera - Italiano
  • Türkiye
  • Україна
  • United Kingdom
  • Australia
  • 中国
  • 中國香港特別行政區
  • Hong Kong S.A.R. of China
  • India - English
  • 日本
  • 한국
  • New Zealand
  • 台灣

Southeast Asia

  • Includes Indonesia, Malaysia, Philippines, Singapore, Thailand, and Vietnam - English

Copyright © 2012 Adobe Systems Incorporated. All rights reserved.

Terms of Use | Privacy Policy and Cookies (Updated)

Ad Choices

Reviewed by TRUSTe: site privacy statement