Introduction to Adobe Flex - Zaloni
-
Upload
joseph-khan -
Category
Technology
-
view
1.654 -
download
3
description
Transcript of Introduction to Adobe Flex - Zaloni
Adobe Flex
Who am I ?
Joseph Khan
•Senior Software Engineer•Flex, HTML5, Sencha Touch•3.6 yrs of experience
Joseph Khan
•Senior Software Engineer•Flex, HTML5, Sencha Touch•3.6 yrs of experience
3
Who are you?
• Have a little idea on Web based applications
• Eager to learn a new THING !
Who are you ?
4
Road Map
What does Rich Internet Application means ?
Anatomy of a Rich Internet Application
What is Flex ?
Flex v/s Flash and Flex v/s Ajax
Talk more on Flex…..
Live demo
Inspiration
5
Client/Server
Mainframe
Web Applicatio
ns
Reach
Local
Global
Rich
Text UI
1992
1998
2005+
Rich InternetApplicati
ons
Application Evolution
6
A Rich Internet Application (RIA) is an application that runs in the traditional browser, but utilizes an intermediate layer that can bypass the traditional page refresh that has been a standard of most current Web applications.
Desktopification of the browser based applications
Most common tools –
Asynchronous JavaScript and XML (AJAX) WPF (.NET framework) Flex or Flash using the Flash Player
A Rich Internet Application (RIA) is an application that runs in the traditional browser, but utilizes an intermediate layer that can bypass the traditional page refresh that has been a standard of most current Web applications.
Desktopification of the browser based applications
Most common tools –
Asynchronous JavaScript and XML (AJAX) WPF (.NET framework) Flex or Flash using the Flash Player
RIA – Rich Internet Application
Data Visualizatio
n & Collaboratio
nReal Time Data
Push & Alerting
Chat
Offline
Data Synchroniza
tion & Conflict
Resolution
Bi-Directional
Audio & Video
Rich Data Entry
Menus & Navigation Controls
Resizable Views/Effects/
Transitions
Mapping, Geo-Coding, Annotations
& White boarding
Anatomy of a Rich Internet Application
What is Flex?
What is Flex? •It is a free, open source framework based on the Adobe Flash Runtime used to develop RIAs (rich Internet applications)
RIAs - new kind of web experience that offer the ease of use/experience of a desktop application while providing the broad reach of web applications
•Flex application framework consists of MXML, ActionScript™ 3 (AS3), and the Flex class library.
•Developers use MXML to declaratively define the application user interface elements and use ActionScript for client logic and procedural control.
Expressiveness
Rich Media
Performance
Real Time
Desktop and Offline
• Client-side, deployed as Flash .swf• Flex Framework
– MXML (Macromedia XML)• Declarative language to define
User Interface• Similar to XHTML
– User Interface Components• Buttons, ComboBoxes, Layout
Managers, Containers, Effects– Class Libraries
• Everything in the mx.* packages
• Validation Routines, Web Services, DataTypes
What is Flex?
History
Library
SWF
Compiled object, No special server required, Runs on Flash Player, Cross Browser compatible
Flex Compiler
AS3 MXML
Flash Authoring Flex Builder (and SDK)
AS2
Flash Compiler
CSS
Flex vs. Flash
Flex v/s AJAX
Any Language/Server
PHPASP.net
Java/JSP/Struts/J2EEWeb Services3rd Party APIs
Database-MYSQL-DB2-Oracle-Sybase-MSSQL-Access?
Database-MYSQL-DB2-Oracle-Sybase-MSSQL-Access?
Where does Flex fit in?
BrowserBrowser
How Flex Works ?
MXML and ActionScript
XML/HTTPRESTSOAP Web Services
XML/HTTPRESTSOAP Web Services
JEE Application ServerJEE Application Server
LC Data Services
Flash Player
Web ServerWeb Server
Existing Applications and InfrastructureExisting Applications and Infrastructure
Flex Builder IDEFlex Builder IDE
Flex SDKFlex SDK
MXMLMXML ActionScriptActionScript
Flex Class LibraryFlex Class Library
.swf
Compile
.swf
HTTP/S AMF/S RTMP/SSOAP
Getting Started
Flex/Flash Builder IDE
MXML
MXML are plain text based document
Follows XML standards
It is tag based <mx:Panel> similar to HTML
Always start with a XML declaration
Root node is always <mx:Application>
Action Script 3.0
Action script is a scripting language
No tags
Is fully Object Oriented
All MXML tags are Action Script classes
Similar to Java
Flex – other features
Where Flex is used ?
Product Configuration
Rich Media Applications
Data Visualization
Authoring Applications Product Selection
Line of Business Applications
Resources - links
Adobe Devnet: http://www.adobe.com/devnet/flex/
Learn Flex in a week http://www.adobe.com/devnet/flex/videotraining/
Learn Flex in a week http://www.adobe.com/devnet/flex/videotraining/
Flex Help: Getting started with Flex http://learn.adobe.com/wiki/display/Flex/Getting+Started
Flex Examples: http://blog.flexexamples.com/
Flex.org http://flex.org/
23
Reach me [email protected]/jokhanjbkflex.wordpress.com/