https://medium.com/@arjenbrandenburgh/angulars-pwa-swpush-and-swupdate-15a7e5c154ac

Not too long ago, I wrote an article Your Angular app as Progressive Web App where I explained why Progressive Web Apps are the future of web applications. In that article I also briefly touched the Angular SwPush and SwUpdate APIs, where I also mentioned I might write an additional article to go deeper into that subject. A promise is a promise, so here it is! I’ll go a bit deeper into the possibilities these two APIs have to offer and show some examples. SwPush and SwUpdate are both conveniently exposed in the same package @angular/service-worker, which we’re obviously going to use.

So before we start, I have to mention that this article is going to mainly focus on the frontend part of things. That being said, we do need a little bit of background information about the backend to be able to create an entire working system. As you’re probably aware, a push message (notification) gets sent from a server somewhere that our web app will act on. The authenticity of these messages can be verified by an encrypted key-pair, making sure that the notifications our app shows are actually coming from us. This key-pair is called VAPID and stands for The Voluntary Application Server Identification for Web Push. When we generate this, we will end up with a public- and private key. Generating your own VAPID keys is so easy, you could have done it in less time than you’ve spent reading this paragraph. You only need two simple commands: