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
kintoneフロントエンド刷新 〜新規参加5ヶ月から見るリアル〜
Search
Hajime Mugishima
October 08, 2021
Technology
3
1.6k
kintoneフロントエンド刷新 〜新規参加5ヶ月から見るリアル〜
2021/10/08
Cybozu Tech Meetup #16
Hajime Mugishima
October 08, 2021
Tweet
Share
More Decks by Hajime Mugishima
See All by Hajime Mugishima
Next.js App Router での MPA フロントエンド刷新
mugi_uno
32
13k
コロナ禍 Frontend おさらい
mugi_uno
1
380
Toyama.rb
mugi_uno
1
77
Javaを富山でやってたはずがSwiftのためにMacBook買ったらRubyでリモートワーカーになってJSの本を出版するまでを思い返す
mugi_uno
7
2.5k
脱レガシーフロントエンドのために知っておいたほうがいいこと
mugi_uno
20
7.3k
マルチカーソルのLT
mugi_uno
0
180
消費税軽減税率制度
mugi_uno
7
6.8k
レガシーなフロントエンドに立ち向かう
mugi_uno
1
410
15分で知(った気にな)る最近のフロントエンド事情
mugi_uno
2
190
Other Decks in Technology
See All in Technology
あなたの知らないバグバウンティの世界
eurekaberry
1
1.4k
B+木入門:PHPで理解する データベースインデックスの仕組み/b-plus-tree-101
hanhan1978
5
2.8k
【OpsJAWS】EC2 のセキュリティの運用と監視について考えてみた件
hssh2_bin
4
600
5分で理解するWebAssemblyのWebの外の話 PHPはマイコンの夢を見るか?
usuyuki
3
200
『QAという人』が必要ではなく、『QAという技術』が必要
sadonosake
2
270
小さく始めるAnsible
stopendy
0
210
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
oracle4engineer
PRO
0
1.1k
二刀流でWinActorを活用してみた話
tamai_63
0
120
プレイヤーとしてのチームのテスト力UP/Improving team skills for testing
goyoki
2
230
PHPerKaigi 2024 - PHP 本体のバグを見つけたら適切に報告しよう
zeriyoshi
0
770
App Runnerでパラメーターストアの値を使ってみた
miura55
0
230
Automate your changelogs! Release Drafter
onenashev
PRO
2
410
Featured
See All Featured
How GitHub Uses GitHub to Build GitHub
holman
467
290k
Six Lessons from altMBA
skipperchong
19
2.9k
10 Git Anti Patterns You Should be Aware of
lemiorhan
644
57k
GraphQLとの向き合い方2022年版
quramy
28
12k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
240
1.2M
GitHub's CSS Performance
jonrohan
1023
450k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
RailsConf 2023
tenderlove
0
500
Large-scale JavaScript Application Architecture
addyosmani
501
110k
In The Pink: A Labor of Love
frogandcode
137
21k
Creatively Recalculating Your Daily Design Routine
revolveconf
209
11k
Product Roadmaps are Hard
iamctodd
43
9.6k
Transcript
$ZCP[V5FDI.FFUVQ LJOUPOFϑϩϯτΤϯυ৽ ʙ৽نࢀՃ̑ϲ݄͔ΒݟΔϦΞϧʙ αΠϘζגࣜձࣾ ϑϩϯτΤϯυΤΩεύʔτνʔϜ ഴౡҰ!NVHJ@VOP
ࣗݾհ ഴౡҰ Ή͗͠·͡Ί !NVHJ@VOP ɾத్ೖࣾ ɾϑϩϯτΤϯυΤΩεύʔτνʔϜ ɾϑϧϦϞʔτ ࢁ
͢͜ͱ ˔LJOUPOFͷ͝հ ˔LJOUPOFϑϩϯτΤϯυ৽ ˔ೖࣾ̑ϲ݄͔ΒݟͨϦΞϧ ˔๊͑Δ՝ͱղܾࡦ ˔ΤϯδχΞͱͯ͠ಘΒΕΔͷ
LJOUPOF
LJOUPOF 🔗αΠϘζΤϯδχΞ࠾༻ϐονIUUQTTQFBLFSEFDLDPNDZCP[VJOTJEFPVUDZCP[VFOHJOFFSSFDSVJU
LJOUPOF 🔗αΠϘζΤϯδχΞ࠾༻ϐονIUUQTTQFBLFSEFDLDPNDZCP[VJOTJEFPVUDZCP[VFOHJOFFSSFDSVJU
LJOUPOF 🔗αΠϘζΤϯδχΞ࠾༻ϐονIUUQTTQFBLFSEFDLDPNDZCP[VJOTJEFPVUDZCP[VFOHJOFFSSFDSVJU
LJOUPOFϑϩϯτΤϯυ৽
LJOUPOFϑϩϯτΤϯυ৽ ྺ࢙͕͍αʔϏεˠਐΉϨΨγʔԽ ɾ$MPTVSF5PPMTओମͷίʔυϕʔε ɾओྲྀͳϑϩϯτΤϯυࣄͱͷဃ ɾֶशΛؚΉ։ൃϝϯςφϯείετ ɾ࠾༻ΛؚΉະདྷͷӨڹ
LJOUPOFϑϩϯτΤϯυ৽ ΞʔΩςΫνϟΛ৽த ˣ 5ZQF4DSJQU3FBDUͳͲʹঃʑʹஔ͖͑
ϑϩϯτΤϯυΤΩεύʔτνʔϜ ✕ LJOUPOFϑϩϯτΤϯυ৽
ϑϩϯτΤϯυΤΩεύʔτνʔϜ େ͖̏࣠͘ͰϑϩϯτΤϯυ৽ʹڠྗ ˔3FBDUԽͷ࣮࡞ۀΛਐΊΔνʔϜ ˔қ͕ߴ͍ՕॴͷࣄલݕূΛߦ͏νʔϜ ˔ϚΠΫϩαʔϏεԽͷࢪࡦݕ౼Λߦ͏νʔϜ ˠLJOUPOF։ൃνʔϜͱͷϞϒ ˠϓϩτλΠϓ࡞ͳͲͷઌճΓରԠ ˠະདྷͷཧΛݟਾ͑ͨݕূ
ݱࡏͷਐḿ ཧը໘ 🏁ΰʔϧ ϦεΫΊͷཧը໘Ͱׂ̓΄Ͳྃ
ཧը໘ қ͕ߴ͍ʑͷը໘ ϦεΫΊͷཧը໘Ͱׂ̓΄Ͳྃ ˣ ·ͩઌ͍ 🏁ΰʔϧ ݱࡏͷਐḿ
ͬͱΓ͍ͨํ 🎥IUUQTXXXZPVUVCFDPNXBUDI W;YFK;+6D
🔥ೖࣾ̑ϱ݄ࢹͰͷϦΞϧͳ🔥
ೖࣾલͷؾ࣋ͪ ɾϑϩϯτΤϯυͷϨΨγʔվળͷܦݧ͋ͬͨ ϨΨγʔΛςʔϚʹࣥචͨ͠ ɾͻͱΓͰόϦόϦվળͯ͠Δͧʙ👍👍👍
ݱ࣮ ɾେنϑϩϯτΤϯυͷน ɾίʔυΛ͏͚ͩͰҰۤ࿑ ɾԿ͔ΒखΛ͚Εʜʁʁ
ͳʹ͕ҧ͏ͷ͔ʁ ɾݸਓPSগਓͰΕΔൣғ͕͍ ɾҰਓͷྗͰڧҾʹରॲͰ͖Δ͜ͱ͋Δ ˔খʙதن ˔େن ɾҰఆਓҎ্ͷνʔϜͰͷରॲ͕લఏ ɾݸਓͰΕΔൣғݶք͕͋Δ ˠݸਓͷྗ νʔϜΛՃͤ͞Δɾࢪࡦ͕ඞཁ
LJOUPOFϑϩϯτΤϯυ৽ͷ՝ͱղܾࡦ
🔥ίʔυཧղͷίετͷߴ͞ େͳίʔυྔ ɾສߦΛ͑Δ+4ίʔυ ɾը໘ಡΜͰ͍͚ͩ͘ͰҰۤ࿑
🔥ίʔυཧղͷίετͷߴ͞ $MPTVSF5PPMT ɾੈͷதͰͷใͷগͳ͞ (PPHMFݕࡧΑΓࣾφϨοδͷ΄͏͕๛ ɾ&WFOU1VC4VCʹΑΔδϟϯϓ ɾը໘ͱͷಥ͖߹Θͤͷखؒ
💡ৗతͳϞϒɾϖΞ࡞ۀ جຊతʹϞϒɾϖΞͰ࡞ۀ͢Δ ɾ࡞ۀϓϥϯχϯάͷஈ֊͔ΒෳਓͰ࡞ۀ ɾඇಉظͷίϛϡχέʔγϣϯίετΛ͑Δ ɾ༗ࣝऀ͔ΒμΠϨΫτʹݟΛٵऩ͢Δ
🔥LJOUPOFطଘ։ൃϓϩηεͱͷ૬ੑ ௨ৗͷLJOUPOF։ൃͱಉ͡ϓϩηεͰ࡞ۀ͍ͯͨ͠ ɾεΫϥϜXFFLεϓϦϯτ ɾόοΫϩάˠϦϦʔεՄೳͳҙຯͷ͋Δ୯Ґ ˠܧଓతʹ҆ఆͨ͠ՁΛఏڙͰ͖Δͷ͕ར
🔥LJOUPOFطଘ։ൃϓϩηεͱͷ૬ੑ ϨΨγʔվળͱ૬ੑ͕ѱ͍෦͕͋Δ ɾͦͦϦϦʔεαΠΫϧ͕ҟͳΔ ɾҰ෦εΫϥϜΠϕϯτّ͕ࣜతͳࢀՃʹͳΔ ɾҙࢥܾఆͷ͕ͪൃੜ͢Δ
💡։ൃϓϩηεͷݟ͠ ΑΓਐΊ͍͢ܗʹมߋ ɾΠϕϯτࢀՃඞཁͳͷͷΈʹߜΔ ɾҙࢥܾఆΛLJOUPOF։ൃͱಠཱͯ͠ߦ͏ ɾίϛϡχέʔγϣϯʹ4MBDLΛ׆༻ αΠϘζશମͰLJOUPOF͕ओྲྀ ˠ͍·Ͱʑվળத
৽نϝϯόʔͱͯ͠ײͨ͡՝ͱͬͨ͜ͱ
׳Εͷґଘ ɾ՝ʹରͯ͠׳ΕΕେৎ͕ղܾࡦͳ͜ͱ͕͋Δ ྫ$MPTVSF5PPMTͷίϯϙʔωϯτͱରԠը໘׳ΕΕ֮͑Δ ɾ׳Εʹ࠶ݱੑ͕ͳ͘ݸਓ͕ࠩେ͖͍ ɾେنϑϩϯτΤϯυ৽ରԠظ͍ؒ ؔΘΔϝϯόʔଟ͘ͳΔ ɾ׳ΕΔ·ͰͷίετԿ܁Γฦ͞ΕΔ
ͳʹΛ͖͔͢ʁΛߟ͑Δ🤔
׳ΕͷґଘΛݮΒ͢ ɾ׳Εͯ͠·ͬͨਓʹͱͬͯ՝Ͱͳ͘ͳΔ ˠ৽نϝϯόʔͱͯ͠ײͨ͡՝Λ ɹ͕ࣗ৽نϝϯόʔͷ͏ͪʹղܾ͢Δ ɾ׳ΕଐਓੑͱղऍͰ͖Δ ׳Ε͍ͯͳͯ͘Ͱ͖Δ͕ཧ
ใΛࢹ֮Խ ͕ࣗ٧·ͬͨՕॴΛࢿྉԽͯ͢͠ ܧঝਤ ॳظԽϑϩʔ ίϯϙʔωϯτରԠਤ
$MPTVSF5PPMT%FW5PPMTΛ࡞ 3FBDU%FW5PPMTͷΑ͏ͳ $ISPNF֦ுΛ࡞ 🔗$ZCP[V*OTJEF0VUϑϩϯτΤϯυ৽ͷͨΊʹ%FW5PPMTΛ࡞ͬͯ։ൃΛḿΒͤΔIUUQTCMPHDZCP[VJPFOUSZ ˠίʔυཧղΛՃ
αΠϘζͱ͍͏৫ͷ෩ ɾ໋ྩࢦࣔͳ͍ʢϗϯτʹແ͍ʣ ɾϑϩϯτΤϯυ৽ͱ͍͏ඪʹରͯ͠ ɹ֤͕ࣗʮඞཁͩʂʯͱࢥ͑Δ͜ͱΛΕΔ ɾͦ͜ʹ৽نϝϯόʔ͔Ͳ͏͔ͷڥքແ͍
🎓ΤϯδχΞͱͯ͠ಘΒΕΔͷ ݸਓͷݟղΛؚΈ·͢
ϨΨγʔܦݧࣗମͷՁ ɾϨΨγʔվળಛผͳͷͰͳ͍ ͍·ϞμϯͰ͕࣌ؒܦͯϨΨγʔʹ ɾΤϯδχΞΛଓ͚͍ͯͯආ͚ଓ͚Δͷ͍͠ ɾϨΨγʔࣗମʹৗʹҰఆͷधཁ͕͋Δ ɾܦݧͱ͓ͯ࣋ͬͯ͘͠ϝϦοτ͋Δ
ػձʹόϥ͖͕ͭ͋Δ ɾখ͍͞վળػձଟ͘ɺݸਓɾগਓͰऔΓΊΔ ɾେنͳ৽ػձࣗମ͕͍͠ ˠҙࢥܾఆͷλΠϛϯά͕গͳ͍
େن͔ͩΒͦ͜ಘΒΕΔͷ ɾΞʔΩςΫνϟબఆ ɾσΟϨΫτϦߏ ɾ໋໊نଇ ɾίʔυͷׂ୯Ґ ɾςετཻ ˠେنͳͷͩͱؔΘΔػձࣗମ͕ك ॳظஈ֊͔ΒઃܭʹؔΘΕΔ
େن͔ͩΒͦ͜ಘΒΕΔͷ ٕज़τϨϯυͱҟͳΔֶͼಘΒΕΔ ɾվળʹ͓͚Δ։ൃϓϩηεͷࡦఆ ɾνʔϜ࡞Γ ɾφϨοδӡ༻ ɾ࡞ۀޮ্ͷͨΊͷπʔϧͷબఆ࡞ ˠظతʹ༗༻ͳݟɾεΩϧʹܨ͕Δ
αΠϘζͰͷվળͰಘΒΕΔͷ ɾBZपΓͷݟΛଟֶ͘Δ ɾαΠϘζʹBZͷઐνʔϜ͕ଘࡏ͢Δ ɾBZୡج४Λຬͨ͢6*ίϯϙʔωϯτΛ ɹνʔϜͰڠྗͯ͠࡞
·ͱΊ ˔LJOUPOFϑϩϯτΤϯυ৽·ͩ·ͩଓ͘ ˔՝ଟ͘؆୯ͳͷ͔ΓͰͳ͍͕ɺ վળαΠΫϧΛճ͋͢Δ ˔νʔϜΛՃ͢ΔͨΊͷऔΓΈ͕ඞཁͰɺ ɹͦͷͨΊʹ৽نϝϯόʔͷࢹॏཁ ˔ϨΨγʔͷܦݧΩϟϦΞ্༗༻ ͩͱࢥ͏
͔ͭେنͳΒͰͷֶͼଟ͍
8FBSFIJSJOH
ϑϩϯτΤϯυΤΩεύʔτνʔϜ 8FBSFIJSJOH