41
Flex Tahirhussain

Flex Tahirhussain. Confidential | Copyright © Larsen & Toubro Infotech Ltd. 2 Contents 1. What is Flex 2. Why Flex

Embed Size (px)

Citation preview

Flex

• Tahirhussain

Confidential | Copyright © Larsen & Toubro Infotech Ltd. 2

Contents

1. What is Flex2. Why Flex

Why Flex

Flex 3 Beta 3 is open source under Mozilla Public License

Free SDK with command line compiler and debugger Support for AIR (formerly the Apollo project) UI Components are amazing!

– Excellent standard components– Open source libraries like flexlib are great

Large community of Flex developers Excellent documentation from Adobe

What is Flex

Group of technologies that produce SWF (Shockwave file) binaries, a.k.a Flash movies

– Tag based XML programming language: MXML– ActionScript 3.0 scripting language

– Flex Builder IDE– mxmlc compiler & debugger

Develop Rich Internet Applications, instead of traditional page based web applications

Direct manipulation (drag & drop) behavior Client side state management

What is Flex

Action ScriptMXML

Flex Class Library

Flex Runtime Services

J2EE Middleware

RDBMS

Presentation Tier

Business Tier

Integration Tier

Flex Architecture

How Flex Works

Confidential | Copyright © Larsen & Toubro Infotech Ltd. 8

Flex

Flex Software Development Kit (SDK)—The core component library, development languages, and compiler for Flex applications

Flex Builder IDE—An Eclipse-based development environment that includes code editors, visual layout tools, project management tools, and an integrated debugger.

Flex Data Services—A Java server-based application that enables high-performance data transfer, cross-tier data synchronization and conflict management, and real-time data messaging.

Flex Charting—A library of extensible charting components that enables rapid construction of data visualization applications

Confidential | Copyright © Larsen & Toubro Infotech Ltd. 9

LiveCycle Data Services Overview

Publish/Subscribe messaging infrastructure for building push and collaborative applications

Straightforward programming model for communicating with back-end systems

Automatic data synchronization

Offline synchronization for AIR applications

RIA to PDF document generation

LiveCycle document and process services integrations

LiveCycle Data Services ES

Data Management

RPC Services

Messaging

ServiceAdapters

Data Synchronization

Off-line Applications

Data Paging

Web Service

HTTP Service

Remote Object Service

Publish & Subscribe

Collaboration

Real Time Data Push

Proxy Service

Web-tier Compiler

Portal Deployment

RIA-PDF Generation

LiveCycle

SQL

Hibernate

ColdFusion

JMS

Java

Custom…

Confidential | Copyright © Larsen & Toubro Infotech Ltd. 10

Introducing Open Source BlazeDS

BlazeDS is the remoting and HTTP-based messaging technology which Adobe is contributing to the community under LGPL v3

Capabilities Easily connects Flex & AIR

applications to existing server logic High performance data transfer for

more responsive applications Real-time data push over standard

HTTP Full pub/sub messaging that

extends existing messaging infrastructure

Publication of the Action Message Format (AMF3) binary data protocol specification

Certified builds, warranty protection and enterprise support subscriptions available

BlazeDS

Data Management

RPC Services

Messaging

ServiceAdapters

Data Synchronization

Off-line Applications

Data Paging

Web Service

HTTP Service

Remote Object Service

Publish & Subscribe

Collaboration

Real Time Data Push

Proxy Service

Web-tier Compiler

Portal Deployment

RIA-PDF Generation

LiveCycle

SQL

Hibernate

ColdFusion

JMS

Java

Custom…

How Flex Works

Confidential | Copyright © Larsen & Toubro Infotech Ltd. 12

Flex Struts Integration

Approach 1: Add Flex on top of existing Struts app as is.

UserMachine

J2EEApplicationServer

Browser

Action Class

Struts Action Servlet

Applicationreguest

HTML With Flash Player

JSPJSP

Action Mapping

POJO / EJB

Form

Flex Data Services

Data request(HTTPService)

Data response - XML

Confidential | Copyright © Larsen & Toubro Infotech Ltd. 13

Flex Struts Integration

Do we really need the request-form maze of Struts

