building i pad apps in pure java with vaadin

65
Joonas Lehtinen @joonaslehtinen Building iPad Apps in Pure Java with Vaadin

Upload: joonas-lehtinen

Post on 11-Nov-2014

3.816 views

Category:

Technology


0 download

DESCRIPTION

My JavaOne 2012 presentation on how to build iPad applications in Java with Vaadin

TRANSCRIPT

Page 1: Building i pad apps in pure java with vaadin

Joonas Lehtinen@joonaslehtinen

Building iPad Apps in Pure Java with Vaadin

Page 2: Building i pad apps in pure java with vaadin

2010

Page 3: Building i pad apps in pure java with vaadin
Page 4: Building i pad apps in pure java with vaadin

Today~ 100M iPads shipped

~70% of tablet marketshare

Page 5: Building i pad apps in pure java with vaadin

A Year Ago“93% of Fortune 500

companies have deployed or are testing iPads”

- Apple

Page 6: Building i pad apps in pure java with vaadin

So, how do I develop for iPad?

Page 7: Building i pad apps in pure java with vaadin
Page 8: Building i pad apps in pure java with vaadin
Page 9: Building i pad apps in pure java with vaadin

?

Page 10: Building i pad apps in pure java with vaadin
Page 11: Building i pad apps in pure java with vaadin
Page 12: Building i pad apps in pure java with vaadin

Vaadin is a UI framework

for rich web applications

Page 13: Building i pad apps in pure java with vaadin
Page 14: Building i pad apps in pure java with vaadin

htmljava

Page 15: Building i pad apps in pure java with vaadin

123ideas

Page 16: Building i pad apps in pure java with vaadin

1RichComponents

Page 19: Building i pad apps in pure java with vaadin
Page 20: Building i pad apps in pure java with vaadin
Page 21: Building i pad apps in pure java with vaadin
Page 26: Building i pad apps in pure java with vaadin
Page 27: Building i pad apps in pure java with vaadin

InMemory, Bean, Method, Collection, JDBC, JPA, Hibernate, TextFile, FileSystem, Properties, EclipseLink, Lucene, Mockups, GAE, ...

Page 28: Building i pad apps in pure java with vaadin

2Server + Client

Page 29: Building i pad apps in pure java with vaadin

Layers of abstraction

JavaScriptJava toJavaScript

Webserver

Backendserver

required optional optionalrequired

RPC

optional

Vaa

din

required optionalrequired

GW

T

requiredrequired

Ext

JS

requiredrequired

required required

Page 30: Building i pad apps in pure java with vaadin

Architecture

Page 31: Building i pad apps in pure java with vaadin
Page 32: Building i pad apps in pure java with vaadin

3EmbracingJava

Page 33: Building i pad apps in pure java with vaadin

Componentsare justPOJOs

Page 34: Building i pad apps in pure java with vaadin

Any JVMLanguage

Page 35: Building i pad apps in pure java with vaadin

Any JavaIDE & Tools

Page 36: Building i pad apps in pure java with vaadin

Most JavaServers, Portals &Clouds

Page 37: Building i pad apps in pure java with vaadin

ApacheLicense

Page 38: Building i pad apps in pure java with vaadin

VaadinTouchKit

Page 39: Building i pad apps in pure java with vaadin

Apple iOS theme

Mobile components• TouchKitWindow• Navigation manager• NavigationBar• NavigationButton• SwipeView• PopoverWindow• Tabsheets• Toolbar• Switch

Offline mode

Page 40: Building i pad apps in pure java with vaadin

What kind of iPad apps are we talking about?

Page 41: Building i pad apps in pure java with vaadin

PumaProduct portfolio management

Page 42: Building i pad apps in pure java with vaadin
Page 43: Building i pad apps in pure java with vaadin
Page 44: Building i pad apps in pure java with vaadin
Page 45: Building i pad apps in pure java with vaadin
Page 46: Building i pad apps in pure java with vaadin

Developing with Vaadin TouchKit

Page 47: Building i pad apps in pure java with vaadin
Page 48: Building i pad apps in pure java with vaadin
Page 49: Building i pad apps in pure java with vaadin
Page 50: Building i pad apps in pure java with vaadin
Page 51: Building i pad apps in pure java with vaadin
Page 53: Building i pad apps in pure java with vaadin

How does it work, really?

Page 54: Building i pad apps in pure java with vaadin
Page 55: Building i pad apps in pure java with vaadin

• Initial HTML• CSS (theme)• Images• JavaScript

830k total

250k

compress

120k

reducedwidgetset

Page 56: Building i pad apps in pure java with vaadin
Page 57: Building i pad apps in pure java with vaadin

• name=”Joonas”• button clicked

150 bytes

Page 58: Building i pad apps in pure java with vaadin
Page 59: Building i pad apps in pure java with vaadin

• name=”Joonas”• button clicked

150 bytes

• Add notification

466 bytes

Page 60: Building i pad apps in pure java with vaadin

gettingstarted

Page 61: Building i pad apps in pure java with vaadin
Page 62: Building i pad apps in pure java with vaadin

mvn archetype:generate-DarchetypeGroupId=com.vaadin-DarchetypeArtifactId=vaadin-archetype-touchkit-DarchetypeVersion=LATEST

Maven

mvn package jetty:run-war

Page 63: Building i pad apps in pure java with vaadin

Free Bookvaadin.com/book

~700 pages

Vaadin 7 Draft Edition

US $29.95

Vaadin is an open source Java framework for building modern web applications that look great, perform well and make you and

your users happy. http://vaadin.com/

2675387895299

ISBN 978-952-92-6753-890000

Get a free copyat Vaadin booth

Page 64: Building i pad apps in pure java with vaadin

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 Vaadin�� Creating An Application�� Components �� Layout Components�� Themes�� Data 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...

Page 65: Building i pad apps in pure java with vaadin

Questions?Comments?

[email protected] vaadin.com/joonas

@joonaslehtinen#vaadin

InvitationJoin us today 5pm for Vaadin & GWT meet-up at Hotel Serrano (100 yards from Hilton)

Super dev mode & Elemental in GWT 2.5Ray Cromwell / Google

Vaadin 7 Client-Server Hybrid AppsJoonas Lehtinen / Vaadin

Errai 2.1Mike Brock / Red Hat

RUMS/NASA demoGeorge Soler / SAIC

Please register at http://bit.ly/vaadin-gwt-meetup