View
221
Download
0
Category
Preview:
Citation preview
JavaOne 2017
SINGLE-PAGE WEB APPS IN PLAIN JAVA WITH VAADIN
5
S T O R Y A N D P H I L O S O P H Y
Software is eating the world and what most of us see of it is the user interface. The user
interface has become the key component of how the users experience the business
behind it. Competition is lost or won due to user experience. Simplicity is king and the
users get frustrated by anything ugly, slow or not working on the device they happen to
use at the time. We at Vaadin fight for simplicity and invite everyone to join this fight.
Together we want to build a user interface that puts a smile on the user’s face.
Vaadin is the technology that empowers developers to build the best web-apps for
business purposes. Our priority over everything else is developer productivity because
we believe that by simplifying the developer experience and saving the developer’s
time, they are best able to focus on building great user interfaces.
Our brand is what we want everyone to think about us. When everyone - both us and
the people around us - have a consistent understanding of what Vaadin is and what we
stand for, it enables that image to spread and amplify. This book defines what we want
that image to be. It defines what the Vaadin brand is.
I hope that You are as excited and proud of living and breathing the Vaadin brand as
I am. You are the one who is shaping what everyone thinks about Vaadin - using this
brand as a tool and a guideline every day.
Let’s fight for simplicity for both the users and the developers!
Joonas Lehtinen
Founder & CEO
Vaadin
I N T R O D U C T I O N
Matti Tahvonen, Vaadin Ltd
WEB APP WIZARD
Matti Tahvonen
Web pages from 1994
Web apps from 1996 (JavaScript, Perl, PHP…)
Java web apps from 2006 (Vaadin R&D + helping our customers)
Since 2014, mostly DevRel/marketing as daily job
NetBeans fan since 2014
DEVELOPER ADVOCATE
@mattitahvonen
Web isn't built for apps.
Vaadin is a perfect choice for web app
developers, especially for NetBeans/Swing/JavaFX/
SWT developers.
The most helpful IDE plugins should integrate to
the code editor.
What you’ll learn?
Agenda
Questions and answers as they appear
HANDS ON INTRODUCTION TO VAADIN USING OUR NETBEANS PLUGIN
THE ENDSHORT INTRODUCTION ON VAADIN & OUR NETBEANS PLUGIN
1 2 3
DEFINING VAADIN & VAADIN NETBEANS PLUGIN
Vaadin is a collection of tools to efficiently build
awesome web apps.
Components (OS)
Framework for app and component developers
(OS)
Extensions, IDE extensions and additional
productivity tools (OS + Pro/Prime)
What is Vaadin?
Why Vaadin developers would need a plug-in?
Vaadin is just a Java library!Vaadin NetBeans Plugin
Project templates
Component templates
Theme templates
Project settings
Validators for Vaadin specific code
Integrated Add-on Directory support
Vaadin NetBeans PluginFeatures
Based on strong Maven support by NetBeans
Many of features hooked directly to the code
editor, the part that developers use the most.
We hired the right guy, Denis Anisimov :-)
Vaadin NetBeans PluginHow was it built?
WHY SO MANY WEB FRAMEWORKS?A N D H O W VA A D I N I S D I F F E R E N T … . .
Originally just very simple <form></form> + inputs
resulting server side visit.
No custom inputs, re-usable components,
dynamic graphics, asynchronous access to server.
Only JavaScript available for minor enhancement.
Everything for modern SPAs are just built and
hacked on the existing standards.
Web was not designed to be an application platform!
Pete HuntTHE REACT FELLOW, FACEBOOK
“Web technologies are designed for documents. If you would be building a UI toolkit, it would look
nothing like a DOM.” JavaOne 2015, Web Framework Smackdown
LINUS TORVALDS, GOOGLE+ DISCUSSION 2014
XML is crap. Really. There are no excuses.
XML is nasty to parse for humans, and it's a
disaster to parse even for computers. There's just no reason for that horrible crap to exist.
All/most web app frameworks try to somehow
abstract or simplify the broken app platform.
Vaadin comes from a different direction. Vaadin
has been designed to be an app UI framework,
we just happen use web as a "rendering engine”.
Vaadin development reminds more of developing
with traditional UI libraries than most web
frameworks.
Trivia: 10+ years ago, we actually had a plan to
implement multiple “terminal adapters”, for
different kind of devices and use cases. There was
working prototypes for Swing, J2ME/Midlet.
Vaadin FrameworkHow is Vaadin different?
"All" Java
Strong abstraction of DOM
Really strong abstraction of the whole client-
server development model
Extensible with Java (and web technologies)
Still an awesome user experience: good
components + good looking theme
Vaadin FrameworkHow is Vaadin different?
HOW VAADIN WORKS?A D E M O N S T R AT I O N F R O M I D E
SWEET SPOTS FOR VAADINN O TOO L F I T S F O R A L L
BIG apps with dozens or even thousands of views
Apps with long lifecycle, easy to maintain, easy to
upgrade to newer versions (for “modernisation”)
Apps, NOT sites. Remember, web is good for
hyper text!
Insurance, banking, healthcare.
Vaadin
Sweet spots
PROBLEMSA N D S O L U T I O N S
Missing components
Theme building
Co-operation with UI (HTML) designers
Performance against "stateless" web technologies
Vaadin FrameworkProblems
Compose it from existing
See community contributed extension, 700+ add-
ons in the Directory service
Wrap an existing web component or Web
Component component for Vaadin
Create the component using low level web
technologies (GWT, JS, CSS, HTML)
Missing a component?Problems
No abstraction for this part, you need to know
CSS
Configurable Valo Theme engine
<demo via NetBeans>
Theme building
Problems
What if you have a separate UI designer who
masters HTML/CSS, but not Java?
Vaadin Designer?
CustomLayout, HTML template as a layout
Declarative format
Co-operation with (HTML) designersProblems
Performance of what? The UI or the server?
You are not Google! But even they send every key
press to the server
For sure, it saves more stuff to session than e.g.
React + REST. But often less stress for DB and
business logic.
Concern by many, problem for rare.
Scales well enough, most often same bottlenecks
as with everybody else.
End user performance often better than with
traditional SPAs, on mobile connections as well!
Performance against "stateless" web technologiesProblems
WHAT NEXT?W H E R E A R E W E CO M I N G F R O M A N D W H E R E A R E W E G O I N G N E X T
2000
2002
The company Vaadin was founded.
18kCOMMITS*
2009
2012
2013
Vaadin 7, improvements for windowing, data binding,
extensibility
Vaadin 3.0 (MillStone) was open sourced.
Vaadin 6, easily extensible GWT based client side
rendering engine
Vaadin 7.3, WebSocket based communication
channel
Vaadin 2000-2017
9kTICKETS
136CODE
CONTRIBUTORS
182MAINTENANCE
RELEASES
2007
First stable version of AJAX adapter.
2017Vaadin 8 Large API
modernisation
* ) S I N C E V E R S I O N 3
CORE PRO PRIME
Core Elements
Flow Framework
Extensive Documentation
Add-on Directory
TestBench
Chart Elements
Pro Elements
Warranty
Expert Chat
Development on Demand
FREE$100 / MONTH
PER 1 DEVELOPER
ANNUAL SUBSCRIPTION
$890 / MONTH MORE THAN 3 DEVELOPERS
ANNUAL SUBSCRIPTION
Open core business model
What next?
We’ll keep on fighting for simplicity!
Big release tomorrow, visit out booth!
• Web Components
• Vaadin Elements
๏ Improved modularisation
๏ Expanding also for non-Java developers
• Improving core APIs Java
๏ Routing/navigation/deep linking
๏ Data binding
๏ More advanced, client-sided enabled
template support
How to get started?How to try out Vaadin?
How to get inspired by the features of Vaadin NetBeans plugin?
• Install Vaadin NetBeans Plugin via the plugins
dialog
• Follow Vaadin tutorial: vaadin.com/framework
• github.com/vaadin (Vaadin Framework, Vaadin
Elements, Vaadin NetBeans Plugin)
• github.com/mstahv (my numerous Vaadin
examples)
Matti Tahvonen
DEVELOPER ADVOCATE, VAADIN
Questions?Thank you!
@mattitahvonen
Recommended