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

5 minutes PWA

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Tatsuya Arai Tatsuya Arai
February 23, 2018
Technology
240
0

5 minutes PWA

Avatar for Tatsuya Arai

Tatsuya Arai

February 23, 2018

More Decks by Tatsuya Arai

See All by Tatsuya Arai
Androidアプリ開発における技術顧問としての役割 #DroidKaigi 2018
Avatar for Tatsuya Arai cutmail
1
2.5k
4年続くアプリにおけるチーム開発 #DroidKaigi 2017
Avatar for Tatsuya Arai cutmail
13
5k
フリルにおけるドッグフーディング / Fashion Tech Meetup #2 LT
Avatar for Tatsuya Arai cutmail
2
4k
Adapter and Custom Layout
Avatar for Tatsuya Arai cutmail
3
980
いかにして不具合発見時の フィードバックを素早く行うか #potatotips 12
Avatar for Tatsuya Arai cutmail
0
2.6k
Androidのログ出力をいい感じにする #potatotips 9
Avatar for Tatsuya Arai cutmail
8
10k
コーディング規約を緩く守りつつ仕事の成果を出す方法
Avatar for Tatsuya Arai cutmail
2
670

Other Decks in Technology

See All in Technology
Oracle AI Database@AWS：サービス概要のご紹介
Avatar for oracle4engineer oracle4engineer
PRO
4
2.8k
Unlocking the Apps
Avatar for Tim Perry pimterry
0
180
地元にいないローカルオーガナイザーの立ち回り
Avatar for uvb_76 uvb_76
1
440
Mastering Ruby Box
Avatar for Satoshi Tagomori tagomoris
3
140
Spring AI × MCP 入門〜AIエージェントへのツール公開、境界設計から始める最小構成 〜
Avatar for 宮本裕也 yuyamiyamoto
0
210
さきさん文庫の書籍ができるまで
Avatar for H.Saki sakiengineer
0
330
ポスター発表&デモと総括 / Poster Presentations & Demonstrations and Summary
Avatar for Kenji Saito ks91
PRO
0
190
AI時代の私の技術インプットとアウトプット術
Avatar for tonkotsuboy_com tonkotsuboy_com
16
8.3k
Strands Agents超入門
Avatar for KintoTech_Dev kintotechdev
1
160
AI-DLCを活用した高品質・安全なAI駆動開発実践 / AI Driven Development with AI-DLC
Avatar for 吉田真吾 yoshidashingo
0
100
OCI Oracle AI Database Services新機能アップデート(2026/03-2026/05)
Avatar for oracle4engineer oracle4engineer
PRO
0
170
BigQuery の Cross-cloud Lakehouse への歩み
Avatar for Tomonori Hayashi / ぴーはや phaya72
2
540

Featured

See All Featured
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
120k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
2
1.5k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
52k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
659
62k
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
190
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
28
3.5k
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
1
380
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.2k
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
140
Heart Work Chapter 1 - Part 1
Avatar for Lake Fama lfama
PRO
7
36k

Transcript

  1. 5 minuts PWA

  2. PWAͱ͸ • Progressive Web Apps • ϞόΠϧ୺຤ͰϖʔδΛදࣔ͢Δͱ͖ʹωΠςΟϒΞϓϦͷ Α͏ͳڍಈΛͤ͞Δ͜ͱ͕Ͱ͖Δ • GoogleΛத৺ͱͯ͠ࡦఆ͞Ε͍ͯΔ

  3. PWAΛߏ੒͢Δཁૉ • Service Worker • Push API • Notification API

    • localStorage / IndexedDB • History API • Geolocation API

  4. PWAͰͰ͖Δ͜ͱ • ΦϑϥΠϯରԠ • ϖʔδͷදࣔ • ը໘ભҠ • ϓογϡ௨஌ •

    ϗʔϜը໘ͷ௥Ճ • Ґஔ৘ใͷऔಘ

  5. PWA vs Native

  6. None

  7. ࠾༻ྫ • Twitter Mobile • Instagram • ଞଟ਺

  8. Service Worker • ϒϥ΢β͕Webϖʔδͱ͸ผʹόοΫάϥ΢ϯυͰ࣮ߦ͢Δ εΫϦϓτɻ • DOMʹ͸௚઀ΞΫηεͰ͖ͳ͍ɻ • Service Worker͸࢖༻͍ͯ͠ͳ͍ؒ͸ऴྃ͞Εɺඞཁʹͳͬ

    ͨΒىಈ͠·͢ɻ • localhost or httpsͰͷΈಈ࡞ɻ

  9. Service Worker

  10. ϒϥ΢βରԠঢ়گ

  11. iOS11.3ΑΓService Worker͕༗ޮ ʹ

  12. ݁࿦

  13. ͙͢ಋೖ͢΂͖͔ʁ

  14. ·ͩૣ͍

  15. Ҏ্

  16. ࢀߟϦϯΫ • http://www.publickey1.jp/blog/18/ appleiosmacosprogressiveweb_apps.html • https://qiita.com/edwardkenfox/items/ 4c0b9550ffa48c1f0445 • https://qiita.com/y_fujieda/items/f9e765ac9d89ba241154 •

    https://developers.google.com/web/fundamentals/primers/ service-workers/?hl=ja • https://qiita.com/horo/items/ff665e4a6613e7684f8f