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

Progressive Web Apps

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
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
26
探索的なスタイルでフィードバックを使って、学びを豊かにしてみよう！
Avatar for Kenichiro Okada pastelinc
0
60
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.4k
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
MIX AUDIO EN BROADCAST
Avatar for Erick Ralph Kionga ralpherick
0
140
GitHub Advanced Security × Defender for Cloudで開発とSecOpsのサイロを超える: コードとクラウドをつなぐ、開発プラットフォームのセキュリティ
Avatar for yuriemori yuriemori
1
120
ブラックボックス化したMLシステムのVertex AI移行 / mlops_community_62
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
260
TUNA Camp 2026 京都Stage ヒューリスティックアルゴリズム入門
Avatar for terry-u16 terryu16
0
650
Oracle AI Database@Google Cloud：サービス概要のご紹介
Avatar for oracle4engineer oracle4engineer
PRO
5
1.3k
Oracle Cloud Infrastructure：2026年3月度サービス・アップデート
Avatar for oracle4engineer oracle4engineer
PRO
0
300
Kiro Meetup #7 Kiro アップデート (2025/12/15〜2026/3/20)
Avatar for Katz Ueno katzueno
2
280
Cursor Subagentsはいいぞ
Avatar for Yuji Yamaguchi yug1224
2
130
15年メンテしてきたdotfilesから開発トレンドを振り返る 2011 - 2026
Avatar for giginet giginet
PRO
2
260
「できない」のアウトプット 同人誌『精神を壊してからの』シリーズ出版を 通して得られたこと
Avatar for comi comi190327
3
520
QA組織のAI戦略とAIテスト設計システムAITASの実践
Avatar for SansanTech sansantech
PRO
1
300
AIエージェント時代に必要な オペレーションマネージャーのロールとは
Avatar for KentaroFujii kentarofujii
0
270

Featured

See All Featured
Technical Leadership for Architectural Decision Making
Avatar for Kenny Baas-Schwegler baasie
3
300
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
230k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.6k
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
260
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
800
Music & Morning Musume
Avatar for Bryan Veloso bryan
47
7.1k
Claude Code のすすめ
Avatar for schroneko schroneko
67
220k
Groundhog Day: Seeking Process in Gaming for Health
Avatar for Sebastian Deterding codingconduct
0
140
Building the Perfect Custom Keyboard
Avatar for Naoto Takai takai
2
720
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
96
14k
From π to Pie charts
Avatar for Rasagy Sharma rasagy
0
160
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
Avatar for r-kagaya rkaga
61
43k

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!!