soft-shake.ch - Vaadin - Rich Web Applications in Server-side Java without Plug-ins or JavaScript

Joonas Lehtinen

2010

J3

Vaadin - Rich Web Applications in Server-sideJava without Plug-ins or JS

http://soft-shake.ch

http://soft-shake.ch

Agilité iPhone Java Incubateur

8:15 Accueil des participantsAccueil des participantsAccueil des participantsAccueil des participants

8:40 Mot des organisateurs & Criée des orateursMot des organisateurs & Criée des orateursMot des organisateurs & Criée des orateursMot des organisateurs & Criée des orateurs

9:00 Keynote de Nicolas Martignole (30 minutes)Keynote de Nicolas Martignole (30 minutes)Keynote de Nicolas Martignole (30 minutes)Keynote de Nicolas Martignole (30 minutes)

9:40

10:40

- A1 -Le terrain Agile

Jean-Philippe Vigniel

- I1-Hello iPhone

Stephane Tavera

- J1 -NOSQL also means RDF stores: an

Android case studyFabrizio Giudci

- X1 -Le développement durable

Dominic Williams

11:00

12:00

- A2 -Integration of User Centered Design

in Agile Development of RIAJ. Borkenhagen, J. Desmazières

- I2 -Développement d'une application

iPhone pilotée par les testsEmmanuel Etasse, Van-Charles Tran

- J2 -La Tequila du développement Web

Nicolas Martignole

- X2 -Cloud Computing: anatomie et

pratiqueMarc-Elian Bégin

12:20

13:20

- A3 -Adoption de l'Agilité par les usages

Xavier Warzee

- I3 -Distribution d'applications iPhone

en Entreprise: Réalisation d'un AppStore interne

Géraud de Laval

- J3 -Vaadin - Rich Web Applications in

Server-side Java without Plug-ins or JavaScript

Joonas Lehtinen

- X3 -Les DVCS sont vos amis

Sébastien Douche

Pause repas (50 minutes)Pause repas (50 minutes)Pause repas (50 minutes)Pause repas (50 minutes)

14h10 Keynote de Regis Medina (30 minutes)Keynote de Regis Medina (30 minutes)Keynote de Regis Medina (30 minutes)Keynote de Regis Medina (30 minutes)

14h50

15h50

- A4 - Scrum, introduction et mise en

oeuvre avec iceScrumClaude Aubry

- I4 -Agile iOS Development

Jérôme Layat, Alexander Osterwalder

- J4 -JAX-RS and Java EE 6

Paul Sandoz

- X4 -IT Design & Ergonomy

Pascal Petit, Aude Lussigny

16h10

17h10

- A5 -Agilité : 10 ans déjà

Thierry Cros

- I5 -Optimizing iOS applications

Marc-Antoine Scheurer

- J5 -Ecrivez et automatisez vos tests

fonctionnels avec jBehaveXavier Bourguignon

- X5 -NoSQL : Enfin de la biodiversité

dans l'écosystème des BDOlivier Mallassi

17h30

18h30

- A6 -Lean engineering

Jean-Christophe Dubail

- I6 -iPhone et Agile, l'amour vache

Guillaume Duquesnay

- J6 -Let's make this test suite run faster

David Gageot

- X6 -The feel of Scala

Mario Fusco

Mot de la fin & tombolaMot de la fin & tombolaMot de la fin & tombolaMot de la fin & tombola

Programme de la Conférence

www.soft-shake.ch

http://www.soft-shake.ch

http://www.soft-shake.ch

Joonas Lehtinen, PhDIT Mill - CEO

[email protected]

Rich Web Applications in Server-side Java without

Plug-ins or JavaScript

Sunday, March 7, 2010

?Sunday, March 7, 2010


Vaadin is a UI framework

for desktop-like web apps


New configs, taglibs and syntax!?!

JavaScript,DOM, Applet,plugins?

No! This is Java. Nothing else.


htmljava


healthcare portal, 100 kloc of perl, .. web 1.0, netscape, ie5, ie6, ...

1998


healthcare portal, 100 kloc of perl, .. web 1.0, netscape, ie5, ie6, ... object oriented design, desktop, Java, U and I ...thinking of


object oriented design, desktop, Java, U and I ...thinking of


object oriented design, desktop, Java, U and I ... desktop programming paradigm for web! found


desktop programming paradigm for web! found millstone ajax google web toolkit re-released as

2000

2002

2005

2008


millstone ajax goolge web toolkit re-released as

2009


is there a ?


ApacheLicense


Discussion

VaadinBig picture, Extending, Getting started

Server-side RIAWhat is it? Pros & cons?

In practiceCoding a Vaadin application step-by-step

