Vaadin += GWT       Dr. Joonas Lehtinen             Vaadin - CEO              vaadin.com/joonas           @joonaslehtinen
Vaadin is aUI framework for rich web applications
java   html
healthcare portal, >100 kloc of perl,  8919
web 1.0, netscape, ie5, ie6, ...
thinking ofobject oriented design, desktop, Java, U and I ...
desktop programming paradigm for web!
found         millstone ajax google web toolkit 00                          08         02                    0520        2...
re-released as       09      20
Used by >50.000                      developers in >150                      countries                      Building apps ...
Vaadin += GWT                beta         12        20
is there a   ?
ApacheLicense
Developer        experiencegoals   User        expecience        Scalability
123Key Ideas
1RichComponents
User IntefaceData Source   Theme
User IntefaceData Source   Theme
User IntefaceData Source   Theme
InMemory, Bean, Method,Collection, JDBC, JPA,Hibernate, TextFile,FileSystem, Properties,EclipseLink, Lucene,Mockups, GAE, ...
2Server + Client
Layers of abstraction                   Backend      Web                   Java to                                        ...
Vaadin += GWT
GWTCompatible
Serve         ucr-od              ize                    Pr                    tim                       Op               ...
Client        Co              Op      -     im   t     ntr                                       f orol    ize  df        ...
Architecture
How does itwork, really?
•   Initial HTML•   CSS (theme)•   Images•   JavaScript830k total       compress250k       reduced       widgetset120k
• name=”Joonas”• button clicked150 bytes
• name=”Joonas”• button clicked150 bytes• Add  notification466 bytes
Widget                         7         Connectorclient                     Stateserver         RPC         Component
Trying it out
https://github.com/jojule/NotesDemo
3EmbracingJava
Any JVMLanguage
Scalawith Scaladin add-onval layout =  new VerticalLayout(width = 100 pct, height = 100 pct) {      add(new Label(content ...
Internet Explorer         Chrome          Firefox           Safari           Opera             iOS         Android
No  browser   pluginsNothing to    install
Servlet      Portlet(most) clouds
Apache Tomcat, version 4.1 or laterOracle WebLogic Server, version 9.2 or laterOracle WebLogic Portal, version 10gR3IBM We...
EclipseIntelliJ IDEA   Netbeans       Maven           Ant Spring Roo            ∙∙∙
gettingstarted
Maven mvn archetype:generate -DarchetypeGroupId=com.vaadin -DarchetypeArtifactId=    vaadin-archetype-application -Darchet...
Download for Free       vaadin.com/book     Vaadin is                a    for build n open source              ing mod    ...
brought to you by...#85 Get More Refcardz! Visit refcardz.com                                         CONTENTS INCLUDE:   ...
vaadin.com/gwt       @joonaslehtinen #
Questions?Comments?joonas@vaadin.com  vaadin.com/joonas    @joonaslehtinen            #vaadin Slides available on         ...
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Vaadin += GWT
Upcoming SlideShare
Loading in …5
×

Vaadin += GWT

3,990 views

Published on

Presentation at DevFestDC on Sep 28, 2012 about Vaadin 7, Vaadin += GWT and Vaadin in general.

Published in: Technology, Education
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,990
On SlideShare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
143
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Vaadin += GWT

  1. 1. Vaadin += GWT Dr. Joonas Lehtinen Vaadin - CEO vaadin.com/joonas @joonaslehtinen
  2. 2. Vaadin is aUI framework for rich web applications
  3. 3. java html
  4. 4. healthcare portal, >100 kloc of perl, 8919
  5. 5. web 1.0, netscape, ie5, ie6, ...
  6. 6. thinking ofobject oriented design, desktop, Java, U and I ...
  7. 7. desktop programming paradigm for web!
  8. 8. found millstone ajax google web toolkit 00 08 02 0520 20 20 20
  9. 9. re-released as 09 20
  10. 10. Used by >50.000 developers in >150 countries Building apps for fortune 500, startups, governments, ... across all industries Collaborating by conributing > 280 plug-ins and helpingadd-ons, mainstream each other on a forum with >1500 posts / m 10 11 Backed by 50+ person 20 20 full-time team
  11. 11. Vaadin += GWT beta 12 20
  12. 12. is there a ?
  13. 13. ApacheLicense
  14. 14. Developer experiencegoals User expecience Scalability
  15. 15. 123Key Ideas
  16. 16. 1RichComponents
  17. 17. User IntefaceData Source Theme
  18. 18. User IntefaceData Source Theme
  19. 19. User IntefaceData Source Theme
  20. 20. InMemory, Bean, Method,Collection, JDBC, JPA,Hibernate, TextFile,FileSystem, Properties,EclipseLink, Lucene,Mockups, GAE, ...
  21. 21. 2Server + Client
  22. 22. Layers of abstraction Backend Web Java to RPC JavaScript server server JavaScriptExtJS GWT Vaadin required required optional optional optional required required required required optional required required required required
  23. 23. Vaadin += GWT
  24. 24. GWTCompatible
  25. 25. Serve ucr-od ize Pr tim Op f or ed tiv iz df ority tim e rol Op t- s d ont i C ien Cl
  26. 26. Client Co Op - im t ntr f orol ize df iz ed iv ityor tim c t sid Op u od r- e P r rve Se
  27. 27. Architecture
  28. 28. How does itwork, really?
  29. 29. • Initial HTML• CSS (theme)• Images• JavaScript830k total compress250k reduced widgetset120k
  30. 30. • name=”Joonas”• button clicked150 bytes
  31. 31. • name=”Joonas”• button clicked150 bytes• Add notification466 bytes
  32. 32. Widget 7 Connectorclient Stateserver RPC Component
  33. 33. Trying it out
  34. 34. https://github.com/jojule/NotesDemo
  35. 35. 3EmbracingJava
  36. 36. Any JVMLanguage
  37. 37. Scalawith Scaladin add-onval layout = new VerticalLayout(width = 100 pct, height = 100 pct) { add(new Label(content = "Persons")) add(new Table(width = 100 pct, height = 100 pct), ratio = 1) add(new HorizontalLayout(spacing = true) { add(new Button("Edit selected", _ => editClicked())) add(new Button("Add new", _ => addNewClicked())) }) }getMainWindow.setContent(layout)
  38. 38. Internet Explorer Chrome Firefox Safari Opera iOS Android
  39. 39. No browser pluginsNothing to install
  40. 40. Servlet Portlet(most) clouds
  41. 41. Apache Tomcat, version 4.1 or laterOracle WebLogic Server, version 9.2 or laterOracle WebLogic Portal, version 10gR3IBM WebSphere Application Server, version 6.1 or laterIBM WebSphere Portal, version 6.1 and 7.0JBoss Application Server, version 3.2.8 or laterJetty, version 5 or laterGlassfish, version 2 or laterLiferay Portal 5.2 or laterGateIn Portal 3.1eXo Platform 3Google App EngineVaadin supports Java Servlet API 2.3 and JSR-168 and JSR-286 PortletSpecifications and should work withany Java application server that conformsto these standards.
  42. 42. EclipseIntelliJ IDEA Netbeans Maven Ant Spring Roo ∙∙∙
  43. 43. gettingstarted
  44. 44. Maven mvn archetype:generate -DarchetypeGroupId=com.vaadin -DarchetypeArtifactId= vaadin-archetype-application -DarchetypeVersion=7.0.0.beta2 mvn package yourproject-1.0.war
  45. 45. Download for Free vaadin.com/book Vaadin is a for build n open source ing mod J look gre ern web ava framework at, app your use perform well an lications that rs happ d make y. you and http://va adin.com /ISBN 978 -9 52-92-67 53-8 900009 7 89 52 9 267538S $29.9 5 Vaadin 7 Draft Edition ~700 pages
  46. 46. brought to you by...#85 Get More Refcardz! Visit refcardz.com CONTENTS INCLUDE: About Vaadin Getting Started with Vaadin Creating An Application Components Layout Components Themes Data Binding and more... By Marko Grönroos ABOUT VAADIN Web Browser External Client-Side Resources Vaadin is a server-side Ajax web application development Engine framework that allows you to build web applications just like AJAX Requests with traditional desktop frameworks, such as AWT or Swing. An Servlet Container Java File application is built from user interface components contained Servlet Resources hierarchically in layout components. Data In the server-driven model, the application code runs on Application UI Binding Default Class Component Theme a server, while the actual user interaction is handled by a client-side engine running in the browser. The client-server Inherits Events Changes Inherits communications and any client-side technologies, such as User Event Data Application Application HTML and JavaScript, are invisible to the developer. As the Application Listener Model Themes Resources client-side engine runs as JavaScript in the browser, there is no need to install plug-ins. Vaadin is released under the Apache Database License 2.0. Web Java Vaadin Your Web Figure 2: Architecture for Vaadin Applications Browser Web UI Java Service Client-Side Server Components Application You can get a reference to the application object .dzone.com Engine EJB Hot Tip from any component attached to the application with DB Event Listeners Figure 1: Vaadin Client-Server Architecture In the event-driven model, user interaction with user interface If the built-in selection of components is not enough, you can components triggers server-side events, which you can handle
  47. 47. vaadin.com/gwt @joonaslehtinen #
  48. 48. Questions?Comments?joonas@vaadin.com vaadin.com/joonas @joonaslehtinen #vaadin Slides available on slideshare:

×