Vaadin + PWA problem

Hello.
My need is to make data available offline in a grid (populated by database).
I have adopted the solution, as per title, of the PWA framework. I’ve added the necessary files (app.js, sw.js, manifest.json), but when I click on the Chrome “Offline” checkbox, the application loses the data.

Can you give me examples of starting a Vaadin application that contains data in a grid, can you also work offline?

Thank you
GB

Hi Giovanni!
The best example to start learning Vaadin PWA applications is the
Expense Manager Demo
.
I also recommend you, to read
this article
, that analyzes in depth, PWA applications.
Regards!

There is also a webinar here https://vaadin.com/forum#!/thread/14018664

Best regards

Hi Martin and Marco.

Thank you for the reply.

I’m taking it as an example “Expense Manager Demo”. My problem is that in the Vaadin application I can not find, or rather do not know, extract the html files that I find under the src directory of the example. Much less the various json. I tried to run “polymer build” in the Vaadin project’s src directory, but without success.

What’s wrong with you?
Thanks again

Hi Martin.

But given a Vaadin project ready, with grids populated by a database, after executing “polymer build” from the root of the project, I have no result.
With all my chances I miss something.

Thank you

Giovanni, if you want to build the project locally and try it, you have to follow the
instructions of the GitHub page
.
An important thing to note, is that the demo uses Vaadin Charts, which will ask for a license. You can close the window to try out the app without a license.
Regards

Hello.

I added that I followed the following tutorial:
https://vaadin.com/blog?p_p_id=33&p_p_lifecycle=0&p_p_state=normal&p_p_mode=view&p_p_col_id=column-1&p_p_col_pos=3&p_p_col_count=5&p_r_p_564233524_tag=offline.

When I put my browser offline and I refresh the page, I get the following error:
“Failed to load the widgetset: ./VAADIN/widgetsets/ws995…dd16/ws996…dd16.nocache.js?1499…180”

My fileToCache:
var filesToCache = [
‘./’,
‘./VAADIN/themes/mytheme/styles.css?v=8.0.6’,
‘./VAADIN/js/app.js’,
];

Thank’s