Introduction to progressive web apps
Progressive Web AppsIntroduction to progressive web apps
View Slide
Self Introduction• pastelInc• ng-kyoto organizer• Interests• JavaScript• PHP• Natural language processing
What’s PWA
Why PWAhttps://www.slideshare.net/dynamis/progressive-mobile-web-apps
Why PWA 2https://www.slideshare.net/dynamis/progressive-mobile-web-apps
Why PWA 3https://www.slideshare.net/dynamis/progressive-mobile-web-apps
PWA• Fast• Enjoy offline time• Like native app
App Shell
Web Apps Manifesthttps://www.w3.org/TR/appmanifest/
Service Worker• Cannot access the DOM directly• Programmable network proxy• HTTPS requiredhttps://w3c.github.io/ServiceWorker/https://w3c.github.io/workers/
Let's see PWA
Trouble• Need to study the Service Worker's lifecycle• Need to know how to use developer tools
Reference• https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/• https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/• https://developer.mozilla.org/ja/docs/Web/API/Web_Workers_API/Using_web_workers• https://workboxjs.org/• https://github.com/johnpapa/pwa-angular
Let’s try PWA!!