Add-ons, Integrations and Tools
- Maven Plugin
- Maven Archetypes
- Using Vaadin with Spring
- CDI Support
- Vaadin Designer
- Vaadin TestBench
- Vaadin Charts
- Vaadin Board
- Vaadin Spreadsheet
Maven Plugin
There is a Maven Plugin available for Vaadin 14. The plugin handles transpilation, minification and bundling of the front-end resources for the production version of the application. This is only necessary when you take the application into production, or want to test it with IE11.
By default there are no custom widgetsets or Sass themes that need compilation for development time in Vaadin 14. The plugin is thus not needed during development, except when testing with IE11.
Maven Archetypes
Besides the project bases that you can find at vaadin.com/hello-world-starters, there is also a vaadin-archetype-application available for you to get your project started.
Using Vaadin with Spring
Vaadin 14 has an integration for using it with Spring.
The concept is mostly the same, but some features like the @ViewScope have been removed.
Also there is currently no specific Spring Security support, although it can still be integrated manually.
The Bakery App Starter for Vaadin Flow and Spring shows an example of this.
CDI Support
There is a CDI Add-on for easier CDI integration and to help using other Java EE features.
Vaadin Designer
In Vaadin 8, Designer was used to edit declarative files with a .html suffix. Despite the file format suffix, the declarative format was a generic XML syntax that mapped directly into a tree of Vaadin components on the server side. The XML was read by Vaadin at runtime on the server, and was never sent to the client. It’s important to note that the syntax only allowed component declarations.
In Vaadin 14 the high level concept is the same. There are still "html template" files that can be edited with Designer to declaratively compose views. But as with Vaadin 14 in general, the underlying technology has completely changed from what it was in Vaadin 8. Starting from Vaadin 14, the templates are written as JavaScript modules, which is a part of the web standard and works natively in modern browsers. The modules define templates and are rendered by the browser, and allow using encapsulated CSS, HTML, Web Components, and JavaScript. Using this new format allows Designer to do a couple of new things. As one major improvement, any template can be rendered inside one another. Furthermore, because templates are themselves Web Components, custom components are now fully supported by the Designer as well. On the other hand, HTML as a syntax is flexible enough that Designer might not work with all templates created in other ways.
Some features of Designer are not available for all Vaadin versions. See the Release Notes for an overview of the feature-level differences.
Migrating from Vaadin 8 Designs
As the underlying technology has been completely changed, Vaadin 8 designs are not compatible with Vaadin 14 applications.
There are two paths to migration; either use Multiplatform Runtime (available through Prime or Enterprise subscription) to run a Vaadin 8 application inside a Vaadin 14 application,
or migrate the HTML files manually. When migrating manually, the declarative component tree should be copied inside the <template> in a blank Vaadin 14 design,
and then modified to fit the new element API’s.
Vaadin TestBench
Vaadin 14 provides access to the same TestBench features that are available for Vaadin 8 but the API has been tweaked in many places to correspond with the changes to the components/elements themselves, as well as the features they offer.
The ElementQuery operation $ no longer has methods such as caption() as there is no generic "caption" concept in Vaadin 14. On the other hand, there is instead a generic attribute(String key, String value) method which can be used to find elements based on any HTML attribute.
The element classes have been moved to a sub package of the component, e.g. com.vaadin.flow.component.textfield.testbench.TextFieldElement instead of com.vaadin.testbench.elements.TextFieldElement.
If any API is missing, there are low level helper methods available such as TestBenchElement.getProperty(String name) and TestBenchElement.callFunction(String name) which makes it easy to interact with any web component with a public JavaScript API.
Vaadin Charts
Vaadin Charts 6 shares a lot of the Java API from Charts 4 even though the underlying technology has been changed. However, almost all of the styling related Java API has been replaced with an ability to style charts using CSS. See list of breaking changes from Charts 4 to Charts 6.