Vaadin Reference

This section documents the current Vaadin release line — Vaadin 24 LTS / 25.x, Java 17+, Spring Boot 3 / Jakarta EE 10 — as published at the official Vaadin documentation, which is the reference these pages are written and verified against. No specific patch version is pinned. Flow (server-side Java) is the authoring style used throughout, with Hilla / React shown where it differs; Vaadin 7 and the pre-Flow architecture appear only as migration contrast.

This content was generated with the assistance of AI and should be verified against the official documentation before being relied on in production, since Vaadin ships major releases roughly twice a year and its ecosystem iterates.

This section’s bibliography lists the reference material consulted while preparing these pages.

Welcome to the Vaadin reference. Vaadin is an open-source Java web framework for building business web applications without hand-writing HTML or JavaScript: you describe the UI as a server-side tree of components, and Vaadin keeps a set of Web Components in the browser in sync with it over an automatic client—​server channel. This section documents the current Vaadin release line — Vaadin 24 LTS and the latest Vaadin 25.x — using Flow (the Java UI model) throughout, with Hilla (React + TypeScript) shown where it differs, written and verified against the official documentation.

If you are new to Vaadin, start with Getting Started and Architecture, then Components Overview, Layouts and Data Binding, then work down the list or jump to what you need.

What’s covered

Fundamentals

  • Getting Started — what Vaadin is, the Flow and Hilla models and the Web Components they share, open-source versus commercial editions, creating and running a project, the project structure, dev mode and Copilot, and the Vaadin 24 / 25 baselines.

  • Architecture — the server-side component tree and the client engine, UI / VaadinSession / VaadinService, the state-sync channel, the thread model and the session lock, and request handling.

  • Components Overview — the Component model and the Has* mixins, enabled and visible state, a grouped tour of the 40+ built-in components, and which ones are commercial.

  • Layouts — VerticalLayout / HorizontalLayout and the flexbox model, sizing and alignment, FlexLayout, FormLayout, SplitLayout, AppLayout, and Composite.

Input, forms and data

  • Input Components — the data-entry fields, the HasValue contract, value-change modes, and the shared required / helper-text / prefix / suffix features.

  • Data Binding — Binder and BeanValidationBinder, Converter and Validator, readBean / writeBean / writeBeanIfValid, and buffered versus unbuffered binding.

  • The Grid Component — columns and renderers, in-memory setItems versus a lazy DataProvider, selection, item details and styling, the Grid editor and GridPro, and TreeGrid.

  • Forms, CRUD and Master-Detail — assembling a bound form, a master-detail view, the CRUD component, ConfirmDialog, and optimistic locking.

Navigation and interaction

  • Routing and Navigation — @Route and RouterLink, route parameters and templates, the BeforeEnter / BeforeLeave / AfterNavigation lifecycle, RouterLayout, page titles, error views, and a SideNav menu.

  • Interaction and Overlays — buttons and shortcuts, MenuBar and ContextMenu, Notification, Dialog, Popover, Tooltip, the Tabs / Accordion / Details containers, and drag and drop.

  • Server Push — @Push and the transports, UI.access and the session lock, background work with VaadinExecutor, broadcasting to many UIs, and the @Poll alternative.

Client side and extensibility

  • The Element API and Web Components — reaching the DOM from Java, DOM events, executeJs and @ClientCallable, and integrating a web component with @Tag / @NpmPackage / @JsModule.

  • Building Custom Components — Composite, extending a component, building from an element, a value-bearing CustomField, and packaging an add-on.

  • Hilla and React Views — @BrowserCallable endpoints and the generated client, file-based routing, @vaadin/react-components, Hilla forms, endpoint security, reactive endpoints and signals, and mixing Flow with Hilla.

Styling and design

  • Theming and Styling — the theme folder and @Theme, Base / Lumo / Aura, Lumo CSS custom properties and the dark variant, theme and component variants, utility classes, and styling internals with ::part().

  • Responsive Design and PWA — responsive FormLayout and AppLayout, Lumo breakpoint utilities, @PWA and the service worker, Web Push, and the Designing Apps guidance.

Integration and backend

  • Spring Boot Integration — the starter, @SpringComponent and the Vaadin scopes, injecting services, a Spring Data JPA CRUD, and the vaadin.* properties.

  • Jakarta EE and CDI — the vaadin-cdi add-on and its scopes, injection and CDI events, deploying a WAR, a JPA CRUD, and the Quarkus extension.

  • Data Persistence — Spring Data JPA, jOOQ and Flyway, a lazy Grid over a paginated repository, the @Transactional boundary, and refreshing a DataProvider.

  • REST and Services — a service layer, exposing a @RestController alongside Flow, calling an external API off the UI thread, and endpoint versus REST.

Security

  • Security — VaadinWebSecurity over Spring Security, route protection with @AnonymousAllowed / @PermitAll / @RolesAllowed, navigation access control, a login view, AuthenticationContext, CSRF and CSP, and securing Hilla endpoints.

Quality and delivery

  • Testing — browserless UI unit tests with vaadin-testbench-unit, end-to-end tests with TestBench, the Playwright and Selenium options, load testing, and testing with Spring.

  • Production and Deployment — the production build and the optimised bundle, licence validation, WAR / jar / Docker / native-image targets, reverse proxies and sticky sessions, and clustering.

  • Configuration and Dev Tools — the vaadin.* properties, the frontend toolchain, hot deploy and live reload, feature flags, the dev tools window and Copilot, @NpmPackage, and Maven versus Gradle.

Advanced

  • Advanced Topics — lifecycle listeners, a custom ErrorHandler and system messages, @PreserveOnRefresh, the loading indicator, downloads and uploads, long-running tasks, and internationalisation with I18NProvider.

UI component libraries

  • UI Component Libraries — the built-in component set, the open-source add-ons worth knowing (Flow-Viritin, SO Charts, ApexCharts for Flow, Flowing Code), using Vaadin’s Web Components standalone, a decision aid, and the commercial Pro / Prime components and Kits.

Reference

  • Cheat sheet — a one-page, downloadable PDF summary of the essentials above for quick memorization.

Bibliography