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
2年運用したサービスのフロントをReactで書き換えたい話
Search
dachi023
October 12, 2016
Programming
5
2.1k
2年運用したサービスのフロントをReactで書き換えたい話
16.10.12 tech_eight_react
dachi023
October 12, 2016
Tweet
Share
More Decks by dachi023
See All by dachi023
AI時代のリアーキテクチャ戦略 / Re-architecture Strategy in the AI Era
dachi023
0
250
チーム開発を円滑に進めるためのOSS / Lightning TechTalks 20231102
dachi023
0
430
なぜその技術を使うのか? / Connehito marche online 20201112
dachi023
0
810
リモートワークの導入から3ヶ月 / Connehito marche online 20200311
dachi023
2
3k
急に大量のHTMLが必要になったこと、ありませんか? / BIT VALLEY INSIDE vol8
dachi023
0
8k
ママリのweb技術の今と未来 / mamari's front-end present and future
dachi023
2
1.4k
beginner_react_flux
dachi023
1
450
エンジニアがUIデザインをしてみた話
dachi023
1
1.3k
Other Decks in Programming
See All in Programming
Processing Gem ベースの、2D レトロゲームエンジンの開発
tokujiros
2
120
Updates on MLS on Ruby (and maybe more)
sylph01
1
180
TDD 実践ミニトーク
contour_gara
1
280
詳解!defer panic recover のしくみ / Understanding defer, panic, and recover
convto
0
210
RDoc meets YARD
okuramasafumi
4
160
testingを眺める
matumoto
1
130
AIレビュアーをスケールさせるには / Scaling AI Reviewers
technuma
2
240
Langfuseと歩む生成AI活用推進
licux
3
320
2025 年のコーディングエージェントの現在地とエンジニアの仕事の変化について
azukiazusa1
17
7.8k
Honoアップデート 2025年夏
yusukebe
1
910
CloudflareのChat Agent Starter Kitで簡単!AIチャットボット構築
syumai
2
380
Namespace and Its Future
tagomoris
6
690
Featured
See All Featured
[RailsConf 2023] Rails as a piece of cake
palkan
56
5.8k
Documentation Writing (for coders)
carmenintech
73
5k
Thoughts on Productivity
jonyablonski
69
4.8k
Music & Morning Musume
bryan
46
6.8k
GraphQLとの向き合い方2022年版
quramy
49
14k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
For a Future-Friendly Web
brad_frost
179
9.9k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
11
1.1k
Raft: Consensus for Rubyists
vanstee
140
7.1k
A Tale of Four Properties
chriscoyier
160
23k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
910
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Transcript
ӡ༻ͨ͠αʔϏεͷ ϑϩϯτΛ3FBDUͰॻ͖͍͑ͨ 3FBDUษڧձWPMٸελʔτΞοϓΛࢧ͑Δ3FBDUٕज़-5 $POOFIJUP JOD ՈͷຖΛͬͱসإʹɻ
ϓϩϑΟʔϧ 3ZP"EBDIJ $POOFIJUP *OD'SPOUFOEFOHJOFFS !EBDIJ !EBDIJ@
࠷ۙͷग़དྷࣄ w ഏʹ͕݀։͖·ͨ͠ w පӃ৯ຯ͕ബ͍ w ୀӃޙʹϥʔϝϯΛ৯ͨ w ͘͢͝ඒຯ͔ͬͨ͠Ͱ͢ʜ ͡ΊͯͷೖӃ
w 3FBDUΛಋೖ͍ͨ͠ w Ϟμϯͳڥͮ͘Γ w طଘίʔυͷϦϑΝΫλ w 3FBDUͷಋೖ ͢༰
3FBDUΛಋೖ͍ͨ͠ 3FBDUษڧձWPMٸελʔτΞοϓΛࢧ͑Δ3FBDUٕज़-5
3FBDUΛಋೖ͍ͨ͠ཧ༝ w %0.ૢ࡞͔Βղ์͞Ε͍ͨ w 'MVYͰঢ়ଶཧΛෳࡶԽͤ͞ͳ͍ w ϑϩϯτपΓΛϞμϯʹ͍ͯ͘͠ ଞʹ͍Ζ͍Ζ 3FBDUҠߦͷϝϦοτ
2"ΞϓϦ XFCϝσΟΞ Ϋϥυιʔγϯά ϚϚϦαϙʔλʔζ ϚϚϦ ϚϚϦ2 $POOFIJUPͷϚϚϦࣄۀ
2"ΞϓϦ XFCϝσΟΞ Ϋϥυιʔγϯά ϚϚϦαϙʔλʔζ ϚϚϦ ϚϚϦ2 $POOFIJUPͷϚϚϦࣄۀ ࠓճͷλʔήοτ
Ϋϥυιʔγϯά ϚϚϦαϙʔλʔζ ϚϚϦαϙʔλʔζʹͨ͠ཧ༝ ࠓճͷλʔήοτ w ϚϚϦ2ΞϓϦ w 4&0Λؾʹ͠ͳͯ͘ྑ͍ w ࣮ܦݧ͕ଟ͍
ݟ͕͋Δ ͳͥαϙʔλʔζ͔
͔͠͠ w OQNܦ༝ͱ%-͕ڞଘ w SFRVJSFFYQPSU͑ͳ͍ w ίʔυશͯ&4 w K2VFSZͱ#BDLCPOF͕ϝΠϯ w
ϑΝΠϧઍߦͷίʔυ 3FBDUͷಋೖʹ·ͩԕ͍
3FBDUΛ࢝ΊΔલʹ w ϞμϯͳڥΛ༻ҙ͢Δ w طଘίʔυͷϦϑΝΫλΛ͢Δ ಋೖͷͨΊͷ४උ
Ϟμϯͳڥͮ͘Γ 3FBDUษڧձWPMٸελʔτΞοϓΛࢧ͑Δ3FBDUٕज़-5
Ϟμϯͳڥͮ͘Γ w ґଘϥΠϒϥϦΛશͯOQNͰཧ w XFCQBDLͰϏϧυ͢Δ w #BCFMͰ&4·ͰରԠ ͬͨ͜ͱ
Ϟμϯͳڥͮ͘Γ w ະ༻όʔδϣϯෆ໌ͷϥΠϒϥϦ͕͋Δ w ͍ͬͯͨϥΠϒϥϦશͯOQNରԠ͍ͯͨ͠ w όʔδϣϯ͕͔Βͳ͍ͷ࠷৽ʹͯ͠ΈΔ ಈ͍ͨΒϥοΩʔɺಈ͔ͳ͔ͬͨΒमਖ਼ w Γସ͑ͨΒHJUSNIPHFKTͯ͠ফ͍ͯ͘͠
ґଘϥΠϒϥϦΛશͯOQNͰཧ
Ϟμϯͳڥͮ͘Γ w SFRVJSFFYQPSU͕Ͱ͖Δڥͮ͘Γ w XBUDINPEFͰߴͳࠩϏϧυ w େͨ͠ΠϨΪϡϥʔͳ͘ҠߦͰ͖ͨ w ͍͍ͩͨMPBEFSͰαΫοͱղܾ͢Δ w
શͯOQNཧʹͨ͠ͷ͕ྑ͔ͬͨ XFCQBDLͰϏϧυ͢Δ
Ϟμϯͳڥͮ͘Γ w ࡦఆ͞Ε༷ͨͲΜͲΜऔΓࠐΈ͍ͨ w ಛʹ&4͕͋Δͱ͋Γ͕͍ͨ w XFCQBDLΛհͯ͠Ϗϧυ͢ΔͷͰCBCFMMPBEFSͰରԠ #BCFMͰ&4·ͰରԠ
طଘίʔυͷϦϑΝΫλ 3FBDUษڧձWPMٸελʔτΞοϓΛࢧ͑Δ3FBDUٕज़-5
طଘίʔυͷϦϑΝΫλ w SFRVJSFFYQPSUΛ͏ w &4ͷه๏Ͱॻ͘ w -JOUFSΛͬͯίʔυͷܗ ͬͨ͜ͱ
طଘίʔυͷϦϑΝΫλ w άϩʔόϧͳఆٛΛফͯ͠FYQPSU͢ΔΑ͏ʹमਖ਼ w ઍߦ͋ΔϑΝΠϧΛෳʹׂͯ͠ݟ௨͠ͷѱ͞վળ w ݺͼग़͠ճ͕গͳ͍ͷ͔ΒΔͱؾ࣋ͪతʹָ w ίʔυશମͷӨڹগͳ͍ w
6UJMܥͱ͔࠷ޙʹؾ߹͍ೖΕͯΔ SFRVJSFFYQPSUΛ͏
طଘίʔυͷϦϑΝΫλ w ߏจܥΛ༏ઌతʹऔΓࠐΜͰॻ͖͍͑ͯ͘ w GVODUJPO B C ˠ B C
\^ w WBSΛMFU DPOTUʹஔ͖͑Δ w ৽͍ؔ͠ॻ͖͑ʹ͕͔͔࣌ؒΔͷ͕ଟ͍ w ػೳ࣮தͱ͔ʹ৮ͬͨ෦Λ͍ͭͰʹ͢ &4ͷه๏Ͱॻ͘
طଘίʔυͷϦϑΝΫλ w ਓʹΑͬͯॻ͖ํʹΒ͖͕ͭ͋ͬͯϝϯςͮ͠Β͍ w &4-JOUΛಋೖ w FTMJOUSFDPNNFOEFEͰҾ͔͔ͬͬͨ෦Λ·ͣमਖ਼ w ऴΘͬͨΒϧʔϧΛՃͯͦ͠ΕΛमਖ਼ɺΛ܁Γฦ͢ -JOUFSΛͬͯίʔυͷܗ
هࣄॻ͍ͨ✏ &4-JOUΛ్தͰಋೖͨ͠ͱ͖ͷFTMJOUSDͷઃఆͱӡ༻ํ๏ʹ͍ͭͯߟ͑ͨ IUUQUFDIDPOOFIJUPDPNFOUSZ
&4-JOUͷಋೖ w Πϯσϯτεϖʔε w վߦίʔυ-' w WBS༻ېࢭ w ηϛίϩϯෆཁ SFDPNNFOEFEҎ֎ͷϧʔϧ
ϦϑΝΫλͨ݁͠Ռ w ϦϑΝΫλظؒϲ݄ w ΊͪΌΊͪΌݮͬͨݟ௨͠ྑ͘ͳͬͨ େ෯ͳίʔυͷॖ
3FBDUͷಋೖ 3FBDUษڧձWPMٸελʔτΞοϓΛࢧ͑Δ3FBDUٕज़-5
ਐḿͲ͏Ͱ͔͢ʁ w ·ͩͰ͖͍ͯͳ͍ w ผ࡞ۀʹϦιʔε͍ͯͯͨ ࣍εϥΠυ ະணख
3FBDUԽਐΜͰ͍Δ w αʔϏεͱͦͷཧػೳͷີ݁߹͕ى͖͍ͯΔ w ཧػೳΛΓग़ͯ͠σεΫτοϓΞϓϦԽ͍ͯ͘͠ w 3FBDU 'MVY 'MVY6UJMT Ͱ࣮
w ্ཱ͔ͪ͛ͨΓͰࠓਓͰ։ൃத ཧػೳͷ&MFDUSPOԽ
ࠓޙͷ࡞ઓ w #BDLCPOF7JFXΛ3FBDU$PNQPOFOUʹॻ͖͍͑ͯ͘ w IBOEMFCBSTͷ࣮KTYͱͯ͠$PNQPOFOUʹؚ·ͤΔ ίʔυͷॻ͖͑
ࠓޙͷ࡞ઓ w 'MVY6UJMTʹ͢Δ༧ఆ w ബ͘'MVYͷαΠΫϧΛಋೖͰ͖Δ w 3FEVY΄Ͳͷ༏ल͞ඞཁͳ͍ 'MVYϑϨʔϜϫʔΫ
ࠓޙͷ࡞ઓ w ࠷ऴతʹK2VFSZґଘΛʹ͍ͨ͠ w $44ʹͰ͖ΔՕॴ$44Ͱॻ͖͢ w 6UJMJUZతʹ͍ͬͯΔ෦MPEBTIͳͲʹ͍ͯ͘͠ K2VFSZͷআ
͍͞͝ʹ 3FBDUษڧձWPMٸελʔτΞοϓΛࢧ͑Δ3FBDUٕज़-5
͍͞͝ʹ w ͙͢ʹղܾͰ͖ΔͰͳ͍ w ͍ͰݟΔͷ͕େࣄ w ಓʹ͢៉ྷʹ͍ͯ͘͠ w 3FBDUͱϞμϯ+4ͷѪ͕͋ΕΓ͛ΒΕΔ ͘͢͝େมͰ͢
͍͞͝ʹ ࠓޙؤுΓ·͢
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ $POOFIJUP JOD ՈͷຖΛͬͱসإʹɻ 3FBDUษڧձWPMٸελʔτΞοϓΛࢧ͑Δ3FBDUٕज़-5