UserMachine

J2EEApplicationServer

Browser

Action Class

Struts Action Servlet

Applicationreguest

Action Mapping

POJO / EJB

Flex Data Services

Data request:Typed Beans

Data response:Typed Beans

Flex Data ServicesRemote POJO

(Façade) JSPJSP

HTML With Flash Player

Confidential | Copyright © Larsen & Toubro Infotech Ltd. 14

Flex Struts Integration

As RIA handles UI navigation on the client, the entire notion of Flow-based Web frameworks becomes obsolete.

UserMachine

J2EEApplicationServer

Browser

Action Class

Struts Action Servlet

Applicationreguest

Flex Data Services

Data request:Typed beans

Data response:Typed beans

Flex Data Services Remote POJO(Façade)

POJO / EJB

JSPJSP

HTML With Flash Player

Flex Data Services

Flex currently supports three types of data communications with external sources:– XML via HTTP Requests– SOAP Web-Services– AMF / Remote Objects

With this combination, one can virtually talk to any back-end server

HTTP Service

The HTTPService MXML tag allows for the most basic communication level between Flex and a web server– Mostly used for legacy middleware applications and static XML

documents– Any application that can generate proper XML on the fly can talk

to the Flex app using this tag

Common Parameters– id : Used to name the component– url : The full URL of the component– result : The even function that will be fired when the result came

back successfully• The XML document will be stored in the event.result

object– fault : The event function that will be fired when the result did

not come back correctly

HTTPService

How it is used:– Place the HTTPService tag at the application or component

level (root level) of the MXML document

Web-Services

SOAP or Web-Services can easily be called using the <mx:WebService> component

Web Services allow to communicated data back to the web-server, and retrieve typed objects (strings, numbers, arrays, queries)

As it is XML based, it is very verbose and often slow for large sets of data.

Common Parameters– id : Used to name the object– wsdl : Points to the WSDL file– showBusyCursor : Changes the current pointer to a

rotating clock to let the user know something is happening

Web Services

Passing parameters:– One can pass parameters to web-services by naming operations

(methods or functions).– The operation tag allows for result or fault functions– Web Services are case sensitive so make sure that the parameters

match case

AMF

AMF or Remote Objects are the most efficient way to transmit data between the application server and Flex aap– Data is transmitted in Binary, so it is fairly compressed– Objects will stay in their native form when transmitted

Very easy to use

What is needed– A service-config.xml for the environment– Modify the destination section and channels as per the

need

AMF

Service-config.xml– This file is compiled into the project and will convert the

“detination” portion of the RemoteObject call to the tcp/ip hostname and port numbers

– Depending on how this file looks, the application can be very portable, or not portable at all.

AMF

Service-config.xml

AMF

How it is used– Destination : Destination from the service-config.xml

Advanced Communication

By customizing the services-config.xml file, we can also enable some advanced communication– By using the <mx:Producer> and <mx:Consumer> tags,

we can “produce” content to other applications– This allows for many-to-one or many-to-many

applications with little or no work

Messaging Code

Declare <producer> and <consumer>:

Publish message with producer:

Receive message with consumet:

Flex Advantages

Rich development environment Single runtime environment Optimized client/server integration Disconnected mode support Data management infrastructure Build-in support for real time messaging

ActionScript 3.0

ECMA-4 compliant Object oriented

– Packages– Classes– Inheritance– Interfaces

Strong and weak typing Online API

– http://livedocs.adobe.com/flex/201/langref/index.html

Compilation

mxmlc compiler 1. Stage one

1.Parse MXML into ActionScript classes2.Compile ActionScript into bytecode3.Insert bytecode into a binary SWF file

2. Stage two (just-in-time compilation)

1.Flash Players contain an ActionScript Virtual Machine (AVM). At runtime, the AVM turns the bytecode into machine language code that the particular OS can interpret.

Compilation

Compilation can be done from:– Command line– Ant script– Flex Builder IDE– Web compiler (part of LiveCycle Data Services ES)

• Like JSP compilation model, pages are compiled when first requested, then cached

mxmlc --show-actionscript-warnings=true c:/myDir/firstProgram.mxml

