Save 37% off PRO during our Black Friday Sale! »

The web is getting pushy - 4Developers

The web is getting pushy - 4Developers

The battle between native and web rages on. The browsers are fighting hard to tear down the benefits that native developers have relied on since the inception of mobile platforms. Geolocation, sorted. Accelerometer, done. Performance, we'll come back to that. But one of the greatest draws for native developers has been push notifications, for the web, email alerts just don't cut it.

But now, new in browsers for 2015, is the Service Worker. Born out of the struggle to make the Appcache work for offline capable sites, it has also brought the advent of push notifications to the web. Through building up an example application live, you will learn how to implement the Service Worker to not only serve up an app when you're offline but enhance the online experience with push notifications.

The battle may continue, but the web is definitely pushing back.

Links:

Check out the code from the presentation: https://github.com/philnash/the-web-is-getting-pushy

Web Powered SMS Inbox with Service Worker: Push Notifications: https://www.twilio.com/blog/2016/02/web-powered-sms-inbox-with-service-worker-push-notifications.html

The Service Worker Cookbook - https://serviceworke.rs/
Web Push for Node.js - https://www.npmjs.com/package/web-push - https://github.com/marco-c/web-push
Google Developers - Your first push notifications web app - https://developers.google.com/web/fundamentals/getting-started/push-notifications/?hl=en

8ec1383b240b5ba15ffb9743fceb3c0e?s=128

Phil Nash

April 11, 2016
Tweet

Transcript

  1. THE WEB IS GETTING PUSHY 4Developers 2016

  2. Phil Nash @philnash http:/ /philna.sh philnash@twilio.com

  3. WARNING!

  4. LIVE CODING!

  5. ES6

  6. ES6 ES2015

  7. ES6 ES2015

  8. NEW JAVASCRIPT STUFF

  9. AUDIENCE PARTICIPATION!

  10. THE WEB IS GETTING PUSHY

  11. WEB VS NATIVE

  12. GEOLOCATION

  13. ACCELEROMETER

  14. PEER TO PEER VIDEO CHAT

  15. PUSH NOTIFICATIONS

  16. None
  17. NOTIFICATIONS

  18. #4DEVPUSH

  19. DEMO

  20. None
  21. REAL NOTIFICATIONS

  22. Support 22 22 25 6 under consideration

  23. DEMO

  24. None
  25. PUSH NOTIFICATIONS

  26. SERVICE WORKER

  27. “THE APPLICATION CACHE IS A DOUCHEBAG”

  28. NOT JUST FOR OFFLINE

  29. Service Worker Support 40 flag

  30. Service Worker Support 40 44!! 24 ? under consideration

  31. Push Notification Support 42 44 ? non- standard under consideration

  32. None
  33. None
  34. Service Worker Support jakearchibald.github.io/isserviceworkerready status.modern.ie

  35. DEMO

  36. None
  37. WITH GREAT POWER...

  38. None
  39. None
  40. The code! github.com/philnash/the-web-is-getting-pushy

  41. The slides! https:/ /speakerdeck.com/philnash

  42. Other resources • Push notifications and SMS - Twilio blog

    • The Service Worker Cookbook - https:/ /serviceworke.rs/ • Web Push for Node.js - npm - GitHub • Google Developers - Your first push notifications web app
  43. THANKS!

  44. Use code PNASH20 for 20% off tickets

  45. Thanks! @philnash http:/ /philna.sh philnash@twilio.com