Introduction to Vaadin Framework
32
Introduction Risto Yrjänä ristoy ripla Vaadin }>
-
Upload
risto-yrjaenae -
Category
Technology
-
view
453 -
download
5
Transcript of Introduction to Vaadin Framework
Introduction
Risto Yrjänä ristoy ripla
Vaadin }>
Intro to
Vaadin
new Label(“Hello world”)
How it's built
Demo
QA
Framework
User interface framework for
rich web applications
Challenge How to build
consumer grade UX with business
system budget
Developer
Productivity
Rich
UX
Web application layers
Backend server
Web server
Commu- nication
JavaScript
Web application layers
Backend server
Web server
Commu- nication
JavaScript
Client-side UI
Web application layers
Backend server
Web server
Commu- nication
JavaScript
Server-side UI Automated
htmljava
Vaadin += GWT
How does server-side UI work, really?
TextField name = new TextField("Name");Button greetButton = new Button("Greet");
layout.addComponents(name, greetButton);
greetButton.addClickListener(e -> Notification.show("Hi " + name.getValue()));
• Initial HTML • CSS (theme) • Images • JavaScript
1.2M total
307k
compress
135k
reduced widgetset
• name=”Joonas” • button clicked
261 bytes
TextField name = new TextField("Name");Button greetButton = new Button("Greet");
layout addComponents(name, greetButton);
greetButton.addClickListener(e -> Notification.show("Hi " + name.getValue()));
• name=”Joonas” • button clicked
261 bytes
• Add notification
267 bytes
Request-response cycle
ServerClient
State
Click
Request-response cycle with push
ServerClient
State
Click
Progress Indicator
What else?
+500 add-on components
Any language
on JVM
1.6 Going mobile
GWT is a versatile technology that allows developers to create application UI for desktop, tablet, and mobile consumption. As can be expected, over 98% of apps support desktop browsers, but we found it interesting that tablets had overtaken phones (at least when it came to support from GWT-based apps). In US, the number of apps supporting tablets was as high as 46%, while it was just 34% in Europe.
What kind of devices does your app support?
98.1%25.7%
Phones
36.1%
Tablets
Desktop browsers
Others
2.1%
“Since gwt is used extensively in the enterprise, this may explain why tablets are more popular than support for phones”
Daniel
Browsers developers expect to support in 2013
3.5 Browsers to support in 2012
IE 6/7 Safari Opera IE 8
6/7 8
14% 18% 36% 54%
Chrome
9 10IE 9 IE 10 Firefox
79% 80% 94% 94%Browsers developers expect to support in 2013
3.5 Browsers to support in 2012
IE 6/7 Safari Opera IE 8
6/7 8
14% 18% 36% 54%
Chrome
9 10IE 9 IE 10 Firefox
79% 80% 94% 94%
1.6 Going mobile
GWT is a versatile technology that allows developers to create application UI for
desktop, tablet, and mobile consumption. As can be expected, over 98% of apps
support desktop browsers, but we found it interesting that tablets had overtaken
phones (at least when it came to support from GWT-based apps). In US, the number
of apps supporting tablets was as high as 46%, while it was just 34% in Europe.
What kind of devices does your app support?
98.1%
25.7%
Phones
36.1%
Tablets
Desktop
browsers
Others2.1%
“Since gwt is used extensively
in the enterprise, this may
explain why tablets are more
popular than support for
phones”
Daniel
iPhone Android
WP
1.6 Going mobile
GWT is a versatile technology that allows developers to create application UI for
desktop, tablet, and mobile consumption. As can be expected, over 98% of apps
support desktop browsers, but we found it interesting that tablets had overtaken
phones (at least when it came to support from GWT-based apps). In US, the number
of apps supporting tablets was as high as 46%, while it was just 34% in Europe.
What kind of devices does your app support?
98.1%
25.7%
Phones
36.1%
Tablets
Desktop
browsers
Others2.1%
“Since gwt is used extensively
in the enterprise, this may
explain why tablets are more
popular than support for
phones”
Daniel
iPad Android
Window
s
++
Servlet Portlet
(most) clouds · · ·
Anything Java
Eclipse IntelliJ IDEA
Netbeans Maven / Gradle / Ant
· · · Anything Java
Java EE Spring OSGi
· · · Anything Java
Demo
