Vaadin 7

1,000 views
858 views

Published on

Vaadin Framework provides a desktop-like programming model for creating modern web applications in plain Java – without the need for HTML, XML, plug-ins or JavaScript. This session explains the key concepts of the server-side and client-side RIA development with Java as well as summarizes what is new with Vaadin 7 and how it relates to GWT. To demonstrate the use of the framework, an example application is developed during the session step-by-step.

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

No Downloads
Views
Total views
1,000
On SlideShare
0
From Embeds
0
Number of Embeds
127
Actions
Shares
0
Downloads
13
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Vaadin 7

  1. 1. 7 Vaadin today Leif Åstrand Senior Vaadin Expert lördag 30 november 13
  2. 2. Intro to Vaadin lördag 30 november 13 How Vaadin works
  3. 3. new La bel(“H ello w orld”) lördag 30 november 13
  4. 4. Getting started QA lördag 30 november 13
  5. 5. lördag 30 november 13
  6. 6. User interface framework for rich web applications lördag 30 november 13
  7. 7. Building blocks lördag 30 november 13
  8. 8. lördag 30 november 13
  9. 9. java lördag 30 november 13 html
  10. 10. Why on earth? lördag 30 november 13
  11. 11. lördag 30 november 13
  12. 12. expectations lördag 30 november 13
  13. 13. reality lördag 30 november 13
  14. 14. consumer “million” users 10 views 1€/user business “500” users 50 views 500€/user 100,000€ / view >> 5,000€ / view lördag 30 november 13
  15. 15. Challenge How to build consumer grade UX with business system budget lördag 30 november 13
  16. 16. 123 Key Ideas lördag 30 november 13
  17. 17. 1 Rich Components lördag 30 november 13
  18. 18. User Interface Data Source Theme lördag 30 november 13
  19. 19. lördag 30 november 13
  20. 20. lördag 30 november 13
  21. 21. 3 3.5 Browsers to support in 2012 s pp yo ur a pp Desktop 3.5 Browsers to support in 2012 browsers su lic pp at r 9 io n or t? 8% U I fo ov of er ap r th take ps e nu n ro pe mb er . 36 .1% 6/7 IE 6/7 6/7 Opera Safari 14% IE 6/7 14% Ta b le ts 18% 9 10 36% 36% 18% Safari IE 9 79% 79% 9 98.1% IE 10 80% 80% 10 2. O Opera th er Chrome s 1% 94% iP ad 94% An 3 W dr6 in o.1 do id% “S in ince w What kind of devices does yourh app support? ex t e gw s po plai ent t is 8 ph pul n w erp us e r a h IE 9 IE 10 Chrome Browsers developers expect to support in 2013 Browsers developers expect to support in 2013 on e lördag 30 november 13 r t y ise d e s” han tab , th xte su lets is m ns p p ar a ive ly e y o inc e ex the gw po plain ente ph pula wh rp on r t y t es ha ab n ” su pp in 8 IE 8 8 54% 54% IE 8 Firefox Ph on Da 94% iPh A 94%nd one Firefox “S es 2 W 5 ro P .7 id 8% ni el
  22. 22. lördag 30 november 13
  23. 23. 350+ add-on components lördag 30 november 13
  24. 24. lördag 30 november 13
  25. 25. lördag 30 november 13
  26. 26. lördag 30 november 13
  27. 27. lördag 30 november 13
  28. 28. User Interface Data Source Theme lördag 30 november 13
  29. 29. lördag 30 november 13
  30. 30. lördag 30 november 13
  31. 31. lördag 30 november 13
  32. 32. lördag 30 november 13
  33. 33. Sass variables & functions lördag 30 november 13
  34. 34. Mixins lördag 30 november 13
  35. 35. User Interface Data Source Theme lördag 30 november 13
  36. 36. lördag 30 november 13
  37. 37. InMemory, Bean, Method, Collection, JDBC, JPA, Hibernate, TextFile, FileSystem, Properties, EclipseLink, Lucene, Mockups, GAE, ... lördag 30 november 13
  38. 38. 2 Server + Client lördag 30 november 13
  39. 39. Web application layers Backend server lördag 30 november 13 Web server Communication JavaScript
  40. 40. Web application layers Web server Communication Java to JavaScript JavaScript required required optional optional optional required required required required optional required required required JS GWT Vaadin Backend server lördag 30 november 13 required
  41. 41. Web application layers Web server Communication Java to JavaScript JavaScript required required optional optional optional JS GWT Vaadin Backend server lördag 30 november 13 required required 1 layer required vs required 3 layers -50% lines of code -50% development required required -50% maintenance easier to learn required required optional
  42. 42. O tim p ize e rol d ont i C s r fo d tien Cl or ti uc df ize od im Pr t Op r e v r e S y vit lördag 30 november 13
  43. 43. it iv ro P p O tim ize or f d ct u d rrve Se e sid ol or df ntr ize tim Co Op t n ie l C lördag 30 november 13
  44. 44. Widget Connector client server State RPC Component lördag 30 november 13
  45. 45. How does it work, really? lördag 30 november 13
  46. 46. name = new TextField("Name"); greetButton = new Button("Greet"); greetButton.addClickListener(new ClickListener() { public void buttonClick(ClickEvent event) { Notification.show("Ciao " + name.getValue()); } }); lördag 30 november 13
  47. 47. • • • • Initial HTML CSS (theme) Images JavaScript 1200k total compress 300k 135k lördag 30 november 13 reduced widget set and theme
  48. 48. • name=”Leif” • Button clicked 332 bytes lördag 30 november 13
  49. 49. name = new TextField("Name"); greetButton = new Button("Greet"); greetButton.addClickListener(new ClickListener() { public void buttonClick(ClickEvent event) { Notification.show("Ciao " + name.getValue()); } }); lördag 30 november 13
  50. 50. • name=”Leif” • Button clicked 332 bytes • Show notification 462 bytes lördag 30 november 13
  51. 51. Hello World! lördag 30 november 13
  52. 52. Source https://github.com/vaadin/documentmanager HOWTO Screencast https://vaadin.com/learn lördag 30 november 13
  53. 53. 3 Embracing Java lördag 30 november 13
  54. 54. Any JVM Language lördag 30 november 13
  55. 55. Internet Explorer Chrome Firefox Safari Opera iOS Android lördag 30 november 13
  56. 56. No browser plugins Nothing to install lördag 30 november 13
  57. 57. Servlet Portlet (most) clouds lördag 30 november 13
  58. 58. Eclipse IntelliJ IDEA Netbeans Maven Ant ∙∙∙ lördag 30 november 13
  59. 59. Vaadin += GWT lördag 30 november 13
  60. 60. lördag 30 november 13
  61. 61. lördag 30 november 13
  62. 62. lördag 30 november 13
  63. 63. GWT Compatible lördag 30 november 13
  64. 64. 7 Vaadin .1 lördag 30 november 13
  65. 65. v0.1 2001 v3 2002 Open Source lördag 30 november 13
  66. 66. v4 2006 Ajax v5 2007 lördag 30 november 13
  67. 67. 7 v6 2009 lördag 30 november 13 Feb
  68. 68. lördag 30 november 13
  69. 69. 934 tickets closed during 16 months of development Oldest ticket created 3/2008 Newest ticket 2/2013 3939 commits made by 23 authors 93 % by 6 persons > 1 000 000 lines of code touched lördag 30 november 13
  70. 70. getting started lördag 30 november 13
  71. 71. lördag 30 november 13
  72. 72. Eclipse Download plugin from Martketplace lördag 30 november 13
  73. 73. IntelliJ IDEA Built-in support lördag 30 november 13
  74. 74. Netbeans Download plugin Netbeans Plugin Portal lördag 30 november 13
  75. 75. Maven lördag 30 november 13 mvn archetype:generate -DarchetypeGroupId= com.vaadin -DarchetypeArtifactId= vaadin-archetype-application -DarchetypeVersion= 7.1.8
  76. 76. Migration Guide: Vaadin 6 to 7 https://vaadin.com/wiki/-/wiki/Main/Migrating +from+Vaadin+6+to+Vaadin+7 lördag 30 november 13
  77. 77. Download for Free vaadin.com/book -93- 1970 -1 01 728 pages PDF, ePub, HTML lördag 30 november 13
  78. 78. Apache License lördag 30 november 13
  79. 79. community of 100.000+ developers Ohloh #2 used Java Web Framework lördag 30 november 13
  80. 80. ? lördag 30 november 13 slideshare.com/ lastrand leif@vaadin.com vaadin.com/leif

×