Introduction to web-application development with Vaadin

50 %
50 %
Information about Introduction to web-application development with Vaadin
Technology

Published on March 5, 2014

Author: ripla

Source: slideshare.net

Description

Introduction to web-application development with Vaadin

Web application development with 7 Vaadin .1 Risto Yrjänä Vaadin Expert

What? Why?

How does it work? new L abel( “Hell o wor ld”) How do I use it?

How do I get star ted? QA

User interface framework for rich web applications

java html JavaScript DOM AJAX JSON …

Apache 2.0 license

Why?

expectations

reality

Challenge How to build consumer grade UX with business system budget

How? 1 Rich components 2 Server + Client 3 Embracing Java

User Interface Data Source Theme

demo.vaadin.com/sampler

demo.vaadin.com/dashboard

s 3 3.5 Browsers to support in 2012 yo ur ap Desktop 3.5 Browsers to support in 2012 browsers pp p 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 bl et s 18% 9 10 36% 36% 18% Safari IE 9 79% 79% 9 IE 9 98.1% IE 10 80% 80% 10 IE 10 2. O Opera th er Chrome s 1% 94% Chrome iP ad 94% An 3 W dr6 in o.1 do id% “S w What kind of devices does yourh app support? in ince ex t e gw s po plai ent t is 8 ph pul n w erp us e r a h Browsers developers expect to support in 2013 Browsers developers expect to support in 2013 on r is d es tha y ta e, t ex ” n ble his ten su ts m si in 8 54% 54% IE 8 Firefox Ph on es 94% iPh A 94%nd one 2 Firefox inc e ex the gw po plain ente ph pula wh rp on r t y t es ha ab n ” su pp 8 IE 8 “S W 5 ro P .7 id 8% Da ni el

hundreds of add-on components

User Interface Data Source Theme

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

User Interface Data Source Theme

sass (syntactically awesome stylesheets)

1 Rich components 2 Server + Client 3 Embracing Java

Web application layers Backend server Web server Communication JavaScript

Web application layers JS Backend server Web server Communication required required required Java to JavaScript JavaScript required

Backend server Web server Communication Java to JavaScript JavaScript GWT required required required required optional JS Web application layers required required required required

Web application layers JS GWT Vaadin Backend server Web server Communication Java to JavaScript JavaScript required required optional optional optional required required required required optional required required required required

How does it work, really?

Widget Connector client server State RPC Component

• • • • Initial HTML CSS (theme) Images JavaScript ! 1.2M total
 compress 307k 135k reduced widgetset and theme

• name=”Johannes” • button clicked ! 263 bytes


• name=”Johannes • button clicked ! 263 • Add notification ! 269 bytes


vaadin.com/learn https://github.com/vaadin/documentmanager

1 Rich components 2 Server + Client 3 Embracing Java

Any language on JVM Java Scala Groovy Clojure Python Ruby Ceylon …

Eclipse IntelliJ IDEA Multiple Netbeans Maven development Gradle environments Ant ŁŁŁ

GWT Compatible

Vaadin += GWT

ity tiv or df ize tim uc Op od Pr O tim p fo ed iz e rol d ont i C s r e v r e S r tien Cl

How do I get started?

Eclipse Download plugin from Martketplace

IntelliJ IDEA Built-in support

Netbeans Download plugin Netbeans Plugin Portal

Maven mvn archetype:generate -DarchetypeGroupId= com.vaadin -DarchetypeArtifactId= vaadin-archetype-application -DarchetypeVersion= 7.1.7

Download for Free vaadin.com/book -93- 1970 -1 01 > 600 pages PDF, ePub, HTML

Apache License

community of 100.000+ developers Ohloh #2 used Java Web Framework

? risto@vaadin.com ! @ristoy

Add a comment

Related presentations

Related pages

Introduction to web-application development with Vaadin ...

Home; Technology; Introduction to web-application development with Vaadin; Introduction to web-application development with Vaadin Dec 18, 2014 Technology
Read more

Docs - vaadin.com

Vaadin Framework is a Java web application development framework that is designed to make creation and maintenance of high quality web-based user ...
Read more

Docs - vaadin.com

Introduction to Cascading Style ... We cover the basic Vaadin development and you can use ... method of a UI class is triggered when a user enters your web ...
Read more

Introduction to Java Web development - Tutorial - vogella

Vaadin web apps with Eclipse RCP; ... Introduction to Java Web development - Tutorial. Lars Vogel, (c) ... If you develop a web application ...
Read more

Introduction to Web application development with Vaadin 7 ...

Home; Technology; Introduction to Web application development with Vaadin 7.1 - Tzukanov; Introduction to Web application development with Vaadin 7.1 ...
Read more

Java Day Guatemala 2013 Session 3 - Introduction to Vaadin ...

Java Day Guatemala 2013 Session 3 about Vaadin 7,1 . Introduction to web application development ... web application development with Vaadin ...
Read more

Vaadin: A Java Web Application Framework - HubPages

The Vaadin web application allows you to create ... Introduction. Perhaps you're tired ... They also provide support and development help for a fee. The ...
Read more