Tag Archives: pwa

Adding Workbox to a @vue/cli PWA

Posted in Javascript on April 10, 2019

Workbox is the workhorse for progressive web apps of today. With only a few lines of code we get precaching, runtime caching and offline mode. In this post I’ll show how to add Workbox to an existing PWA built with @vue/cli and the pwa plugin to obtain a perfect score of 100 in Google’s Lighthouse tool.

Read more

How to add push notifications to a progressive web app

Posted in Javascript on November 21, 2018

This is the second post on building progressive web apps using the new Vue CLI 3. Push notifications will be introduced to create a native app experience. Push notifications require quite some work compared to using the Browser’s Notification API as we did so far. We need to setup a backend and add functionality to subscribe for push notifications. In addition, we also need to create a listener in the service worker to be able to show push notifications. Ready? Let’s go!

Read more

Build a progressive web app using Vue CLI 3

Posted in Javascript on October 19, 2018

Progressive web apps are great! Benefits are a wide reach because they are ‘just’ websites and pop up in search results. Moreover, they are very reliable, fast and engaging. Therefore we will explore how to develop a progressive web app using the latest technology: Vue with the new command line tool @vue/cli and plugins. In this post we quickly scaffold the app and add PWA support. Then we focus on sending notifications using the Notifications API.

Read more