Rich Web Applications in Server-side Java without Plug-ins or JavaScript Joonas Lehtinen, PhD Vaadin Ltd - CEO joonas@vaadin.com
?
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.
java html
healthcare portal, 100 kloc of perl,.. 1998
web 1.0, netscape, ie5, ie6,...
thinking of object oriented design, desktop, Java, U and I...
desktop programming paradigm for web!
found millstone ajax google web toolkit 2000 2002 2005 2008
re-released as 2009
is there a?
Apache License
Contents Server-side RIA What is it? Pros & cons? Discussion Vaadin Big picture, Extending, Getting started In practice Coding a Vaadin application step-by-step
Server-side RIA
? Rich Internet Application
an application that makes developers rich
if they bill by hour
Architecture
Web 1.0 Client 5 Server DOM HTML Page over HttpResponse View 4 Model 3 Parameters over HttpRequest 1 Controller 2 DB
client-side ria fat client
Client-side RIA Client View 5 4 Requested data to view as XML / JSON Server DOM 1 Model 3 Controller Changes to model encoded as parameters 2 DB
programming web is not easy
different features in different browsers
different performance in different browsers
different bugs in different browsers
Google Web Toolkit
Subset of java.lang, java.util Widgetset Java to JavaScript Compiler IE6 IE7 Firefox Your Application UI 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 Client DOM 9 1 TerminalAdapter 8 HTML Page over HttpResponse Automated by the RIA framework Parameters over HttpRequest 2 TerminalAdapter 7 3 Server View Controller Model 4 6 5 DB
Server-side RIA Client DOM 9 TerminalAdapter HTML Page over HttpResponse Automated by the RIA framework Handled by the framework 1 8 Parameters over HttpRequest 2 TerminalAdapter 7 3 Server View Controller Model 4 6 5 DB
the benefits of Java simpler forget the web Java cost-effective no JavaScript debugging modular extensible
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 scalable storing state in server memory limits number of concurrent users
A server with 16GB memory can handle 50.000 concurrent 250kB sessions
no offline mode server is always required
In practice
National Geographic Channel 2010 Seeing is believing
What can it do in 20 minutes?
Demo as video http://www.youtube.com/watch?v=u-a3vqf90kw
Vaadin
all benefits of server-side ria gwt
demo
Vaadin UI component architecture UI Component Button, Table, Tree,... Server-side data Full Java API HTTP(S) Widget Client-side peer for the component Runs on JavaScript Java Compiled with JDK Java Google Web Toolkit
thanks to GWT, creating new ui components is really easy
directory
channel for distributing Vaadin add-ons
ui components, data sources, themes, tools,...
Eclipse Maven Netbeans [Spring Roo]
Servlet Portlet 1.0 Portlet 2.0 App Engine
getting started
Book of Vaadin Free as PDF
#85 brought to you by... w.dzone.com Get More Refcardz! Visit refcardz.com CONTENTS INCLUDE: About Vaadin Creating An Application Components Layout Components Themes Data Binding and more... ABOUT VAADIN 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. Web Browser Client-Side Engine Java Web Server Vaadin UI Components 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) Getting Started with Vaadin Your Java Application Web Service EJB DB Web Browser Client-Side Engine Java Servlet Application Class User Application Figure 2: Architecture for Vaadin Applications Hot Tip AJAX Requests UI Component Inherits Events Changes Event Listener Servlet Container Data Model Data Binding Database By Marko Grönroos Default Theme Inherits Application Themes Application Resources External Resources File Resources You can get a reference to the application object from any component attached to the application with Event Listeners In the event-driven model, user interaction with user interface components triggers server-side events, which you can handle
Questions Comments m o c. in d a a v @ s a joon +358-40-5035001 n e n ti h le s a n o o /j :/ e p sky