beoynd vaadin 7
DESCRIPTION
Presentation at Vaadin & GWT meetup San Francisco Sep 25, 2013TRANSCRIPT
![Page 1: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/1.jpg)
Joonas LehtinenFounder & CEO@joonaslehtinen
Beyond 7
![Page 2: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/2.jpg)
Questions &answers
Roadmap
Quick recap of Vaadin 7
7.1Feature by feature
Agenda
![Page 3: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/3.jpg)
Vaadin7
![Page 4: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/4.jpg)
v32002
v0.12001
OpenSource
![Page 5: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/5.jpg)
v42006
Ajax
v52007
![Page 6: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/6.jpg)
7Febv6
2009
![Page 7: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/7.jpg)
Completestack
Renewedfrom Inside
Sass
JS
HTML5+=GWT
RPCState
UI
Field
![Page 9: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/9.jpg)
Vaadin7.1
![Page 10: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/10.jpg)
@VaadinServletConfiguration
https://vaadin.com/wiki/-/wiki/Main/Creating+a+servlet+3.0+application
![Page 11: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/11.jpg)
@Theme("foo")public class FooUI extends UI {
@WebServlet(value = "/*", asyncSupported = true) @VaadinServletConfiguration(productionMode = false, ui = FooUI.class) public static class Servlet extends VaadinServlet { }
@Override protected void init(VaadinRequest request) { ... }
}
![Page 12: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/12.jpg)
@Theme("foo")public class FooUI extends UI {
@WebServlet(value = "/*", asyncSupported = true) @VaadinServletConfiguration(productionMode = false, ui = FooUI.class) public static class Servlet extends VaadinServlet { }
@Override protected void init(VaadinRequest request) { ... }
}
![Page 13: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/13.jpg)
Server initiated events / Push
https://vaadin.com/wiki/-/wiki/Main/Using+server+initiated+events
![Page 14: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/14.jpg)
server
client
Component
Widget
Connector
RPC
State
![Page 15: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/15.jpg)
Samplehttp://demo.vaadin.com/sampler/#foundation/push
![Page 16: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/16.jpg)
@Push MyUI
<async-supported/> orasyncSupported = true
vaadin-push dependency
![Page 17: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/17.jpg)
UI.getCurrent().access(new Runnable() {public void run() {layout.addComponent(new Label("foo”));
}});
![Page 18: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/18.jpg)
Debugwindow
![Page 19: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/19.jpg)
?debug
![Page 20: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/20.jpg)
Optimizing widgetset...
278k 130k
![Page 21: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/21.jpg)
Compiling themes
![Page 22: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/22.jpg)
Add-ontheme packaging
https://vaadin.com/wiki/-/wiki/Main/Packaging+SCSS+or+CSS+in+an+add-on
![Page 23: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/23.jpg)
Inject CSSdynamically
https://vaadin.com/wiki/-/wiki/Main/Dynamically+injecting+CSS
![Page 24: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/24.jpg)
getPage().getStyles().add(".reindeer.v-app { background: #"+ Math.round(Math.random() * 899 + 100) + ";}"
);
![Page 25: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/25.jpg)
Samplehttp://demo.vaadin.com/sampler/#foundation/cssinject
![Page 26: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/26.jpg)
Calendar
https://vaadin.com/wiki/-/wiki/Main/Migrating+from+Vaadin+7.0+to+Vaadin+7.1
![Page 27: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/27.jpg)
Accessibility with WAI-ARIA
https://vaadin.com/blog/-/blogs/first-step-in-accessibility
![Page 28: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/28.jpg)
ButtonTextFieldPasswordFieldTextAreaDateField
WAI-ARIA enabled components
CheckBoxComboBoxButtonGroupTreeTooltip
![Page 29: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/29.jpg)
Roadmap
![Page 30: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/30.jpg)
Roadmap
![Page 31: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/31.jpg)
Vaadin 7.2GWT compatibilityApplication archetypeVaadin CDI 1.0 betaVaadin TouchKit 4.0Vaadin TestBench 4.0Netbeans plug-inSpreadsheet
![Page 32: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/32.jpg)
Grid• Client-side data model• Client-side APIs• Replaces Table and TreeTable
New theme that leverages SASS
Responsive extension built-inhttp://vaadin.com/addon/vaadin-responsive
Vaadin 7.2
![Page 33: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/33.jpg)
![Page 34: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/34.jpg)
<Beat design example>
![Page 35: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/35.jpg)
// Vaadin UIprotected void init(VaadinRequest request) { new Responsive(this);}
// CSS.v-ui[width-range~="0-800px"] { /* Styles that apply when the UI's width is between 0 and 800 pixels */} .v-ui[width-range~="801px-"] { /* Styles that apply when the UI's width is over 800 pixels */}
http://demo.vaadin.com/responsive/
![Page 36: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/36.jpg)
Full stack example
Suitable for working on all layers• Server-side Java• Client-side Java• JavaScript
Modularization and full tools support
Application Archetype
![Page 37: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/37.jpg)
Finalize what is already available as alpha in directoryhttp://vaadin.com/addon/vaadin-cdi
Features• Registering UI with @CDIUI and Views• Decoupling by injecting components• Injecting EJBs, events, ...• UI Scope• Supports JAAS
Vaadin CDI 1.0 beta
![Page 38: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/38.jpg)
New cross-platform themehttp://demo.vaadin.com/parking/
Windows Phone 8 support
Vaadin TouchKit 4.0
![Page 39: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/39.jpg)
Vaadin Driver : New way of building selectors
Replacing recorder with debug window
Vaadin TestBench 4.0
![Page 40: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/40.jpg)
Spreadsheet
![Page 41: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/41.jpg)
Netbeans plugin
![Page 42: Beoynd Vaadin 7](https://reader033.vdocuments.mx/reader033/viewer/2022052410/554f4aeab4c905423f8b4ccc/html5/thumbnails/42.jpg)
http://gwtcreate.com/
San Francisco - Dec 12-13Frankfurt - Dec 17-18