Vaadin 15 handles routing mainly on the client side and only delegates to the server for server side routes. Why? So we can add client side views easily.
In Vaadin 14, you can add a template based view using a two step process:
-
Create the HTML template
-
Create a Java class for the template, so it can be added as a
@Routeor inside another component
With Vaadin 15, this becomes:
-
Create the HTML template
If you want to use the template as a route, then add the tag to the router configuration.
As long as a main layout is implemented as a template and not using the Java API, you can share the layout between client side and server side views.
To demonstrate this, we took the Business App Starter from vaadin.com/start, upgraded to V15 and changed to use Spring Boot, replaced the main layout, menu and app bar with client side versions and rewrote the home and statistics views as a fully client side view.
The result
The app, which looks visually the same as before, is running here: https://labs.vaadin.com/business-hybrid
The source code can be found in GitHub. Of particular interest might be:
Try it out
To try out Vaadin 15, go to https://start.vaadin.com and select 'Typescript' for at least one view.
You can also use the CLI to get an empty project
npx @vaadin/cli init --pre hello-vaadin15What will you use this for? Do you have frontend developers who want to work on your Vaadin project? Do you need client side UI logic for a particular view?
Do tell us more so we know in which direction to take this.