Pavel Jetenský

jOpenSpace Řijen 2024

Vaadin - flow ^v24�Java Backend programmer’s frontend heaven

Demo first

• 4000 lines of code
• .kt
• .java
• Links
• Asociace bezobalu – ordering system (http://138.3.254.250)
• https://github.com/JetyCZ/abo-b2b.git
• Getting Started | Vaadin Docs

Pavel Jetenský�Vaadin Flow�October 2024

Why should I care?

Implementing whole app:

• frontend UI
• interaction of frontend components with backend
• backend

in strongly typed language (Java)!

Pavel Jetenský�Vaadin Flow�October 2024

Vaadin products insight

• Vaadin flow v24 Versions 7-14 obsolete
• 100% in Java
• Java objects
• server-driven architecture XmlHttpRequest(XHR) or WebSockets
• event-driven component-based programming model
• Hilla Till 2022 Vaadin fusion
• TypeScript + Reactive components
• client-side architecture
• more frontend development

​

“For me, Vaadin flow is ideal for personal projects”

Pavel Jetenský�Vaadin Flow�October 2024

Concepts

• View
• Component
• Layout
• Events
• Binder

​

Pavel Jetenský�Vaadin Flow�October 2024

View - code

Pavel Jetenský�Vaadin Flow�October 2024

Layout

• Parent of all application views
• More info in Tutorial

Pavel Jetenský�Vaadin Flow�October 2024

Component - code

Pavel Jetenský�Vaadin Flow�October 2024

Event handling

• Java Event handlers can be attached to frontent elements
• addValueChangeListener
• addClickListener & addDoubleClickListener
• addKeyDownListener
• addKeyPressListener
• addFocusListener
• Event handling code can interact with frontend

​

Pavel Jetenský�Vaadin Flow�October 2024

Event handling - code

Pavel Jetenský�Vaadin Flow�October 2024

Binder

• Creates binding between Java objects and Form frontend fields
• Binding is two-directional!
• Reading & writing to UI in Java

​

Pavel Jetenský�Vaadin Flow�October 2024

Thank you!

• Time left :)?
• Show LiveReload

​

Pavel Jetenský�Vaadin Flow�October 2024