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

Service Workerとブラウザでの通知について

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Toshihisa Tomatsu Toshihisa Tomatsu
January 22, 2020
Technology
380
3

Service Workerとブラウザでの通知について

Ehime.js #4の資料です。
https://ehimejs.connpass.com/event/162348/

Avatar for Toshihisa Tomatsu

Toshihisa Tomatsu

January 22, 2020

More Decks by Toshihisa Tomatsu

See All by Toshihisa Tomatsu
"フロントエンドの技術"を移行する技術 / Frontend Migrations
Avatar for Toshihisa Tomatsu 10shi10ma
0
80
Service Workerとは、それを使ってできること / what-is-service-worker
Avatar for Toshihisa Tomatsu 10shi10ma
3
2k
フロントエンドのエコシステム / Frontend Ecosystem
Avatar for Toshihisa Tomatsu 10shi10ma
8
3.3k
意外に知らないnpmと便利なCLI
Avatar for Toshihisa Tomatsu 10shi10ma
8
2.5k
歴史から学ぶ現代のフロントエンド
Avatar for Toshihisa Tomatsu 10shi10ma
17
11k
サイボウズ フロントエンドエキスパートチームとOSSの管理について
Avatar for Toshihisa Tomatsu 10shi10ma
0
1.2k
大規模フロントエンドの技術的負債と向き合う。
Avatar for Toshihisa Tomatsu 10shi10ma
5
6.1k
Google I/O ’19から見る新しいJavaScript
Avatar for Toshihisa Tomatsu 10shi10ma
5
3.2k
React+Storybook ことはじめ
Avatar for Toshihisa Tomatsu 10shi10ma
8
2.6k

Other Decks in Technology

See All in Technology
権限管理設計を完全に理解した
Avatar for r-sugi rsugi
2
240
Platform Engineering as a Product: Criteria for Improvement and Multi-Tenant Design
Avatar for Kumo Ishikawa kumorn5s
0
410
形式手法特論：公平性制約の位相的特徴づけ #kernelvm / Kernel VM Study Kansai 12th
Avatar for y_taka_23 ytaka23
1
640
AI時代から振り返るTerraform drift運用の歴史 / AI Age Reflections on the History of Terraform Drift Operations
Avatar for AEON aeonpeople
0
610
Platform engineering for developers, architects & the rest of us (AI agents)
Avatar for danielbryantuk danielbryantuk
0
160
React、まだ楽しくて草
Avatar for uhyo uhyo
6
860
ビジュアルプログラミングIoTLT vol.23
Avatar for 1ft-seabass 1ftseabass
PRO
0
160
Java正規表現エンジン（NFA）の仕組みと パフォーマンスを維持するための最適化手法
Avatar for 竹内 雅和 takeuchi_132917
0
160
Fabric-cicd によるAzure DevOps デプロイ
Avatar for Ryoma Nagata ryomaru0825
0
160
string地獄を脱出する
Avatar for SansanTech sansantech
PRO
1
110
「コーディング」しない人のための Claude Code 入門　ChatGPT の次の一歩 — 業務に組み込む 育成・共有・自動化
Avatar for ふくだ（fukuda ryu） rfdnxbro
1
450
脅威をエンジニアリングの糧にして：恐怖を乗り越えた先にあったもの / Turn threats into fuel for engineering: what lay beyond overcoming fear
Avatar for nrs nrslib
1
360

Featured

See All Featured
Believing is Seeing
Avatar for Spiro Bolos oripsolob
1
140
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
2
1.1k
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
190
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
31
6k
Claude Code どこまでも/ Claude Code Everywhere
Avatar for nwiizo nwiizo
65
55k
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
920
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.7k
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
440
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
Avatar for UX Y'all uxyall
0
300
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
160
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
Avatar for Andy Polaine apolaine
1
330
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
390