Contents


Server-side RIA


?Rich Internet Application


an application thatmakes developers rich


if they bill by hour


Architecture


“Web 1.0”

DOM

Client Server

ViewHTML Page

over HttpResponse

Controller

Model

Parameters overHttpRequest

DB2

3

4

5

1


client-side ria

fat client


Client-side RIA

DOM

Client Server

View

Controller

Model

DB2

3

4

5

1

Requested datato view as

XML / JSON

Changes to modelencoded as parameters


programming web is

not easy


different featuresin different browsers


different performancein different browsers


different bugsin different browsers


Google Web Toolkit


Java toJavaScriptCompiler

Subset of

java.lang, java.util

Widgetset

Your Application UI

IE6

IE7

Firefox

Safari


simpler• Java only• forget the web


cost-effective stop debugging JavaScript spaghetti


modular extensible♲


Building wonderful apps doesn’t require writing fat web clients.


server-side ria

thin client


Server-side RIA

DOM

Client Server

ViewHTML Pageover HttpResponse

Controller

Model


DB4

5

6

2

Term

inalAdapter

Term

inalAdapter

Automated bythe RIA framework

3

7

1

9

8


Server-side RIA

DOM

Client Server

ViewHTML Pageover HttpResponse

Controller

Model


DB4

5

6

2

Term

inalAdapter

Term

inalAdapter

Automated bythe RIA framework

3

7

1

9

8

Handled by the framework


Java

modularextensible

cost-effectiveno JavaScript debugging

simplerforget the web

the benefits of Java

♲Sunday, March 7, 2010

even simpler• forget the client-side • synchronous• server resources


more flexible• all Java tools and libraries• any JVM language


more secure• code stays in server• less web services


not as scalablemore processing kept on server


no offline modeserver is always required


In practice


Seeing is believing

© National Geographic Channel 2010


What can it do in 20 minutes?




Demo as videohttp://www.youtube.com/watch?v=u-a3VQF90kw


http://www.youtube.com/watch?v=u-a3VQF90kw

http://www.youtube.com/watch?v=u-a3VQF90kw

Vaadin


all benefits of• server-side ria• gwt


ui components





Vaadin UI component architecture

“UI Component”• Button, Table, Tree, ...• Server-side data• Full Java API

Java

• Google Web Toolkit

“Widget”• Client-side peer for

the component• Runs on JavaScript

HTTP(S)

Java

• Compiled with JDK


thanks to GWT, creating new ui components is really easy


directory


channel fordistributingVaadin add-ons


ui components, data sources,

themes, tools, ...







Vaadin Directoryopen to public by the end of this month


EclipseMaven

Netbeans


ServletPortlet

GAE


gettingstarted



Book ofVaadin

Free as

PDFSunday, March 7, 2010

By Marko Grönroos

ABOUT VAADIN

ww

w.d

zone

.co

m

G

et M

ore

Ref

card

z! V

isit

ref

card

z.co

m

#85

Getting Started with VaadinCONTENTS INCLUDE:

About VaadinCreating An ApplicationComponents Layout ComponentsThemesData Binding and more...

Vaadin is a server-side Ajax web application development framework that allows you to build web applications just like with traditional desktop frameworks, such as AWT or Swing. An application is built from user interface components contained hierarchically in layout components.

In the server-driven model, the application code runs on a server, while the actual user interaction is handled by a client-side engine running in the browser. The client-server communications and any client-side technologies, such as HTML and JavaScript, are invisible to the developer. As the client-side engine runs as JavaScript in the browser, there is no need to install plug-ins. Vaadin is released under the Apache License 2.0.

Figure 1: Vaadin Client-Server Architecture

If the built-in selection of components is not enough, you can develop new components with the Google Web Toolkit (GWT)

Figure 2: Architecture for Vaadin Applications

Hot Tip

You can get a reference to the application object from any component attached to the application with

Event ListenersIn the event-driven model, user interaction with user interface components triggers server-side events, which you can handle

Web BrowserClient-Side Engine

JavaWeb Server

VaadinUIComponents

YourJavaApplication

WebService

EJB

DB

Servlet Container

UserApplication

EventListener

DataModel

ApplicationThemes

ApplicationResources

DefaultTheme

FileResources

ExternalResources

Database

DataBinding

Inherits Events Changes

AJAX Requests

Inherits

UIComponent

JavaServlet

ApplicationClass

Web BrowserClient-Side Engine

brought to you by...


QuestionsComments

[email protected]+358-40-5035001skype://joonaslehtinen


mailto:[email protected]
















Technology

soft-shake.ch - Vaadin - Rich Web Applications in Server-side Java without Plug-ins or JavaScript