LitElement tutorial part 5: PWA and offline

Text version and code: vaadin.com/tutorials/lit-elem...
Note: the npm package name and import path for lit-element has changed from @polymer/lit-element to just lit-element. Check the text version for up to date code snippets
In this tutorial, you learn how to turn the app you built in the previous tutorials into a offline-capable PWA.
Previous video: • LitElement tutorial pa...

[@Oswee]

For sure really great videos. One of the highest quality available out there in wild wild KZbin. :) I am new in javascript and would like to see more simple practical usecases. Like.. examples of mine interest: 1) WebPack setup for working with Web Components + plugins for VS Code. Lit-Html for example. 2) Mid/Large project code layout, good practices design pattern for this modern (future) web. 3) Mby some work with Fetch under CORS policy and (.then, .then .then .then, .catch) 4) Creating toolbars and functionality (Create New Order, Open Panel, etc) 5) Working with dialogs and dialogs from dialogs (parent/child dialogs) and managing z-index of those. Passing data from one dialog to other 6) Custom context menu with option to open selected entity (like open user profile) 7) WebSockets notifications or... data grids or... whatever. Buffered scrolling. 8) Managing representational (dumb components) and functional components. Like how to organize them. Some are layout level components, some are element level components, etc. 9) Component and application theming/translation Basically anything of all this new "JavaScript 2020" thing. But this is strongly just my newbie opinion . I am curious about all this custom elements workflow.

[@marcushellberg13]

Thanks. Those are good suggestions. I'll add them to our idea backlog :)

[@dvselva]

Thanks for this tutorial. very helpful.

[@ArnavSingh-im5bj]

Great series

[@lars4953]

Great tutorials. Make more plz. But I have a problem. The PWA works on my local computer fine, also offline. But when I try to use it offline on my smartphone, it shows only "No internet ...". It is the same with the code from git. I don't know. Did I something rwong?

[@marcushellberg13]

Thanks for the kind words! ServiceWorker requires HTTPS to work on anything but localhost. Try deploying the app to a hosting that supports HTTPS and it should work. GitHub Pages is a good free option if you don't have another host.

[@kristina0403]

Great videos! Link to code is asking for username/password...

[@marcushellberg13]

Thanks for letting me know. I had it pointing to the internal preview server by mistake. Fixed now!