Web Push Notifications - End to End implementation

A shot of code October 6, 2019
Video Thumbnail

A shot of code

View Channel

About

No channel description available.

Video Description

In this video we create a working implementation of web push notifications using the 'web-push' npm package and a web page with a push handler in the service worker. Links to the samples used: https://github.com/web-push-libs/web-push https://developers.google.com/web/ilt/pwa/introduction-to-push-notifications P.S Just joined buy me a coffee :-) https://www.buymeacoffee.com/ashotofcode Github link: https://github.com/MarkJamesHoward/push 0:00 Intro 1:00 Install web-push for s server side 1:21 Create hosting webpage with Subscribe button 1:45 Add Service Worker Registration 3:00 Implement Subscribe Button (Call Subscribe on PushManager) 3:50 Add ApplicationServerKey on Web Page 5:50 Generate VAPI Keys 6:30 Add VAPI Public Key to Web Page 6:50 Set VAPI Details 8:00 Create Service Worker 8:20 Handle Push Event in Service Worker 9:15 Push Site into Github (link in description) 10:25 Push Site into Netlify to host 11:40 Subscription Details to store in DB 13:30 Perform Push! 14:12 Push Working in Chrome Browser 14:30 Push Working in Firefox (but me not noticing alert!) 15:28 Push working in Edge Browser

You May Also Like