Build Tools

Free SDK includes:– mxmlc command line compiler– Debugger– Component class library– Documentation

Flex Builder 3.0 (Beta) includes: – Eclipse based IDE– SDK– Debugger– Design view– Flex Builder 2 is $250, no pricing on latest version

yet

Data

HTTP session is unnecessary! As Flex creates an RIA, you keep state on the client.– Asychronous

• Remote object invocation (access Java POJO)• Web service• HTTP GET/POST

– Callback required to give client the response data– User can continue working while request is processed

HTTPService (make GET & POST requests)– <mx:HTTPService id="srv" url=“some.jsp"/>

WebService (access a web service)– <mx:WebService id="srv" wsdl="http://somesite.org/services?

wsdl" showBusyCursor="true"/>

Data Exchange Protocols : SOAP

SOAP?– You can use it, but passing XML is not as efficient as

using binary exchange. Adobe claims it is 10 times slower. http://labs.adobe.com/technologies/blazeds/

Data exchange protocols: AMF

Action Media Format (AMF) data protocol– Binary data exchange over HTTP– Default protocol behind <mx:RemoteObject>, which is

used to access data using remote object invocation– Now open source!

• Goal is to provide AMF for all platforms

Remote Object Invocation

Add Java classes to Flex app classpath– WEB-INF/classes– WEB-INF/lib

Integrates with J2EE security Class by class exposure to Flex via deployment

descriptors <mx:remoteObject>

– Asynchronous method call– Callback ‘handler’– Fault-handling

Remote Object Invocation

Example– <mx:RemoteObject id=“myRO” destination=“myService"

fault=“fault(arg)"result=“result(arg)" />

– Fault handling is done by callback handler fault(arg), where ‘arg’ is the error. It can handle Java exceptions and network failures.

– Successful results are processed by callback handler result(arg)

remoting-config.xml– <destination id=“myService">

<properties><source>com.me.myService</source><scope>application</scope>

</properties></destination>

Blaze DS

What provides access to Java objects?– Blaze DS

• Taken from LiveCycle Data Services ES, the final release will be open source under the LGPL v3 license

• Release Candidate became available 2.1.08• Offers remoting and messaging capabilities

– LiveCycle Data Services ES

• Rather expensive…• Provides remoting and messaging capabilities,

data synchronization between client and server, publish/subscribe messaging, and PDF creation

Flex vs. Flash

Flash is a great tool for developing videos, animations, or any small application that is well suited to be developed on a timeline, or by layering visual elements

Flash requires the $700 IDE Flex is a web application developer’s approach to

creating web applications Flex development can be free

Feature area Blaze DSLiveCycle Data Services

Community EditionLiveCycle Data Services

ES

License Open source Open source Commercial

RPC services yes yes yes

Messaging yes yes yes

Clustered messaging yes yes yes

Pub/sub messaging yes yes yes

Web container–based messaging services (hundreds of clients per CPU) yes yes yes

Non Blocking IO (NIO) based messaging (thousands of clients per CPU) no no yes

Per-client Quality Of Service (QOS) no no yes

Data management no no yes

RIA-to-PDF file generation no no yes

Offline synchronization Support no no yes

WSRP portal integration no no yes

Platinum maintenance and support no no yes

Gold and Bronze maintenance and support no yes yes

Choose LiveCycle Data Services ES if you need:

High-performance data streaming, paging, and data synchronization

Reduced development and maintenance costs for complex database applications

Offline support for Adobe AIR Integration with portals LiveCycle connectivity to integrate

RIAs with business processes and document services

Advanced deployment options for maximum scalability

Access to enterprise support resources to help you run business-critical applications

Choose BlazeDS if you need Ease of integration with

existing Java™ code High-performance data

delivery and transfer Publish/subscribe and push

messaging over standard HTTP

Choose LiveCycle Data Services Community Edition if you need:

BlazeDS functionality with platform certification and the latest security and bug patches

Access to enterprise support resources to help you run business-critical applications

Confidential | Copyright © Larsen & Toubro Infotech Ltd.

Our Business Knowledge

Your Winning Edge

Thank you for your interest and time