Offline applications with Vaadin 15

December 16, 2019

Vaadin 15 handles bootstrapping and routing on the client side. This enables something which was not easy with Vaadin 14: creating offline apps.

To demonstrate this, we created a small mortgage calculator.

mortgage-app

The server provides the available rates to the UI and also handles the applications, i.e. when the user presses the "Apply" button.

The UI is created using LitElement with routing and bootstrapping on the client side. This combined with a service worker and web manifest allows the application to start when offline. Additionally, a really simple cache is used for the available rates so the application is fully functional when offline, except for the 'Apply' button.

Potentially Interesting parts of the code:

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-vaadin15

Disclaimer

This project is experimental and you probably should not use it in production application. Vaadin does not give any warranty, support or guarantees of applicability, usefulness, availability, security, functionality, performance etc.