Categories
Conferences Programs

PWA Roadshow

The Progressive Web App Roadshow is a series of events that explains the what, why and how of PWAs and allows participants to work through some code labs that provides hands-on experience.

Name

Progressive Web App Roadshow San Francisco 2017

Location

Google Launchpad Space – 301 Howard Street San Francisco, CA – 4th Floor

Date

Sunday, October 22nd – 9:00 AM to 5:00 PM

Role

Participant – I participated this event as part of the Chrome Dev Summit. Registration was super limited so I’m glad I was able to attend.

About

The Progressive Web App Roadshow is a series of events that explains the what, why and how of PWAs and allows participants to work through some code labs that provides hands-on experience.

What are PWAs?

Progressive Web Apps are experiences that combine the best of the web and the best of apps. They load quickly, even on flaky networks, can re-engage with users by sending web push notifications, have an icon on the home screen and load as top-level, full screen experiences.

Topics Covered

Overview

Integration

Reliability

Engaging

  • Web Push Notifications Library
  • Web Push Notifications
    • Carnival
  • Good Notifications
    • Timely
      • Matters right now
    • Relevant
      • User cares about it
    • Precise
      • Exact details
  • How Push Works
    • Client Side
      • Get permissions to send notifications
      • Subscribe & get PushSubscription
      • Send PushSubscription to server
    • Server Side
      • Create message on server
      • Use Web Push Protocol to send
        • All browsers use Web Push API
      • Push Service delivers message
      • Message arrives on device
      • Browser wakes up service worker
      • Handle push event and shows notification
    • Application security keys
      • public
        • used for subscription
      • private
        • used to send messages
    • Subscribing and unsubscribing
      • Is web push supported?
      • Check subscription status
      • Subscribe to user
        • userVisibleOnly
      • Promoting and permission
        • First ask, then prompt
        • Weather.com
          • gives options

Security

  • HTTPS
    • identity
    • confidentiality
    • integrity
  • Man in the middle attacks
  • First get HTTPS then extend to HTTP/2
  • Certificate
  • Referrer Policy

Lighthouse

  • Available in Chrome DevTools & as a command line tool.
  • Aim for 90 and above on all metrics
    • PWA
    • Performance
    • Accessibility
    • Best Practices

Codelabs

Photos

And I’m pumped!

 

By Frances Coronel

Frances Coronel is a software engineer specializing in UI development on the Customer Acquisition Team at Slack where her mission is to make your working life simpler, more pleasant, and more productive.

She has been working professionally as a developer since 2015 and holds a Bachelors in Computer Science from Hampton University and a Masters in Computer Science from Cornell Tech.

Outside of Slack, Frances is an Executive Director of Techqueria, a 501c3 nonprofit that serves the largest community of Latinx in Tech in the US.

She also supports Code Nation as a member of their Bay Area Leadership Council and the Latino Community Foundation as a member of their Latinos in Tech Giving Circle.