Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Developers.IO CAFEがなぜアプリからPWAになったのか
Search
kamedon
November 01, 2019
Technology
5
3.4k
Developers.IO CAFEがなぜアプリからPWAになったのか
kamedon
November 01, 2019
Tweet
Share
More Decks by kamedon
See All by kamedon
KotlinでDI
kamedon
1
740
Androidで使えるKotlinレシピ
kamedon
0
1.5k
少し幸せにする技術
kamedon
4
3.8k
Other Decks in Technology
See All in Technology
【LT会登壇資料】TROCCO新コネクタ「スマレジ」を活用した直営店データの分析
kazari0425
1
170
全部AI、全員Cursor、ドキュメント駆動開発 〜DevinやGeminiも添えて〜
rinchsan
2
2.2k
公開初日に Gemini CLI を試した話や FFmpeg と組み合わせてみた話など / Gemini CLI 初学者勉強会(#AI道場)
you
PRO
0
1k
セキュアな社内Dify運用と外部連携の両立 ~AIによるAPIリスク評価~
zozotech
PRO
0
100
Contributing to Rails? Start with the Gems You Already Use
yahonda
2
120
AWS CDKの仕組み / how-aws-cdk-works
gotok365
10
890
ソフトウェアテストのAI活用_ver1.25
fumisuke
1
560
「クラウドコスト絶対削減」を支える技術—FinOpsを超えた徹底的なクラウドコスト削減の実践論
delta_tech
4
190
microCMSではじめるAIライティング
himaratsu
0
120
AIの全社活用を推進するための安全なレールを敷いた話
shoheimitani
2
640
AWS CDK 入門ガイド これだけは知っておきたいヒント集
anank
5
610
SREのためのeBPF活用ステップアップガイド
egmc
2
900
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
42
2.7k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Adopting Sorbet at Scale
ufuk
77
9.5k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Unsuck your backbone
ammeep
671
58k
Music & Morning Musume
bryan
46
6.7k
How to Think Like a Performance Engineer
csswizardry
25
1.7k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Side Projects
sachag
455
42k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Gamification - CAS2011
davidbonilla
81
5.4k
Transcript
εϥΠυޙͰೖख͢Δ͜ͱ͕ग़དྷ·͢ͷͰ ൃදதͷ༰ΛϝϞ͢Δඞཁ͋Γ·ͤΜɻ ࣸਅࡱӨΛ͢Δ߹ ϑϥογϡɾγϟολʔԻ͕ग़ͳ͍Α͏ʹྀ͍ͩ͘͝͞ Attention
%FWFMPQFST*0$"'&͕ ͳͥ18"ʹͳͬͨͷ͔ $9ࣄۀຊ෦ ُҪӫར
͝ΊΜͳ͍͞ ·ͣλΠτϧΛमਖ਼͍ͤͯͩ͘͞͞ʂ
%FWFMPQFST*0$"'&͕ΞϓϦΛΊͯ 18"ʹͳΓͬͺΓΞϓϦ৴͢Δͷ͔ $9ࣄۀຊ෦ ُҪӫར
͢·Μ ͬͺΓωΠςΟϒΞϓϦΔ
εϥΠυޙͰೖख͢Δ͜ͱ͕ग़དྷ·͢ͷͰ ൃදதͷ༰ΛϝϞ͢Δඞཁ͋Γ·ͤΜɻ ࣸਅࡱӨΛ͢Δ߹ ϑϥογϡɾγϟολʔԻ͕ग़ͳ͍Α͏ʹྀ͍ͩ͘͝͞ Attention ϋογϡλά DNEFWJP DNEFWJP)
ϓϩϑΟʔϧ wُҪӫར w"OESPJEΤϯδχΞ w,PUMJO͖Ͱ͢ w࠷ۙ8FC 7VF Λ͍ͬͯ·͢ wϘʔυήʔϜ͕͖Ͱ͢
ΞδΣϯμ wͦͦ%FWFMPQFST*0$"'&ͬͯʁ w࠷ॳωΠςΟϒΞϓϦͩͬͨ wͳͥ18"ʹͳͬͨͷ͔ wͳͥωΠςΟϒΞϓϦ৴͢Δͷ͔
ͦͦDevelopers.IO CAFEͬͯʁ
ͦͦ%FWFMPQFST*0$"'&ͬͯʁ ·ͣͪ͜ΒΛͲ͏ͧ
ಈըΛ࠶ੜ͠·ͨ͠
%FWFMPQFST*0$"'& wΥʔΫεϧʔͱϞόΠϧΦʔμʔͰΛߪೖ͢Δ શΩϟογϡϨεͷ$BGF wΥʔΫεϧʔ "NB[PO(PͷΑ͏ʹళͷΛͱͬͯ ͓ళΛग़ΔͱࣗಈͰࢧ͍͕ྃ͢Δ wϞόΠϧΦʔμʔ εϚϗ͔ΒΛจ͠ళฮͰ͏͚ͱΔ
2018.07 2019.07 ΧϑΣϓϩδΣΫτͷྺ࢙ ࢀઓ
࠷ۙͷɿଟళฮల։ͷରԠΛਐΊ͍ͯΔ তঁࢠେళ ৽্ׁӽళ
ΥʔΫεϧʔͷΈ ఱҪͷΧϝϥ͔Β ୭͕ͱ͔ͬͨఆ ॏྔͷ૿ݮͰ ͱͬͨݸΛఆ ΞϓϦͷ23ίʔυͰ νΣοΫΠϯ ୀళΛݕͯ͠ ࣗಈܾࡁ
ϞόΠϧΦʔμʔͷΈ ΞϓϦ͔Βจ αΠωʔδʹ Φʔμʔঢ়گΛදࣔ
ࠓΞϓϦͷ ΞϓϦ͔Βจ αΠωʔδʹ Φʔμʔঢ়گΛදࣔ
࠷ॳωΠςΟϒΞϓϦͰ ͡·ͬͨ
ωΠςΟϒΞϓϦͬͯʁ wϓϥοτϑΥʔϜͰಈ࡞͢ΔΞϓϦ wεϚϗͷഎܠͰࡶʹ͍͏ͱɺ "QQ4UPSFɺ(PPHMF1MBZͰ৴͍ͯ͠ΔେͷΞϓϦ w8FCωΠςΟϒΞϓϦͰͳ͍
ͳΜͰωΠςΟϒΞϓϦʹͳͬͨͷ͔ʁ ͱʹ͔͘࠷ͰΧϑΣΛΦʔϓϯ͔ͨͬͨ͠ wೲظ͕͙͘͢ϦϦʔε͔ͨͬͨ͠ wϲ݄ఔ wωΠςΟϒΞϓϦͨ͘͞Μͷݟ͕͋ͬͨ wΈΜͳҊ݅Λֻ͚͍࣋ͪͯ͠Δ༗ࢤͷूஂ ख࣋ͪͷٕज़Ͱεϐʔυ༏ઌͰ͡·ͬͨ
J04"OESPJE͕ແࣄʹϦϦʔε͕Ͱ͖ͨ w࠷ॳJ04ΞϓϦ͚ͩͩͬͨ wJ04ϦϦʔεޙɺ"OESPJEຽͷਓݖΛ֫ಘ͢ΔͨΊ "OESPJEͰίʔώʔҿΈ͔͓ͨͬͨ͡͞Μ͕ J04Λਅࣅͨײ͡Ͱ"OESPJE࣮ wJ04ຽʮͳʹ͔པΈ·͔͢ʁʯ ͓͡͞Μʮ࠷ॳͷҰഋ"OESPJE͔Βจͯ͠ҿΉΜʯ wݱࡏʹࢸΔ
࣮ݧͱͯ͠ϑϧʹ׆༻ ళฮͳΜͱ͔͍͚ͦ͏ wࢧ͍पΓͷ֦ॆ wΫϨδοτΧʔυɺ"QQMF1BZ (PPHMF1BZ -*/&1BZ "MJQBZ wΥʔΫεϧʔϞόΠϧΦʔμʔͷӡ༻ܦݧ wΧϑΣۀ
࣍ͳΔνϟϨϯδ ଟళฮରԠʹνϟϨϯδ
Ұ୴ϓϩδΣΫτͱͯ͠અ ͜ͷ··ͷԆͰଟళฮʹରԠͰ͖Δʁ
ͳͥPWAʹͳͬͨͷ͔
ωΠςΟϒΞϓϦͷ w։ൃϦιʔε͕ͨΓͳ͍ wΈΜͳֻ͚࣋ͪͷ༗ࢤͷूஂͳͷͰ ฒΈͦΖ͑ͯJ04ɺ"OESPJEΛ։ൃ͢Δͷ͕͍͠ w৽͍͠ମݧΛૣ͘ఏڙͰ͖ͳ͍ wJ04ͷ৹͕͔ࠪͬͨΓɺϦδΣΫτͰ͕࣌ؒͱΒΕΔ wৗʹޙํޓΛؾʹͯ͠Ξοϓσʔτ͠ͳ͍ͱ͍͚ͳ͍
ωΠςΟϒΞϓϦͷ wདྷళ͓ͨ͠٬͞ΜҿΈΛങ͍ʹདྷͯΔͷʹɺ ΞϓϦͷμϯϩʔυΛ͠ͳ͍ͱ͍͚ͳ͍ͨΊ໘͕͘͞Δ w04ຖʹ6*͕ҟͳΔͨΊʹɺ ళฮΦϖϨʔγϣϯͰ2"͕େมʹͳ͍ͬͯΔ
ԿΛΓ͔ͨͬͨΜ͚ͩͬʁ ৽͍͠ମݧΛߴʹ࣮ݧ͍ͨ͠
ࠓͰ͖Δ͜ͱΛ͍ͬͯͳ͍ʁ ωΠςΟϒΞϓϦΛ࡞Γ͍ͨΜ͡Όͳ͍
̍ళฮ͔ΒଟళฮΛࢦͯ͠ ωΠςΟϒΞϓϦͷ··ͰΑ͍ͷ͔ʁ ͬͯ͘Έ͍ͨ ͘ମݧͯ͠Έ͍ͨ ͘ϑΟʔυόοΫ͍͖͍ͨͩͨ ͑Δ͜ͱ͕Ͱ͖Δʁ
ωΠςΟϒΞϓϦͷ··Ͱ͍͍ͷ͔ʁ NO
ߴʹվળ͢ΔͨΊʹඞཁͳ͜ͱԿʁ wJ04"OESPJEΛ͚ͣʹ։ൃϦιʔεΛͭʹूத͍ͨ͠ wֻ͚͕࣋ͪଟ͍ͷͰϫϯιʔεʹͯ͠ମݧͷ࡞ΓࠐΈʹूத͍ͨ͠ wళฮΦϖϨʔγϣϯͷෛ୲ΛԼ͍͛ͨ w04ຖʹ͓٬༷ͷ2"Λ͑Δͷ͕େม wಉ͡6*ɺಉ͡ભҠͷ΄͏͕Ҋ͕͍͢͠ wΞϓϦόʔδϣϯͰҊ͕มΘΔ
ϫϯιʔεΛ࣮ݱ͢Δʹ ϚϧνϓϥοτϑΥʔϜܥʹखΛग़ͯ͠ΈΔ͔
ϚϧνϓϥοτϑΥʔϜͰٻΊΔͷԿʁ w͖উखʹΞοϓσʔτ͍ͨ͠ wJ04"OESPJEΛϫϯιʔεʹ͍ͨ͠ wͳΔ͘γϯϓϧͳঢ়ଶΛΩʔϓ͍ͨ͠ wωΠςΟϒΞϓϦͬΆ͍ମݧʹ͓͖͍ͯͨ͠ 8&#ͷ18"ͰͬͯΈΔ͔
18"ͱ 18"ʢ1SPHSFTTJWF8FC"QQTʣͱ wωΠςΟϒΞϓϦͷΑ͏ͳ༻ײ wΞΠίϯΛϗʔϜը໘Ճ wϓογϡ௨ wΩϟογϡʹΑΔߴԽΦϑϥΠϯରԠԽ ωΠςΟϒΞϓϦͬΆ͍ମݧ͕Ͱ͖ͦ͏
18"ͰͷΈ͔͑ͨ ϒϥβ 18"
18"ͰΞϓϦͬΆ͍6*࣮ݱՄೳ ϗʔϜʹΞΠίϯΛ ઃஔͰ͖Δ
18"ͰΞϓϦͬΆ͍6*࣮ݱՄೳ ΞΫγϣϯόʔɺλϒͳͲ ΞϓϦͷΑ͏ͳ6*Մೳ
εϓϥογϡՄೳ ΞϓϦͷεϓϥογϡՄೳ
ϓογϡ௨Մೳ όοΫάϥϯυͰ ϑΥΞάϥϯυͰ 1VTI௨Λ͏͚ͱΕΔ ˞4BGBSJඇରԠ
J04Ͱ1VTIΛಧ͔ͳ͍ ϩάΠϯʹ߹Θͤͯ1VTI௨ͷΘΓΛૹΔ w4.4ϩάΠϯ4.4௨ w-*/&-*''-*/&.FTTBHF͔Β௨ w"OESPJE͞Βʹ8FC1VTIબՄ
ΦϑϥΠϯ͋ΔఔՄ ͏·͘Ωϟογϡ͏ͱ ΦϑϥΠϯͰΛදࣔͰ͖Δ 4FSWJDF8PSLFSΛ͏·͓͘͏ ͪΖΜจ͢Δͱ͖ ΦϯϥΠϯͰ͋Δඞཁ͋Δ
͔͠͠։ൃνʔϜεΩϧϚοϓ͕߹Θͳ͍ ωΠςΟϒΞϓϦ։ൃऀͷΈ ϦχϡʔΞϧ·Ͱϲ݄͔͠ͳ͍ͧʂʁ
࣌ؒͳ͍͚Ͳ You ͬͪΌ͍ͳΑ
ωΠςΟϒΞϓϦͷϊϋ͍͔ͤΔ wಉ͡ϑϩϯτपΓͳͷͰશ͘ҧ͏จԽͷͷͰͳ͍ w8FCπʔϧͷมԽ͕ܹ͍͚͠Ͳɺ ҰͳΜͱ͔͢ΕͳΜͱ͔ͳΔͣ wͨ͘͞ΜͷύϑΥʔϚϯεؔͷٕज़͋Δ͚ͲΛͭͿΔ w8FCΛ͔Βษڧ͢ΔͨΊɺΘ͔Γ͍͢πʔϧΛ͏ wॳ৺ऀ͕࢝Ί͍͢7VFΛબ w6**POJDΛબɻΞϓϦͬΆ͍6*Λ؆୯ʹ࡞Εͦ͏
7VF 7VFॳ৺ऀʹ ͍͞͠ͱΑ͘ฉ͘ ࣾͷᷚͰ ʮए͞ͰͳΜͱ͔ͳΔʯ ͱͷ͜ͱͰܾఆ εΫϥοϓϏϧυͳͷͰ ԿϦχϡʔΞϧνϟϯε ͋Δ͔Βૣ͘࡞ΕΔͷΛબ
ΧϑΣϓϩδΣΫτͰ ཧը໘Ͱ"OHVMBS ͍ͬͯΔ Vue.js
*POJD J04 "OESPE 8FC શ෦Ͱ͍͍ײ͡ͷ 6*ʹͯ͘͠ΕΔ ϑϨʔϜϫʔΫ IonicFramework
ٹ͍ ·ͩళฮ w2"Ͱݱߦ͚Δ wଞࣾͰ·ͩಋೖ͍ͯ͠ͳ͍ wϦχϡʔΞϧͷλΠϛϯάͰΔͳΒࠓ͔͠ͳ͍
ແࣄʹϦϦʔε ͳΜͱ͔ͳͬͨ
18"ʹͨ͜͠ͱͷ෭࢈ ৭ΜͳνϟωϧͰՄೳʹͳͬͨ
8FCͷϫϯιʔεͰ͍Ζ͍ΖνϟωϧʹରԠ wϒϥβ wJ04ɺ"OESPJEɺ1$ w18" w"OESPJEɺ1$ɺҰ෦4BGBSJ w-*/& w-*'' -JOF'SPOUFOE'SBNFXPSL
-JOF'SPOUFOE'SBNFXPSL -*'' -*/&ΞϓϦͰಈ࡞͢Δ ΣϒΞϓϦͷ ϓϥοτϑΥʔϜ -*/&ͷϢʔβʔ*%ɺ -*''"1*Λར༻͢ΔͨΊͷ τʔΫϯΛ-*/&͔Βऔಘ Ͱ͖Δ
LINE Front-end Framework
8FCͷϫϯιʔεʹΑΔඍົͳࠩؤுΔ wϨΠΞτ wJ04Ͱ8FCͷ௨͕ಧ͔ͳ͍͚Ͳɺಧ͚͍ͨ
ϓϥοτϑΥʔϜʹΑΔϨΠΞτͷࠩ 18" ϒϥβ -*/&-*'& ϔομʔΛআ ϔομʔ༗Γ ίϯςϯπ ྖҬ͕͍
J04Ͱ1VTIΛಧ͔ͳ͍͚Ͳಧ͚͍ͨ ϩάΠϯʹ߹Θͤͯ1VTI௨ͷΘΓΛૹΔ w4.4ϩάΠϯ4.4௨ w-*/&-*''-*/&.FTTBHF͔Β௨ w"OESPJE'JSFCBTFͷ8FCબՄ
18"ʹͨ͜͠ͱʹΑΔ෭࢈ LINEͰಈ͘Α͏ʹͳ͔ͬͨΒ ߋʹΠϯετʔϧ͍Βͣʹ؆୯ʹ͑Δ
ͳͥωΠςΟϒΞϓϦ৴͢Δͷ͔
ྡͷࣳ੨͘Έ͑ͨ υαΧϯΩϣϊνΨΠΧϥχήϥϨφΠ
ྡͷࣳ੨͘Έ͑ͨ wJ1IPOFϢʔβ͕4BGBSJͷϓϥΠϕʔτϞʔυͰ༻͢Δ wJ1IPOFͰ4BGBSJͰϗʔϜʹՃͷͱ͖ͷಈ࡞ w8FCͷγϣʔτΧοτ͕͍ʹ͍͘
J1IPOFϢʔβ͕4BGBSJͷϓϥΠϕʔτϞʔυͰ༻͢Δ େֶੜͳͲए͍ࢠ͕݁ߏϓϥΠϕʔτͰ༻͢Δ wຖճϩάΠϯ͕֎ΕΔ w-*/&1BZϩάΠϯͷࡍʹ֎෦αΠτʹඈͿ͕ ϓϥΠϕʔτͰͳ͍௨ৗͷϒϥβ͕։͖ࣦഊ͢Δ wجຊతʹ8FCةͳ͍ͷͰ͋ΓϓϥΠϕʔτϞʔυͰ༻ wΞϓϦͷ΄͏͕ઐ༻Ͱةͳ͘ͳ͍Πϝʔδ
J1IPOFͰ4BGBSJͰϗʔϜʹՃͷͱ͖ͷಈ࡞ wϓϥΠϕʔτϞʔυಉ༷ʹ֎෦͔ΒϦμΠϨΫτͰ ͬͯ͜Εͳ͍ wҊɺϒϥβͷγϣʔτΧοτ͕͍ͩͮΒ͘ɺ ϗʔϜΞΠίϯ͔Βىಈ͢Δͷ͕؆୯Ͱศར
ྫɿ-*/&1BZޭύλʔϯ
ྫɿ-*/&1BZࣦഊύλʔϯ ભҠෆՄ
ղܾࡦ ΨϫωΠςΟϒͰ৴͢Δ ʢ༧ఆʣ
ΨϫωΠςΟϒͬͯʁ w8FCͰ৴ͯ͋͠ΔͷΛ 8FC7JFXͳͲͰද͍ࣔͯ͠Δ͚ͩͷΞϓϦ w"QQ4UPSFɺ(PPHMF1MBZʹ ৴͍ͨͨ͠ΊʹΞϓϦͰϥοϓ͍ͯ͠Δ w8FCʴЋʢωΠςΟϒػೳʣ ͍ͯ͠Δ͜ͱ͕ଟ͍͕ຊ࣭తʹ8FCΞϓϦͰ͋Δ
J04ͷΨϫωΠςΟϒ w"QQ4UPSFͰ৴Ͱ͖Δ wϗʔϜʹΞϓϦΞΠίϯΛ͓͚Δ wJ04Ͱͷ1VTI௨͕ՄೳʹͳΔ wϓϥΠϕʔτϞʔυͰىಈ͞Εͳ͍
"OESPJE͍ͭͰʹΨϫωΠςΟϒ ͔͔ͤͬͩ͘Β྆04ͱ৴͢Δ w58" 5SVTUFE8FC"DUJWJUZ Ͱ(PPHMF1MBZͰ৴͢Δ w18"ಉ༷ͷ$ISPNFϒϥβΛશը໘ʹϞʔυͰදࣔͰ͖Δ w΄ͱΜͲ18"ͱϢʔβͷ༻ײ͔ΘΒͳ͍ w(PPHMF1MBZʹ৴Ͱ͖Δͷ͕ڧΈ
58"ͷઃఆ 8FC͕ࣗͷॴ༗Ͱ͋Δ͜ͱΛࣔ͢ wΞϓϦଆʹ8FCͷใΛઃఆ w8FCଆʹΞϓϦͷϑΟϯΨʔϓϦϯτΛઃఆ͢Δ wXFMMLOPXOBTTFUMJOLTKTPOΛ8FCଆʹઃஔ͢Δ [{ "relation": ["delegate_permission/common.handle_all_urls"], "target"
: { "namespace": "android_app", "package_name": "https://sprout.devio.jp", "sha256_cert_fingerprints": ["App package fingerprint"] } }] Using Trusted Web Activitiesࢀর
58"ઃఆͷޭࣦഊͷஅ ޭ͢Δͱ εςʔλεόʔ͕ඇදࣔ ͜ͷ͕ͳ͍ͱ୭ͰυϝΠϯ͑͞ ͍ͬͯͨΒ͕ࣗ࡞͔ͬͨͷΑ͏ʹ 1MBZͰ৴Ͱ͖ͪΌ͏ΑͶ /( 0,
Ϣʔβ͕͖ͳͷͰମݧͯ͠Β͏ wϒϥβ wJ04ɺ"OESPJEɺ1$ w18" w"OESPJEɺ1$ɺҰ෦4BGBSJ w-*/& w-*'' -JOF'SPOUFOE'SBNFXPSL
wωΠςΟϒΞϓϦ
·ͱΊ
8FCͷϫϯιʔεʹͳͬͨ͜ͱʹΑΔϝϦοτ w͙͢ʹϦϦʔεͰ͖ΔΑ͏ʹͳͬͨ w։ൃϦιʔεΛମݧʹूதͰ͖ΔΑ͏ʹͳͬͨ w8FC -*/&-*'' ωΠςΟϒΞϓϦΛఏڙͰ͖ΔΑ͏ʹͳͬͨ wϢʔβ͕͖ͳͷͰମݧͰ͖ΔΑ͏ʹͳͬͨ wళฮͷҊ2"͕؆୯ʹͳͬͨ wߴʹվળͰ͖ΔΑ͏ʹͳͬͨ
·ͩ·ͩ8FCԽͰΔ͜ͱͨ͘͞Μ w18"ͷ࠷దԽ wΩϟογϡͷઃఆ w7VFͷύϑΥʔϚϯεઃఆ w͞·͟·ͳσόΠεͰಈͨ͘Ί6*ͷςετ w&&ςετͷಋೖͳͲ wϒϥβͷΩϟογϡ͕ڧ͍ͨΊͷߋ৽ॲཧͷ࣮
Զͨͪͷઓ͍͜Ε͔Βͩͥ ·ͩ·ͩΔ͖ࣄ͕ͨ͘͞Μ
։ൃϝϯόʔืूத αʔόαΠυ AWS, Lambda, Serverless API, ܾࡁ, ೝূ ΫϥΠΞϯταΠυ
Vue.js Angular.js ϋʔυΣΞ / IoT ॏྔηϯαʔɺToFηϯαʔ σδλϧαΠωʔδ Ϛωʔδϟʔ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