Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Progressive Web Apps

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Kenichiro Okada Kenichiro Okada
June 18, 2017
Technology
410
0

Progressive Web Apps

Introduction to progressive web apps

Avatar for Kenichiro Okada

Kenichiro Okada

June 18, 2017

More Decks by Kenichiro Okada

See All by Kenichiro Okada
将来を語るのが苦手なメンバーと向き合ってわかったこと
Avatar for Kenichiro Okada pastelinc
0
33
探索的なスタイルでフィードバックを使って、学びを豊かにしてみよう！
Avatar for Kenichiro Okada pastelinc
0
66
100%の傾聴を実践する
Avatar for Kenichiro Okada pastelinc
0
130
組織を変革する最初の一歩に躓いたけど、それはそれで良かった話
Avatar for Kenichiro Okada pastelinc
1
1.6k
ひとりでも安定して 組織を変える活動を続けていくための ストレスマネジメント
Avatar for Kenichiro Okada pastelinc
0
2.2k
慣習から旅立つチーム
Avatar for Kenichiro Okada pastelinc
0
1.5k
AngularJSを通してDockerと触れ合った
Avatar for Kenichiro Okada pastelinc
0
1k
AngularJSとWeb Audio APIはじめてみました
Avatar for Kenichiro Okada pastelinc
0
390

Other Decks in Technology

See All in Technology
AmazonRoute 53ではじめてのドメイン取得！HTTPS化までの道のりを整理してみた
Avatar for usanchuu usanchuu
3
120
「速く作る」から「正しく作る」へ ─ 生成AI時代の開発フロー改革の ロードマップと実行 ─
Avatar for starfish719 starfish719
0
9.3k
Microsoft Build Keynoteふりかえり
Avatar for tomokusaba tomokusaba
0
120
サイバーセキュリティ概論 / Introduction to Cybersecurity
Avatar for Kenji Saito ks91
PRO
0
170
LLMにもCAP定理があるという話
Avatar for Haruka Sakihara harukasakihara
0
270
AI Engineering Summit Tokyo 2026 AIの前に、やることがある 〜医療データ企業の4フェーズ〜
Avatar for Daisuke Taniwaki dtaniwaki
0
2.3k
AIソロプレナー時代に2ヶ月で20人増員した事業創造会社の開発組織の話
Avatar for Koji Miyata miyatakoji
0
270
MIERUNE JCT 発表資料「宇宙から伊能忠敬ごっこ」
Avatar for じゃらしまる syuchimu
0
200
React、まだ楽しくて草
Avatar for uhyo uhyo
7
4.2k
タクシーアプリ『GO』の実践的データ活用
Avatar for GO Inc. dev mot_techtalk
3
180
2026.06.13_AI時代に事業会社が「SIer出身エンジニア」を求める理由 / Why Businesses Seek Engineers with a System Integrator Background in the AI ​​Era
Avatar for jumpei_ikegami jumtech
0
960
Oracle Cloud Infrastructure IaaS 新機能アップデート 2026/3 - 2026/5
Avatar for oracle4engineer oracle4engineer
PRO
1
230

Featured

See All Featured
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
55
12k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.4k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
672
58k
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
320
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
800
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.5k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
10k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.7k
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
5.4k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
287
14k
The innovator’s Mindset - 
Leading Through an Era of Exponential Change - McGill University 2025
Avatar for Jean-Marc De Jonghe jdejongh
PRO
1
200
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
2
1.7k

Transcript

  1. Progressive Web Apps Introduction to progressive web apps

  2. Self Introduction • pastelInc • ng-kyoto organizer • Interests •

    JavaScript • PHP • Natural language processing

  3. What’s PWA

  4. Why PWA https://www.slideshare.net/dynamis/progressive-mobile-web-apps

  5. Why PWA 2 https://www.slideshare.net/dynamis/progressive-mobile-web-apps

  6. Why PWA 3 https://www.slideshare.net/dynamis/progressive-mobile-web-apps

  7. PWA • Fast • Enjoy offline time • Like native

    app

  8. App Shell

  9. Web Apps Manifest https://www.w3.org/TR/appmanifest/

  10. Service Worker • Cannot access the DOM directly • Programmable

    network proxy • HTTPS required https://w3c.github.io/ServiceWorker/ https://w3c.github.io/workers/

  11. Let's see PWA

  12. Trouble • Need to study the Service Worker's lifecycle •

    Need to know how to use developer tools

  13. 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

  14. Let’s try PWA!!