Transcript

  1. 4FSWJDF8PSLFSͱ ϒϥ΢βͷ௨஌ʹ͍ͭͯ &IJNFKT 5PTIJIJTB5PNBUTV

  2. ֎দढ़ঘ 5PTIJIJTB5PNBUTV  αΠϘ΢ζגࣜձࣾ ϑϩϯτΤϯυΤΩεύʔτνʔϜ ۚ୔ˠ౦ژˠѪඤ &IJNFKT !UPTIJUPNB !UPTIJ@@UPNB 2

  3. None

  4. ࠷ۙɺ௨஌ΛٻΊΔαΠτ͕ଟ͘ͳ͖ͬͯͨ ▸ αΠτʹΞΫηεͨ͠ޙɺ௨஌ͷڐՄΛٻΊΔμΠΞϩά͕ग़ͨΒͲ͏͢Δʁ

  5. ▸ αΠτʹΞΫηεͨ͠ޙɺ௨஌ͷڐՄΛٻΊΔμΠΞϩά͕ग़ͨΒͲ͏͢Δʁ ▸ ͱΓ͋͑ͣʮ#MPDLʯ ▸ αʔϏεʹΑͬͯ͸ॏཁ ▸ ͦͷαʔϏεΛϝΠϯͰ͸࢖ͬͯͳ͍͚Ͳɺ௨஌͕དྷͨΒݟ͍ͨ ▸ ϦϚΠϯμʔػೳɺλΠϚʔػೳFUD

    ࠷ۙɺ௨஌ΛٻΊΔαΠτ͕ଟ͘ͳ͖ͬͯͨ

  6. ϒϥ΢βͰ௨஌Λग़͢ʹ͸ʁ

  7. ϒϥ΢βͰ௨஌Λग़͢ʹ͸ ▸ ํ๏ ▸ 8FC"1*/PUJpDBUJPO ▸ ํ๏ ▸ 8FC"1*1VTI"1*
 4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO

  8. 8FC"1*/PUJpDBUJPO

  9. IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*OPUJpDBUJPO

  10. ํ๏/PUJpDBUJPO ▸ /PUJpDBUJPOT"1*ͷ/PUJpDBUJPOΠϯλϑΣʔε ▸ σεΫτοϓ௨஌ͷઃఆ΍දࣔΛՄೳʹ͢Δ ▸ λϒΛ੾Γସ͑ͨΓɺผͷΞϓϦʹҠಈ͍ͯͯ͠΋0, ▸ ௨஌Λදࣔ͢Δʹ͸ɺݱࡏͷΦϦδϯʹରͯ͠ڐՄΛಘΔඞཁ͕͋Δ ▸

    $ISPNF 'JSFGPY 4BGBSJ

  11. ௨஌ͷڐՄ

  12. ௨஌ͷදࣔ

  13. ؆୯

  14. $ISPNF%FW5PPMTͷ$POTPMFͰ؆୯ʹࢼͤΔ ▸ 'JSFGPY͸$POTPMF͔ΒμΠΞϩάग़ͤͳ͔ͬͨ

  15. ͨͩ͠ɺ/PUJpDBUJPOΛग़ ͢+4Λ࣮ߦ͍ͯ͠ΔϖʔδΛ ։͍͓ͯ͘ඞཁ͕͋Δ

  16. ͭ·ΓɺͦͷϖʔδΛด͡Δ ͱ௨஌͞Εͳ͍

  17. ϒϥ΢βͰ௨஌Λग़͢ʹ͸ ▸ ํ๏ ▸ 8FC"1*/PUJpDBUJPO ▸ ํ๏ ▸ 8FC"1*1VTI"1*
 4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO

  18. 8FC"1*1VTI"1*
  4FSWJDF8PSLFS3FHJTUSBUJPO
 TIPX/PUJpDBUJPO

  19. IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*1VTI@"1*

  20. IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO

  21. IUUQTEFWFMPQFSNP[JMMBPSHFO64EPDT8FC"1*4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPO

  22. 4FSWJDF8PSLFS

  23. 4FSWJDF8PSLFS ▸ Ұൠతʹϒϥ΢βͰಈ͘+4͸ɺ8FCϖʔδͷϥΠϑαΠΫϧͰ࣮ߦ ▸ 4FSWJDF8PSLFS͸8FCϖʔδͱ͸ผʹϒϥ΢βͷόοΫάϥ΢ϯυͰಈ࡞ ͢Δ+4ͷ࣮ߦ؀ڥ Πϕϯτۦಈ 8FCϖʔδ 4FSWJDF8PSLFS +4

    +4 )5.- $44

  24. 4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨஌ ▸

    όοΫάϥ΢ϯυಉظ

  25. 4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨஌ ▸

    όοΫάϥ΢ϯυಉظ ϞόΠϧͬΆ͍ʂ →PWA

  26. Πϕϯτۦಈ 8FCϖʔδ 4FSWJDF8PSLFS αʔόʔ POGFUDI POQVTI POTZOD ΠϕϯτʹԠͯ͡ ॲཧ͢ΔΑ

  27. 4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨஌ ▸

    όοΫάϥ΢ϯυಉظ

  28. Ұൠతͳ8FCϖʔδ 8FCϖʔδ αʔόʔ JOEFYIUNM͍ͩ͘͞ BQQDTT͍ͩ͘͞ NBJOKT͍ͩ͘͞ ʹΞΫηε

  29. 8FCϖʔδXJUI4FSWJDF8PSLFS 8FCϖʔδ αʔόʔ JOEFYIUNM͍ͩ͘͞ ʹΞΫηε 4FSWJDF8PSLFS Cache͋Δ͔Βɺ ͔ͦͬͪΒฦ͢Ͷ $BDIF

  30. 8FCϖʔδXJUI4FSWJDF8PSLFS 8FCϖʔδ αʔόʔ GPPIUNM͍ͩ͘͞ GPPʹΞΫηε 4FSWJDF8PSLFS Cacheͳ͍͔Β αʔόʔʹϦΫΤετ $BDIF 'FUDI"1*

    GPPIUNM

  31. 4FSWJDF8PSLFSͰ ΦϑϥΠϯରԠͷ࣮૷ྫ

  32. JOEFYKT 4FSWJDF8PSLFSͷొ࿥ 8FCϖʔδ

  33. TXKT 4FSWJDF8PSLFSͷΠϯετʔϧΩϟογϡ࡞੒ 4FSWJDF
 8PSLFS

  34. TXKT GFUDIΠϕϯτΛΩϟονΩϟογϡ͔Βฦ͢ 4FSWJDF
 8PSLFS

  35. 4FSWJDF8PSLFS͕͋Δͱ ▸ ͜Ε·ͰͰ͖ͳ͔ͬͨ͜ͱ͕ՄೳʹͳΔ ▸ ྫ ▸ ΦϑϥΠϯମݧ ▸ ϓογϡ௨஌ ▸

    όοΫάϥ΢ϯυಉظ

  36. ํ๏1VTI"1*  4FSWJDF8PSLFS3FTJHUSBUJPOTIPX/PUJpDBUJPO ▸ 4FSWJDF8PSLFSΛར༻ͯ͠ϓογϡ௨஌Λ࣮ݱ ▸ 1VTI4FSWJDF͔Βͷϓογϡ௨஌Λड৴ͯ͠ɺσεΫτοϓ௨஌Λදࣔ͢Δ ▸ 4FSWJDF8PSLFSΛ࢖͏ͷͰɺϖʔδΛดͯ͡΋௨஌͕Մೳ ▸

    $ISPNF'JSFGPY

  37. 4FSWJDF8PSLFSΛ࢖͏͜ͱͰ ϓογϡ௨஌Λ࣮ݱ͢Δ

  38. 1VTI"1*ͱ/PUJpDBUJPOT"1*Ͱͷ࣮૷  4FSWJDF8PSLFSΛΠϯετʔϧ͢Δ 4FSWJDF8PSLFS3FHJTUSBUJPO   4FSWJDF8PSLFS3FHJTUSBUJPOΦϒδΣΫτ͔Β1VTI.BOBHFSΛऔಘ  1VTI.BOBHFSͷTVCTDSJCFؔ਺ͰBQQMJDBUJPO4FSWFS,FZΛ౉͢ͱϓογϡͷߪಡ Λ։࢝

    ʙαʔόʔͰϓογϡαʔϏεʹϝοηʔδΛૹ৴ʙ  4FSWJDF8PSLFSͷPOQVTIͰ1VTI4FSWJDF͔Βͷϓογϡ௨஌Λड৴  /PUJpDBUJPOT"1*ͷ4FSWJDF8PSLFS3FHJTUSBUJPOTIPX/PUJpDBUJPOͰ௨஌Λ ग़͢

  39. ϓογϡ௨஌ͷͬ͘͟ΓΠϝʔδ
 ຊ౰͸ࣄલʹαʔόʔʹ1VTI4VCTDSJQUJPOΛૹ৴͓ͯ͘͠ 8FCϖʔδ αʔόʔ 4FSWJDF8PSLFS 1VTI4FSWJDF ྫ'$. POQVTI

  40. ΫϥΠΞϯτଆͷ ࣮૷ͷϙΠϯτ͚ͩൈਮ

  41. JOEFYKT 4FSWJDF8PSLFSͷొ࿥ 8FCϖʔδ

  42. JOEFYKT 1VTI.BOBHFSΛऔಘ 8FCϖʔδ

  43. JOEFYKT ϓογϡαʔϏεͷߪಡΛཁٻ 8FCϖʔδ

  44. "QQMJDBUJPO4FSWFS,FZͷ࡞੒ٴͼ1VTI௨஌Λ؆୯ʹࢼͤΔ IUUQTXFCQVTIDPEFMBCHMJUDINF

  45. TXKT QVTIΠϕϯτ͕དྷͨΒ௨஌Λग़͢ 4FSWJDF
 8PSLFS

  46. TXKT ௨஌ΛΫϦοΫͨ࣌͠ͷॲཧ΋࣮૷Մೳ 4FSWJDF
 8PSLFS

  47. ϖʔδΛดͯ͡΋௨஌

  48. αʔόʔଆͷ࣮૷͕ඞཁͳͷͰେม

  49. ·ͱΊ ▸ σεΫτοϓ௨஌Λग़͢৔߹ɺ/PUJpDBUJPOT"1*Λ࢖͏ ▸ ϖʔδ͕ดͯͯ͡΋௨஌Λग़͢ʹ͸ɺ4FSWJDF8PSLFSͷ1VTI"1*ͱ૊Έ߹ Θͤͯ࢖͏ αʔόʔαΠυͷ࣮૷͕ඞཁ  ▸ ϖʔδ͕։͍ͯΔ࣌ʹ௨஌Λग़͢ͳΒɺ/PUJpDBUJPOT"1*ͷ/PUJpDBUJPO

    ΠϯλϑΣʔεΛ࢖͑͹؆୯ʹग़ͤΔ ▸ ؆୯ʹ௨஌Λग़͗͢͠ΔͱϢʔβʔʹݏΘΕΔͷͰ࢖͍ํ͸஫ҙ

  50. ৄ͘͠஌Γ͍ͨਓ͸ ▸ 4FSWJDF8PSLFSͷ঺հc8FC'VOEBNFOUBMT ▸ IUUQTEFWFMPQFSTHPPHMFDPNXFCGVOEBNFOUBMT QSJNFSTTFSWJDFXPSLFST IMKB ▸ 8FC1VTIΛʢͪΐͬͱʣৄ͘͠ղઆ͢ΔGVLVPLBQXB ▸

    IUUQTTQFBLFSEFDLDPNQJSPTJLJDLXFCQVTIXPUJZPUVUP YJBOHTJLVKJFTIVPTVSVOVNCFSGVLVPLBQXB