15
Echo2 Echo2 Java AJAX Web Framework Petar Milev

Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Embed Size (px)

Citation preview

Page 1: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Echo2Echo2Java AJAX Web Framework

Petar Milev

Page 2: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

ContentsContents

1.1. Introduction to Echo2Introduction to Echo2

2.2. Echo2 Target – Business WebEcho2 Target – Business Web

3.3. Why Choosing Echo2?Why Choosing Echo2?

4.4. Live DemoLive Demo

5.5. How It Works?How It Works?

6.6. ConclusionConclusion

7.7. LinksLinks

8.8. Components (screenshots)Components (screenshots)

Page 3: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Introduction to Echo2Introduction to Echo2

- Echo2 is a Web Framework for JavaEcho2 is a Web Framework for Java

- It is AJAX-enabledIt is AJAX-enabled

- Helps developing rich business web Helps developing rich business web applicationsapplications

- The code can be written entirely on the server The code can be written entirely on the server side, using only Javaside, using only Java

- Doesn’t require any additional build phasesDoesn’t require any additional build phases

Page 4: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Echo2 Target – Business WebEcho2 Target – Business Web

- What business web means here?What business web means here?

- When developing the presentation – focus on When developing the presentation – focus on the functionality rather on the visual designthe functionality rather on the visual design

- Visual design is also very flexibleVisual design is also very flexible

Page 5: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Why Choosing Echo2?Why Choosing Echo2?

- Easies the development – makes web Easies the development – makes web applications simpleapplications simple

- Forget about legacy paradigms like page-Forget about legacy paradigms like page-orientation, request-response, etc.orientation, request-response, etc.

- Rich AJAX application without any additional Rich AJAX application without any additional efforteffort

- Use just Java code for the whole presentation Use just Java code for the whole presentation layerlayer

- Easy to support softwareEasy to support software

Page 6: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Echo2Echo2

Live DemoLive Demo

Page 7: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

How It Works? (part 1)How It Works? (part 1)

- On the first request, Echo2 JavaScript engine On the first request, Echo2 JavaScript engine is sent to the client (specific for the browser)is sent to the client (specific for the browser)

- From now on, Echo2 engine handles From now on, Echo2 engine handles everything for useverything for us

- On a user interaction it automatically notifies On a user interaction it automatically notifies the server (if needed) and calls our event-the server (if needed) and calls our event-handling Java codehandling Java code

- The Echo2 server engine generates The Echo2 server engine generates appropriate XML response which is handled appropriate XML response which is handled by Echo2 JS engine and DOM is updatedby Echo2 JS engine and DOM is updated

Page 8: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

How It Works? (part 2)How It Works? (part 2)

Step 1: Step 1: User presses a buttonUser presses a button

Step 2: Step 2: If there is ActionListener attached, the If there is ActionListener attached, the Echo2 JS engine sends the event Echo2 JS engine sends the event to the to the server:server:

<client-message <client-message xmlns="http://www.nextapp.com/products/echo2/climxmlns="http://www.nextapp.com/products/echo2/climsg" trans-id="4">sg" trans-id="4">

<message-part processor="EchoAction"><message-part processor="EchoAction"><action component-id="c_8” name="click"/><action component-id="c_8” name="click"/>

</message-part></message-part></client-message></client-message>

Page 9: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

ConclusionConclusion

- Alternative for developing contemporary web Alternative for developing contemporary web applications with no real alternative for other applications with no real alternative for other platforms/languagesplatforms/languages

- Introducing very simple approachIntroducing very simple approach

- Increases team efficiencyIncreases team efficiency

- Appropriate for large software applicationsAppropriate for large software applications

- Very mature with state of a proven frameworkVery mature with state of a proven framework

Page 10: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

LinksLinks

Echo home page: Echo home page: http://echo.nextapp.com/site/http://echo.nextapp.com/site/ - - find demos, tutorials, builds and source codefind demos, tutorials, builds and source code

Wiki: Wiki: http://wiki.nextapp.com/echowiki http://wiki.nextapp.com/echowiki - many - many useful resources and linksuseful resources and links

EchoPointNG: EchoPointNG: http://wiki.nextapp.com/echowiki/EchoPointNG http://wiki.nextapp.com/echowiki/EchoPointNG - -

library with many additional Echo2 componentslibrary with many additional Echo2 components

Echo2GO: Echo2GO: http://wiki.nextapp.com/echowiki/Echo2Go http://wiki.nextapp.com/echowiki/Echo2Go - - everything you need to make echo2 app in 15 everything you need to make echo2 app in 15 minutesminutes

Page 11: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Widgets (screenshots) part 1Widgets (screenshots) part 1

Standard components:Standard components:

Page 12: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Widgets (screenshots) part 2Widgets (screenshots) part 2

Layouting components:Layouting components:

Vertical split pane

Popup window

Page 13: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Widgets (screenshots) part 3Widgets (screenshots) part 3

Windows and popups:Windows and popups:

Customizable tabpane

Customizable image borders

Color chooser

Page 14: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Widgets (screenshots) part 4Widgets (screenshots) part 4

More components:More components:

Accordion pane

Charts:Pie/Pie 3DBar/Bar 3D

Menus

Page 15: Echo2 Java AJAX Web Framework Petar Milev. Contents 1.Introduction to Echo2 2.Echo2 Target – Business Web 3.Why Choosing Echo2? 4.Live Demo 5.How It Works?

Third Party WidgetsThird Party Widgets

You get even more fancy components with You get even more fancy components with EchoPointNG (EchoPointNG (LGPL)LGPL) library library

• AutoLookupTextFieldAutoLookupTextField

• BalloonHelp BalloonHelp

• Calculator Calculator

• DateChooser DateChooser

• HistoryMonitor HistoryMonitor

• ImageMap ImageMap

• LiveTable LiveTable

• RichTextArea RichTextArea

• Tree Tree

• TreeTable TreeTable