36
Web Push API

Web Push API

Embed Size (px)

Citation preview

Page 1: Web Push API

Web Push API

Page 2: Web Push API

Short-circuit

• https://serviceworke.rs : “Push Simple”

• https://developer.mozilla.org/en-US/docs/Web/API/Push_API

• https://developers.google.com/web/fundamentals/getting-started/push-notifications/?hl=en

Page 3: Web Push API
Page 4: Web Push API

Push Benefits

• Inform & re-engage “offline” users

• New Content

• Order Status

• etc.

• No pop-up ad please

Page 5: Web Push API

Push = more engagement

Page 6: Web Push API
Page 7: Web Push API
Page 8: Web Push API
Page 9: Web Push API

Web = reach more users

Page 10: Web Push API

http://venturebeat.com/2015/09/25/wait-what-mobile-browser-traffic-is-2x-bigger-than-app-traffic-and-growing-faster/

Page 11: Web Push API
Page 12: Web Push API

Web + Push = more users +

more engagement

Page 13: Web Push API

Warning: Don’t do it wrong

Page 14: Web Push API

Pop-up ads = Doing it wrong

Page 15: Web Push API

https://blog.clevertap.com/app-uninstall-reporting/

Page 16: Web Push API

Annoying Pop-ups = un-installs

Page 17: Web Push API

So: how?

Page 18: Web Push API
Page 19: Web Push API
Page 20: Web Push API
Page 21: Web Push API
Page 22: Web Push API

https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers

Page 23: Web Push API
Page 24: Web Push API
Page 25: Web Push API
Page 26: Web Push API
Page 27: Web Push API
Page 28: Web Push API
Page 29: Web Push API
Page 30: Web Push API
Page 31: Web Push API

https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API

Page 32: Web Push API

Web Push API = Service Workers

+ Push API

+ Notifications API

Page 33: Web Push API
Page 34: Web Push API
Page 35: Web Push API
Page 36: Web Push API

Code & Demo