KEMBAR78
Vaadin Flow - How to start - a short intro for Java Devs | PDF
N A N O - V A A D I N
@ S V E N R U P P E R T
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
N A N O - V A A D I N
@ S V E N R U P P E R T
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
F O R J AVA D E V S
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
D I S T R I B U T E D S Y S T E M S S I N C E 2 0 0 2
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
C O N S U LT I N G W O R L D W I D E
D I S T R I B U T E D S Y S T E M S S I N C E 2 0 0 2
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
C O N S U LT I N G W O R L D W I D E
D I S T R I B U T E D S Y S T E M S S I N C E 2 0 0 2
J O I N E D VA A D I N 2 0 1 7
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
C O N S U LT I N G W O R L D W I D E
D I S T R I B U T E D S Y S T E M S S I N C E 2 0 0 2
J O I N E D VA A D I N 2 0 1 7
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
C O N S U LT I N G W O R L D W I D E
Private Sector: Automotive / Aerospace / SMB /
D I S T R I B U T E D S Y S T E M S S I N C E 2 0 0 2
J O I N E D VA A D I N 2 0 1 7
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
C O N S U LT I N G W O R L D W I D E
Public Sector: Military / Government
Private Sector: Automotive / Aerospace / SMB /
D I S T R I B U T E D S Y S T E M S S I N C E 2 0 0 2
J O I N E D VA A D I N 2 0 1 7
S V E N R U P P E R T 

Developer Advocate @ Vaadin
5
C O D I N G J AVA S I N C E 1 9 9 6
C O N S U LT I N G W O R L D W I D E
Public Sector: Military / Government
Private Sector: Automotive / Aerospace / SMB /
NonProfit / NonGov: World Bank / UN / YPARD / CGIAR
D I S T R I B U T E D S Y S T E M S S I N C E 2 0 0 2
J O I N E D VA A D I N 2 0 1 7
@SvenRuppert
H E L L O VA A D I N W O R L D
Intro
4
@SvenRuppertBird-Eye-View
Desktop
ServerlessUI
Development Environment
MicroServices
5
@SvenRuppertBird-Eye-View
Desktop WEB
Core Java
JavaScript
HTML5
CSS
5
@SvenRuppertBird-Eye-View
Desktop WEB
Core Java
JavaScript
HTML5
CSS
!=
6
@SvenRuppertBird-Eye-View
6
@SvenRuppertBird-Eye-View
7
@SvenRuppertWeb-Tech-Stack is complex?
7
@SvenRuppertWeb-Tech-Stack is complex?
8
Intro - Hello Vaadin @SvenRuppert
You don´t need to join the dark side of web development
8
Intro - Hello Vaadin @SvenRuppert
You don´t need to join the dark side of web development
Stay
on
the
serverside
9
Intro - Hello Vaadin @SvenRuppert
You don´t need to join the dark side of web development
5
O S O P H Y
ee of it is the user interface. The user
he users experience the business
perience. Simplicity is king and the
orking on the device they happen to
d invite everyone to join this fight.
s a smile on the user’s face.
s to build the best web-apps for
is developer productivity because
ence and saving the developer’s
user interfaces.
us. When everyone - both us and
ding of what Vaadin is and what we
ify. This book defines what we want
is.
nd breathing the Vaadin brand as
e thinks about Vaadin - using this
developers!
10
Intro - Hello Vaadin @SvenRuppert
10
Intro - Hello Vaadin @SvenRuppert
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
HTML5/CSS - pure client side
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
HTML5/CSS - pure client side
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
HTML5/CSS - pure client side
Data / state / commands - connection to server side
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
HTML5/CSS - pure client side
Data / state / commands - connection to server side
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
HTML5/CSS - pure client side
Data / state / commands - connection to server side
Server side representation of the component / state
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
HTML5/CSS - pure client side
Data / state / commands - connection to server side
Server side representation of the component / state
11
@SvenRuppert
CommunicationWebComponent Java Component Java TEST - Component
Intro - Hello Vaadin
HTML5/CSS - pure client side
Data / state / commands - connection to server side
Server side representation of the component / state
Selenium version on the server side for TDD
12
Intro - Hello Vaadin @SvenRuppert
Java Component
Java TEST - Component
Communication
WebComponent
12
Intro - Hello Vaadin @SvenRuppert
Java Component
Java TEST - Component
Communication
WebComponent
12
Intro - Hello Vaadin @SvenRuppert
Java Component
Java TEST - Component
Bundled / Versioned
Communication
WebComponent
12
Intro - Hello Vaadin @SvenRuppert
Java Component
Java TEST - Component
Bundled / Versioned
Communication
WebComponent
Vaadin Platform
Java Component
Java TEST - Component
Communication
WebComponent
13
Intro - Hello Vaadin @SvenRuppert
Bundled / Versioned
Java Component
Java TEST - Component
Communication
WebComponent
13
Intro - Hello Vaadin @SvenRuppert
Bundled / Versioned
3rd Party Web Component
Java Component
Java TEST - Component
Communication
WebComponent
13
Intro - Hello Vaadin @SvenRuppert
Bundled / Versioned
3rd Party Web Component
2019-09-26
1815 - 1900
WebComponents - for Java Devs
@SvenRuppert
VA A D I N S TA R T E R S
Hello World
15
@SvenRupperthttps://vaadin.com
15
@SvenRupperthttps://vaadin.com
16
@SvenRupperthttps://vaadin.com
16
@SvenRupperthttps://vaadin.com
17
@SvenRupperthttps://vaadin.com
17
@SvenRupperthttps://vaadin.com
17
@SvenRupperthttps://vaadin.com
17
@SvenRupperthttps://vaadin.com
18
@SvenRupperthttps://vaadin.com
18
@SvenRupperthttps://vaadin.com
18
@SvenRupperthttps://vaadin.com
@SvenRuppert
J AVA / K O T L I N / D O C K E R
Nano Vaadin
20
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
21
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Why?
21
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Why?
Maven is slow, compared to a plain main method
21
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Why?
Maven is slow, compared to a plain main method
Target is a fat jar anyway in my case
21
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Why?
Maven is slow, compared to a plain main method
Target is a fat jar anyway in my case
Short restart cycles are needed for development
21
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Why?
Maven is slow, compared to a plain main method
Target is a fat jar anyway in my case
Short restart cycles are needed for development
Different Servlet-Containers
21
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Why?
Maven is slow, compared to a plain main method
Target is a fat jar anyway in my case
Short restart cycles are needed for development
Different Servlet-Containers
Jetty / Undertow / Meecrowave / Quarkus
21
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Why?
Maven is slow, compared to a plain main method
Target is a fat jar anyway in my case
Short restart cycles are needed for development
Different Servlet-Containers
Jetty / Undertow / Meecrowave / Quarkus
Minimal Techstack
22
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Jetty
23
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
23
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
public void startup() {
try {
WebAppContext context = new WebAppContext();
context.setLogUrlOnStart(true);
context.setConfigurationDiscovered(true);
context.setConfigurations(new Configuration[]{
new AnnotationConfiguration(),
new WebInfConfiguration(),
new WebXmlConfiguration(),
new MetaInfConfiguration()
});
23
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
public void startup() {
try {
WebAppContext context = new WebAppContext();
context.setLogUrlOnStart(true);
context.setConfigurationDiscovered(true);
context.setConfigurations(new Configuration[]{
new AnnotationConfiguration(),
new WebInfConfiguration(),
new WebXmlConfiguration(),
new MetaInfConfiguration()
});
23
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
public void startup() {
try {
WebAppContext context = new WebAppContext();
context.setLogUrlOnStart(true);
context.setConfigurationDiscovered(true);
context.setConfigurations(new Configuration[]{
new AnnotationConfiguration(),
new WebInfConfiguration(),
new WebXmlConfiguration(),
new MetaInfConfiguration()
});
context.setContextPath("/");
Resource classPathResource
= Resource.newClassPathResource(
„/META-INF/resources", true, true);
context.setBaseResource(classPathResource);
context.setAllowNullPathInfo(true);
context.setAttribute(JAR_PATTERN , ".*");
23
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
public void startup() {
try {
WebAppContext context = new WebAppContext();
context.setLogUrlOnStart(true);
context.setConfigurationDiscovered(true);
context.setConfigurations(new Configuration[]{
new AnnotationConfiguration(),
new WebInfConfiguration(),
new WebXmlConfiguration(),
new MetaInfConfiguration()
});
context.setContextPath("/");
Resource classPathResource
= Resource.newClassPathResource(
„/META-INF/resources", true, true);
context.setBaseResource(classPathResource);
context.setAllowNullPathInfo(true);
context.setAttribute(JAR_PATTERN , ".*");
23
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
public void startup() {
try {
WebAppContext context = new WebAppContext();
context.setLogUrlOnStart(true);
context.setConfigurationDiscovered(true);
context.setConfigurations(new Configuration[]{
new AnnotationConfiguration(),
new WebInfConfiguration(),
new WebXmlConfiguration(),
new MetaInfConfiguration()
});
context.setContextPath("/");
Resource classPathResource
= Resource.newClassPathResource(
„/META-INF/resources", true, true);
context.setBaseResource(classPathResource);
context.setAllowNullPathInfo(true);
context.setAttribute(JAR_PATTERN , ".*");
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
Server server = new Server(Integer.parseInt(
getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)));
server.setHandler(context);
server.start();
server.join();
jetty = Result.success(server);
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
Server server = new Server(Integer.parseInt(
getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)));
server.setHandler(context);
server.start();
server.join();
jetty = Result.success(server);
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
Server server = new Server(Integer.parseInt(
getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)));
server.setHandler(context);
server.start();
server.join();
jetty = Result.success(server);
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
Server server = new Server(Integer.parseInt(
getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)));
server.setHandler(context);
server.start();
server.join();
jetty = Result.success(server);
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
Server server = new Server(Integer.parseInt(
getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)));
server.setHandler(context);
server.start();
server.join();
jetty = Result.success(server);
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
Server server = new Server(Integer.parseInt(
getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)));
server.setHandler(context);
server.start();
server.join();
jetty = Result.success(server);
24
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Jetty
Server server = new Server(Integer.parseInt(
getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)));
server.setHandler(context);
server.start();
server.join();
jetty = Result.success(server);
5 Sec are to long !!
25
@SvenRupperthttps://github.com/Nano-Vaadin-Demos
Undertow
26
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
public void startup() {
final LocalDateTime start = LocalDateTime.now();
final ClassLoader classLoader =
CoreUIJavaService.class.getClassLoader();
DeploymentInfo servletBuilder
= Servlets.deployment()
.setClassLoader(classLoader)
.setContextPath("/")
.setDeploymentName("ROOT.war")
.setDefaultEncoding("UTF-8")
.setResourceManager(new ClassPathResourceManager(
classLoader,
"META-INF/resources/"))
.addServletContainerInitializer(
new ServletContainerInitializerInfo(
RouteRegistryInitializer.class,
setOfRouteAnnotatedClasses()))
.addListener(
Servlets.listener(ServletDeployer.class));
26
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
public void startup() {
final LocalDateTime start = LocalDateTime.now();
final ClassLoader classLoader =
CoreUIJavaService.class.getClassLoader();
DeploymentInfo servletBuilder
= Servlets.deployment()
.setClassLoader(classLoader)
.setContextPath("/")
.setDeploymentName("ROOT.war")
.setDefaultEncoding("UTF-8")
.setResourceManager(new ClassPathResourceManager(
classLoader,
"META-INF/resources/"))
.addServletContainerInitializer(
new ServletContainerInitializerInfo(
RouteRegistryInitializer.class,
setOfRouteAnnotatedClasses()))
.addListener(
Servlets.listener(ServletDeployer.class));
26
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
public void startup() {
final LocalDateTime start = LocalDateTime.now();
final ClassLoader classLoader =
CoreUIJavaService.class.getClassLoader();
DeploymentInfo servletBuilder
= Servlets.deployment()
.setClassLoader(classLoader)
.setContextPath("/")
.setDeploymentName("ROOT.war")
.setDefaultEncoding("UTF-8")
.setResourceManager(new ClassPathResourceManager(
classLoader,
"META-INF/resources/"))
.addServletContainerInitializer(
new ServletContainerInitializerInfo(
RouteRegistryInitializer.class,
setOfRouteAnnotatedClasses()))
.addListener(
Servlets.listener(ServletDeployer.class));
26
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
public void startup() {
final LocalDateTime start = LocalDateTime.now();
final ClassLoader classLoader =
CoreUIJavaService.class.getClassLoader();
DeploymentInfo servletBuilder
= Servlets.deployment()
.setClassLoader(classLoader)
.setContextPath("/")
.setDeploymentName("ROOT.war")
.setDefaultEncoding("UTF-8")
.setResourceManager(new ClassPathResourceManager(
classLoader,
"META-INF/resources/"))
.addServletContainerInitializer(
new ServletContainerInitializerInfo(
RouteRegistryInitializer.class,
setOfRouteAnnotatedClasses()))
.addListener(
Servlets.listener(ServletDeployer.class));
26
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
public void startup() {
final LocalDateTime start = LocalDateTime.now();
final ClassLoader classLoader =
CoreUIJavaService.class.getClassLoader();
DeploymentInfo servletBuilder
= Servlets.deployment()
.setClassLoader(classLoader)
.setContextPath("/")
.setDeploymentName("ROOT.war")
.setDefaultEncoding("UTF-8")
.setResourceManager(new ClassPathResourceManager(
classLoader,
"META-INF/resources/"))
.addServletContainerInitializer(
new ServletContainerInitializerInfo(
RouteRegistryInitializer.class,
setOfRouteAnnotatedClasses()))
.addListener(
Servlets.listener(ServletDeployer.class));
27
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
private Set<Class<?>> setOfRouteAnnotatedClasses() {
return new Reflections(
getProperty(CORE_UI_BASE_PKG,
DEFAULT_BASE_PKG))
.getTypesAnnotatedWith(Route.class)
.stream()
.peek(cls -> logger()
.info("found Route annotate class „
+ cls.getName()))
.collect(toSet());
}
27
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
private Set<Class<?>> setOfRouteAnnotatedClasses() {
return new Reflections(
getProperty(CORE_UI_BASE_PKG,
DEFAULT_BASE_PKG))
.getTypesAnnotatedWith(Route.class)
.stream()
.peek(cls -> logger()
.info("found Route annotate class „
+ cls.getName()))
.collect(toSet());
}
28
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
final WebSocketDeploymentInfo webSocketDeploymentInfo
= new WebSocketDeploymentInfo();
servletBuilder.addServletContextAttribute(
WebSocketDeploymentInfo.ATTRIBUTE_NAME, webSocketDeploymentInfo);
final DeploymentManager manager = Servlets.defaultContainer()
.addDeployment(
servletBuilder);
manager.deploy();
28
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
final WebSocketDeploymentInfo webSocketDeploymentInfo
= new WebSocketDeploymentInfo();
servletBuilder.addServletContextAttribute(
WebSocketDeploymentInfo.ATTRIBUTE_NAME, webSocketDeploymentInfo);
final DeploymentManager manager = Servlets.defaultContainer()
.addDeployment(
servletBuilder);
manager.deploy();
28
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
final WebSocketDeploymentInfo webSocketDeploymentInfo
= new WebSocketDeploymentInfo();
servletBuilder.addServletContextAttribute(
WebSocketDeploymentInfo.ATTRIBUTE_NAME, webSocketDeploymentInfo);
final DeploymentManager manager = Servlets.defaultContainer()
.addDeployment(
servletBuilder);
manager.deploy();
PathHandler path = path(redirect("/"))
.addPrefixPath("/", manager.start());
Undertow u = Undertow.builder()
.addHttpListener(
Integer.parseInt(getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)),
getProperty(CORE_UI_SERVER_HOST,
CORE_UI_SERVER_HOST_DEFAULT))
.setHandler(path)
.build();
u.start();
29
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
PathHandler path = path(redirect("/"))
.addPrefixPath("/", manager.start());
Undertow u = Undertow.builder()
.addHttpListener(
Integer.parseInt(getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)),
getProperty(CORE_UI_SERVER_HOST,
CORE_UI_SERVER_HOST_DEFAULT))
.setHandler(path)
.build();
u.start();
29
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
PathHandler path = path(redirect("/"))
.addPrefixPath("/", manager.start());
Undertow u = Undertow.builder()
.addHttpListener(
Integer.parseInt(getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)),
getProperty(CORE_UI_SERVER_HOST,
CORE_UI_SERVER_HOST_DEFAULT))
.setHandler(path)
.build();
u.start();
29
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
PathHandler path = path(redirect("/"))
.addPrefixPath("/", manager.start());
Undertow u = Undertow.builder()
.addHttpListener(
Integer.parseInt(getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)),
getProperty(CORE_UI_SERVER_HOST,
CORE_UI_SERVER_HOST_DEFAULT))
.setHandler(path)
.build();
u.start();
29
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
PathHandler path = path(redirect("/"))
.addPrefixPath("/", manager.start());
Undertow u = Undertow.builder()
.addHttpListener(
Integer.parseInt(getProperty(
CORE_UI_SERVER_PORT,
CORE_UI_SERVER_PORT_DEFAULT)),
getProperty(CORE_UI_SERVER_HOST,
CORE_UI_SERVER_HOST_DEFAULT))
.setHandler(path)
.build();
u.start();
29
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
30
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
30
@SvenRupperthttps://github.com/Nano-Vaadin-Demos Undertow
31
@SvenRuppertServlet Container
Jetty: 5,6 sec
Undertow: 0,8 sec
1min = 10,7 starts
1min = 75 starts
Approx factor 7
31
@SvenRuppertServlet Container
Jetty: 5,6 sec
Undertow: 0,8 sec
1min = 10,7 starts
1min = 75 starts
Approx factor 7
With Undertow it is allowed to make
seven times more mistakes
@SvenRuppert
J AVA / K O T L I N / D O C K E R
First Vaadin View
33
@SvenRuppertVaadin View
@Route("")
public class MainView
extends Composite<VerticalLayout>
implements HasLogger {
private final Button btn = new Button();
private final TextField input = new TextField();
public MainView() {
final VerticalLayout content = getContent();
input.setPlaceholder("your name, please");
btn.setText("Click Me");
btn.addClickListener(event -> {
if(input.isEmpty()){
logger().info("clicked without input value");
} else
content.add(new Span(input.getValue()));
});
content.add(new Span("Hello World"), btn, input);
}
}
33
@SvenRuppertVaadin View
@Route("")
public class MainView
extends Composite<VerticalLayout>
implements HasLogger {
private final Button btn = new Button();
private final TextField input = new TextField();
public MainView() {
final VerticalLayout content = getContent();
input.setPlaceholder("your name, please");
btn.setText("Click Me");
btn.addClickListener(event -> {
if(input.isEmpty()){
logger().info("clicked without input value");
} else
content.add(new Span(input.getValue()));
});
content.add(new Span("Hello World"), btn, input);
}
}
33
@SvenRuppertVaadin View
@Route("")
public class MainView
extends Composite<VerticalLayout>
implements HasLogger {
private final Button btn = new Button();
private final TextField input = new TextField();
public MainView() {
final VerticalLayout content = getContent();
input.setPlaceholder("your name, please");
btn.setText("Click Me");
btn.addClickListener(event -> {
if(input.isEmpty()){
logger().info("clicked without input value");
} else
content.add(new Span(input.getValue()));
});
content.add(new Span("Hello World"), btn, input);
}
}
34
@SvenRuppertVaadin View
35
@SvenRuppertVaadin View
https://vaadin.com
@SvenRuppert
T E S T I N G W E B A P P S W I T H J AVA
TESTBENCH
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Testing WebApps is a bit more complex. Why?
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Testing WebApps is a bit more complex. Why?
WebApp
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Testing WebApps is a bit more complex. Why?
BrowserWebApp
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Testing WebApps is a bit more complex. Why?
BrowserWebApp Robot
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Selenium
Testing WebApps is a bit more complex. Why?
BrowserWebApp Robot
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Selenium
Testing WebApps is a bit more complex. Why?
BrowserWebApp Robot
Test-Definition
37
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Selenium
Testing WebApps is a bit more complex. Why?
BrowserWebApp Robot
Test-Definition
Test - Runtime
38
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Selenium Testbench
WebElement ButtonElement
38
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Selenium Testbench
WebElement ButtonElement
Com
m
ercial
39
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
Subject to test
Start WebDriver
Stop WebDriver
Start ServletContainer
Stop ServletContainer
context
Context
OneTest
Stop PageObject
Create PageObject
Testing WebApps is a bit more complex. Why?
40
@SvenRuppertTestbench
CommunicationWebComponent Java Component Java TEST - Component
public class SimpleIT extends TestBenchTestCase {
@Before
public void setup() throws Exception {
// Create a new browser instance
setDriver(new ChromeDriver());
// Open the application
getDriver().get("http://localhost:8080/");
}
@Test
public void clickButton() {
// Find the first button (<vaadin-button>) on the page
ButtonElement button = $(ButtonElement.class).first();
// Click it
button.click();
// Check the the value of the button is "Clicked"
Assert.assertEquals("Clicked", button.getText());
}
@After
public void tearDown() throws Exception {
// close the browser instance when all tests are done
getDriver().quit();
}
}
Junit4
@SvenRuppert
C O M P I L E / D E P L O Y / T E S T
Docker
42
@SvenRuppertDocker
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-shade-plugin</artifactId>
<version>3.2.1</version>
<executions>
<execution>
<phase>package</phase>
<goals>
<goal>shade</goal>
</goals>
<configuration>
<finalName>vaadin-app</finalName>
<transformers>
<transformer implementation="org.apache.maven.plugins.shade.resource.ManifestResourceTransformer">
<manifestEntries>
<!-- <Main-Class>demo.StartupJava</Main-Class>-->
<Main-Class>demo.StartupKotlinKt</Main-Class>
</manifestEntries>
</transformer>
</transformers>
</configuration>
</execution>
</executions>
</plugin>
43
@SvenRuppertDocker
#!/usr/bin/env bash
docker run 
--rm 
--name compile 
-v "$(pwd)":/usr/src/mymaven 
-w /usr/src/mymaven 
svenruppert/maven-3.6.1-adopt:1.8.212-04:latest 
mvn clean package -Dmaven.test.skip=false -Dvaadin-install-nodejs
44
@SvenRuppertDocker
#!/bin/bash
docker run 
-it 
-p 8899:8899 
--rm 
--name run 
-v "$(pwd)":/usr/src/mymaven 
-w /usr/src/mymaven 
svenruppert/adopt:1.8.212-04:latest 
java -jar target/vaadin-app.jar
45
@SvenRuppertDocker
FROM svenruppert/adopt:1.8.212-04
MAINTAINER sven.ruppert@gmail.com
ARG USER_HOME_DIR="/root"
COPY target/vaadin-app.jar .
EXPOSE 8899
CMD ["java", "-jar", "vaadin-app.jar"]
#!/bin/bash
docker build -t nanovaadin/undertow .
docker tag nanovaadin/undertow:latest nanovaadin/undertow:001
docker push nanovaadin/undertow:001
docker push nanovaadin/undertow:latest
46
@SvenRuppertDocker
#!/bin/bash
docker run 
-it 
-p 8899:8899 
--rm 
--name nanovaadin-undertow 
nanovaadin/undertow:latest
Summary
47
@SvenRuppert
please, follow me ;-)
@SvenRuppert
Summary
47
@SvenRuppert
please, follow me ;-)
@SvenRuppert
Thank You !!!

Vaadin Flow - How to start - a short intro for Java Devs