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
さよならRecompose, こんにちはReact Hooks!
Search
Takuya Fujimoto
December 20, 2018
Programming
0
380
さよならRecompose, こんにちはReact Hooks!
- Mix Leap
- React
- React Hooks
- Recompose
Takuya Fujimoto
December 20, 2018
Tweet
Share
More Decks by Takuya Fujimoto
See All by Takuya Fujimoto
React + GraphQLで社内の負債を解決した話
tfrcm
0
470
AppSyncで負債を解決した話
tfrcm
1
370
なぜ社内でGoを採用したのか
tfrcm
0
65
Facebookに行ってきたの秋
tfrcm
0
64
ReactNativeでモバイル開発を始めよう!
tfrcm
0
52
My favorite Morisawa's fonts
tfrcm
0
53
React勉強会② ハンズオン編
tfrcm
0
93
ReactNativeの開発環境を5分で作る
tfrcm
1
340
さぁ!Reactを始めよう!
tfrcm
0
150
Other Decks in Programming
See All in Programming
効率化に挑戦してみたらモバイル開発が少し快適になった話
ryunakayama
0
130
Ruby GitHub Packages
bkuhlmann
0
630
VS Code をプロダクトにどう取り込むか
onomax
1
360
Elm Form Validation
bkuhlmann
0
510
Git Lint
bkuhlmann
4
750
『Railsオワコン』と言われる時代に、なぜブルーモ証券はRailsを選ぶのか
free_world21
0
210
コーンフレークから始める モデリング会話入門
ogurotakayuki
0
370
Komplexe Oberflächen mit SVG und der Web Animation API
joergneumann
0
670
"config" ってなんだ? / What is "config"?
okashoi
0
240
スキーマ駆動開発による品質とスピードの両立 - 私達は何故、スキーマを書くのか
kentaroutakeda
0
170
TYPO3 v13 – The road to LTS: What's new and new APIs
luisasofie_xoxo
0
200
今、知っておきたい! 生成AIエージェントの世界
elith
3
360
Featured
See All Featured
The Straight Up "How To Draw Better" Workshop
denniskardys
227
130k
The Power of CSS Pseudo Elements
geoffreycrofte
60
5k
A Tale of Four Properties
chriscoyier
151
22k
How to Ace a Technical Interview
jacobian
272
22k
Gamification - CAS2011
davidbonilla
76
4.6k
Music & Morning Musume
bryan
41
5.6k
The Pragmatic Product Professional
lauravandoore
25
5.8k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
244
20k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
221
21k
We Have a Design System, Now What?
morganepeng
43
6.8k
Stop Working from a Prison Cell
hatefulcrawdad
266
19k
Building a Modern Day E-commerce SEO Strategy
aleyda
17
6.4k
Transcript
.JY-FBQ4UVEZ8FCϑϩϯτΤϯυฏ࠷ޙͷౙͷਞ ͞ΑͳΒ3FDPNQPTF ͜Μʹͪ3FBDU)PPLT
ϓϩϑΟʔϧ
ΞδΣϯμ wձࣾհ w3FBDU)PPLTͱ w3FDPNQPTFͷ։ൃ͕ऴΘΔ w3FBDU)PPLTͷ"1* w3FBDU)PPLT2" w·ͱΊ ͋͐͡Μͩ
ΞδΣϯμ wձࣾհ w3FBDU)PPLTͱ w3FDPNQPTFͷ։ൃ͕ऴΘΔ w3FBDU)PPLTͷ"1* w3FBDU)PPLT2" w·ͱΊ ͋͐͡Μͩ ͋͐͡Μͩ
(FNDPPL *OD
͐͡Ή͓
ԿΛͬͯΔձ͔ࣾ wΤϯδχΞ͕ू·ͬͯϓϩάϥϜͰϞϊΛ࡞ͬͯΔձࣾ wΫϥΠΞϯτͷΞϓϦɾγεςϜͷ։ൃ wཁ݅ͷώΞϦϯά͔ΒɺσβΠϯɾ։ൃɾӡ༻ɾอक·ͰࣗࣾͷΈͰରԠ wࣗࣾͷαʔϏε։ൃ wϖοτؔ࿈ͷΞϓϦΛ։ൃதɾɾɾ
(FNDPPLͷΤϯδχΞ
(FNDPPLͷΤϯδχΞ ͨͪΤϯδχΞͳͷͰɺ ใͷΠϯϓοτΞτϓοτΛపఈ͍ͯ͠·͢
(FNDPPLͰ͍ͬͯΔٕज़ Πϯϓοτ ϑϩϯτΤϯυ όοΫΤϯυ Πϯϑϥ
044ͷ։ൃ Ξτϓοτ OQNͰ3FBDU༻ͷϥΠϒϥϦΛݸެ։த
.JY-FBQͰษڧձ Ξτϓοτ ࠓ͕(FNDPPLͷࠓճͷ.JY-FBQ
ࠓ.JY-FBQΛ௨ͯ͡ɺ وॏͳମݧ͕͍ͬͺ͍Ͱ͖ͨ
ΤϯδχΞืूͯ͠·͢ IUUQTXXXXBOUFEMZDPNQSPKFDUT 3FBDUɾ7VFɾ(PͰ։ൃ͍ͨ͠ ΤϯδχΞืूதͰ͢ʂ
ΞδΣϯμ wձࣾհ w3FBDU)PPLTͱ wSFDPNQPTFͷ։ൃ͕ऴΘΔ w3FBDU)PPLTͷ"1* w3FBDU)PPLT2" w·ͱΊ ͋͐͡Μͩ
ৄࡉͳઆ໌ʹೖΔલʹ 3FBDU)PPLTͷ֓ཁ͔Β͠·͢
3FBDU)PPLTͱ w݄ʹΞϝϦΧͷωμόभͰ։࠵͞Εͨ3FBDU$POGͰൃද͞Εͨ৽ػೳ w$MBTT$PNQPOFOUΛॻ͔ͣʹɺ'VODUJPO$PNQPOFOUͰTUBUFϥΠϑαΠΫϧͷ༷ͳ ෭࡞༻ͳػೳ͕͑Δ༷ʹͳΔ"1*܈ w4'$͕'$ʹͳΔ wݱࡏWBMQIBʹ࣮͞Ε͍ͯΔ w)P$ͷସ͑ͱͯ͠૽͕Ε͍ͯΔ
3FBDU)PPLT ͷܹΞπͳχϡʔεͷͭ
Կ͕ܹΞπ͔ʁ
3FBDU)PPLTͱ w݄ʹΞϝϦΧͷωμόभͰ։࠵͞Εͨ3FBDU$POGͰൃද͞Εͨ৽ػೳ w$MBTT$PNQPOFOUΛॻ͔ͣʹɺ'VODUJPO$PNQPOFOUͰTUBUFϥΠϑαΠΫϧͷ༷ͳ෭࡞ ༻ͳػೳ͕͑Δ༷ʹͳΔ"1*܈ w4'$͕'$ʹͳΔ wݱࡏWBMQIBʹ࣮͞Ε͍ͯΔ w)P$ͷସ͑ͱͯ͠૽͕Ε͍ͯΔ
ͦΕͷԿ͕Ξπ͔͔ͬͨΛཧղ͢Δҝʹ $PNQPOFOUఆٛͷ͓͞Β͍
छྨͷίϯϙʔωϯτఆٛ w$MBTT$PNQPOFOU w'VODUJPO$PNQPOFOU
$MBTT$PNQPOFOU 'VODUJPO$PNQPOFOU
ݟͨશ͘ಉ͡6*
͡Ό͋ɺԿ͕ҧ͏ͷʁ
྆ऀͷܾఆతͳҧ͍ w$MBTT$PNQPOFOUϥΠϑαΠΫϧΛఆٛͰ͖Δ w$MBTT$PNQPOFOU4UBUFΛఆٛͰ͖Δ
͡Ό͋ɺ'VODUJPO$PNQPOFOUͷԿ͕͍͍ͷʁ
'VODUJPO$PNQPOFOU͍Βͳ͘ͳ͍ʁ
ͦΜͳࣄͳ͍ʂ
'VODUJPO$PNQPOFOUͷૉఢͳॴ w$MBTT$PNQPOFOUʹൺͯจͰ͢Ή ίʔυྔ͕DMBTTΑΓ࠷େݮ wίϯύΠϧޙͷίʔυྔ͕খ͍͞ wϐϡΞͳؔͳͷͰςετ͕͍͢͠ wϐϡΞͳؔͳͷͰɺ6*ͱϩδοΫΛ͍͢͠ wࠓޙͷ3FBDUͷόʔδϣϯͰύϑΥʔϚϯε্͕͢ΔՄೳੑ͕͋Δ wΉΈͨΒͳ෭࡞༻͕ͳ͍ͷͰɺ࠶ར༻ੑ͕ߴ·Δ
ྫ͑#BCFMͰτϥϯείϯύΠϧͨ࣌͠
$MBTT$PNQPOFOUͷϏϧυޙͷίʔυ
'VODUJPO$PNQPOFOUͷϏϧυޙͷίʔυ
ίʔυྔ͕શવҧ͏ʂʂʂʂ
'VODUJPO$PNQPOFOUૉΒ͍͠ ՄೳͳݶΓ'VODUJPO$PNQPOFOUΛ͏͖
ͨͩ'VODUJPO$PNQPOFOUΛ։ൃ͍ͯ͠Δ ్தͰىͬͯ͜͠·͏ࣄ͕͋Γ·͢
'VODUJPO$PNQPOFOUͰॻ͍͚ͨͲɺ ͬͺΓTUBUF͍͍ͨ ͬͺΓϥΠϑαΠΫϧ͍͍ͨFUDʜ
ͦΕΛ͑ͯ͘ΕΔͷ͕ ࠓͷͷl3FBDU)PPLTzͰ͢
ਖ਼ɺ3FBDUքͰ ֵ໋ϨϕϧͷΞοϓσʔτͰ͢
ΞδΣϯμ wձࣾհ w3FBDU)PPLTͱ w3FDPNQPTFͷ։ൃ͕ऴΘΔ w3FBDU)PPLTͷ"1* w3FBDU)PPLT2" w·ͱΊ ͋͐͡Μͩ
͡Ό͋ɺ)PPLT͕ొ͢Δ·Ͱ 'VODUJPO$PNQPOFOUʹTUBUFఘΊͯͨͷ͔ʁ
'VODUJPOͰॻ͍ͯͯɺ్தͰϥΠϑαΠΫϧ͍Δͬ ͯͳͬͨΒ$MBTTʹؤுͬͯॻ͖͑ͯͨͷ͔ʁ
ͦΜͳ࣌)P$ͷϢʔςΟϦςΟϥΠϒϥϦͰ͋Δ l3FDPNQPTFzΛ͍ͬͯ·ͨ͠
ͪ͜Βͷલʹࣝͷ͓͞Β͍
3FBDU։ൃ࣌ʹ͑Δ ͜ΜͳςΫχοΫ͕͋Γ·͢
)P$ )JHIFSPSEFS$PNQPOFOUT wίϯϙʔωϯτΛҾʹͱΓɺՃՁͷ͍ͨίϯϙʔωϯτΛฦؔ͢ wίϯϙʔωϯτʹؚ·ΕΔϩδοΫΛڞ༗ͨ͠Γɺ3FBDUͷ4UBUF1SPQT ΛॊೈʹѻͬͨΓͰ͖Δ w3FBDUͷ࣮Ͱසग़
طʹ3FBDUͰ։ൃͯ͠Δਓʹͱͬͯ ΊͪΌͪ͘ΌΑ͘͏ςΫχοΫͰ͢Ͷ
ͦΜͳ)P$ͷศརͳϥΠϒϥϦ͕ l3FDPNQPTFzͰ͢
3FDPNQPTFͱʁ w)P$Λͬͯɺ'VODUJPO$PNQPOFOUʹTUBUFϥΠϑαΠΫϧΛ࣋ͨͤΔࣄ͕Ͱ͖Δ wSFEVYSFEVYGPSNɾSPVUFSͳͲଞͷ)P$Λఏڙ͍ͯ͠ΔϥΠϒϥϦͱಉډՄೳ wෳͷ)P$ͷॏͶֻ͚ͷՄಡੑ্
3FDPNQPTFͷ։ൃऀʁ "OESFXࢯ
3FDPNQPTFͷਓؾʁ
)P$͕؆୯ʹॻ͚ΔͷͰɺ(FNDPPL Ͱॏๅ͍ͯͨ͠ϥΠϒϥϦ
ཁ3FDPNQPTFґଘ͠·͘Γ
3FBDUΤϯδχΞୡ Ѫ༻͍ͯ͠Δਓ͕͔ͳΓଟ͔ͬͨͱࢥ͍·͢
ͦΜͳதɾɾɾ
ࠓ݄ͷ3FBDU$POGͰͷ%BOࢯͷηογϣϯ 3FEVYɾDSFBUFSFBDUBQQͷ։ൃऀͷ%BOࢯ
͜Μʹͪɺ3FBDU)PPLTʂʂʂʂ
Γ͍ͨࣄ͕3FDPNQPTFʹࣅͯΔͳʔ ͱ͍͏ॴײͰͨ͠
ͳΜ͔ݏͳ͍͢Δͳʔ
Ұํ3FDPNQPTFͷϦϙδτϦͰɾɾɾ
3FDPNQPTFͷ։ൃΊΔΑʂ ࠓޙ3FBDU)PPLTͬͯͶʂ
͓ɺ͓͏
ͳͥ։ൃ͕ࢭ·Δ͔ɺ ͦͷཧ༝͕ͪ͜Β
None
ʮࢲ'BDFCPPL͔Βͷਃ͠ग़Λड͚ೖΕ·ͨ͠ʂ ࠷ߴʹͤͰ͢ʂ͜Εݱ࣮Ͱ͔͢ʁʯ ʮΑ͏ͦ͜ὑʯ
"OESFXࢯɺલʹ'#ʹδϣΠϯͯ͠Δɻস ͔͍ͬͤͦ͢͠͝͏ɻস
3FDPNQPTFͷ։ൃΛΊΔܦҢ w3FDPNQPTFͷ"OESFXࢯ͕'BDFCPPLʹδϣΠϯ wຊՈ3FBDUͰ3FDPNQPTFతͳػೳΛҾ͖ଓ͖։ൃ wˢ3FBDU)PPLT w໋໊ɾ༻ײඃͬͯΔ wSFDPNQPTFXJUI4UBUF w3FBDU)PPLTVTF4UBUF
ͦΓΌ։ൃࢭ·ΔͬͯͰ͢Ͷ
͞ΑͳΒɺ3FDPNQPTFɾɾɾ ͜Μʹͪɺ3FBDU)PPLT ܅ͱྑ͘ͳΔ
ҙ 3FBDUք۾Ͱ3FDPNQPTFͷ։ൃετοϓͷΠϯύΫτ͕ڧ͍ ҹͰ͕͢ɺ3FBDU)PPLT୯७ͳ3FDPNQPTFͷସ͑Ͱ ͋Γ·ͤΜɻ 3FBDU)PPLTͷ"1*Λ͑ɺ3FDPNQPTFతͳࣄͰ͖Δͱ͍ ͏ࣄͰ͢ɻ
ΞδΣϯμ wձࣾհ w3FBDU)PPLTͱ wSFDPNQPTFͷ։ൃ͕ऴΘΔ w3FBDU)PPLTͷ"1* w3FBDU)PPLT2" w·ͱΊ ͋͐͡Μͩ
ओͳ)PPLT"1*܈ wVTF4UBUFɾɾɾTUBUFͷఆ͕ٛͰ͖Δ"1* wVTF&⒎FDUɾɾɾϥΠϑαΠΫϧͬΆ͍ͷ࠶ݱͰ͖Δ"1* wVTF$POUFYUɾɾɾ3FBDU$POUFYUΛ͏"1* wVTF3FEVDFSɾɾɾεςʔτϑϧͳঢ়ଶཧΛ͢Δ"1* wVTF$BMMCBDLɾɾɾ࠶ϨϯμϦϯάͰؔͷ࠶ੜΛ͙"1* ύϑΥʔϚϯε wVTF.FNPɾɾɾ࠶ϨϯμϦϯάͰؔͷ࠶ධՁΛ͙"1*
ύϑΥʔϚϯε wVTF3FGɾɾɾ%0.ʹΞΫηεͰ͖ΔΑ͏ʹ͢Δ"1*
VTF4UBUF wVTF4UBUFͰʮݱࡏͷঢ়ଶʯͱʮঢ়ଶΛߋ৽͢ΔؔʯͷͭΛಘΔ͜ͱ͕ग़དྷΔ wVTF4UBUFͷҾʹJOJUJBM4UBUF ॳظ Λ͢ w͍উखSFDPNQPTFͷXJUI4UBUF ͱ·ΔͰಉ͡
VTF&⒎FDU wVTF&⒎FDUDPNQPOFOU%JE.PVOU DPNQPOFOU%JE6QEBUF DPNQPOFOU8JMM6ONPVOU ͕Έ߹Θͬͨ͞Πϝʔδ
VTF&⒎FDU wDPNQPOFOU%JE.PVOUΛ࠶ݱ͢Δʹɺ͜Μͳײ͡ wୈҾʹ͔ΒͷྻΛ͢
VTF&⒎FDU wJOQVUʹೖྗ͢Δͨͼʹίϯιʔϧϩάʹग़࣮͢ wୈҾʹࢹ͍ͨ͠ͷΛྻʹೖΕͯ͢
VTF$POUFYU w VTF$POUFYU3FBDU$POUFYU"1*ͷ $POTVNFSͷׂΛ͢Δ
VTF3FEVDFS wVTF3FEVDFSͰɺୈҾʹͲͷ࣌Ͳͷ༷ʹΛߋ৽͢Δ͔Λఆٛͨؔ͠ͱୈҾ ʹॳظεςʔτΛҾʹ͢ɻ wεςʔτϑϧͳϩδοΫΛ࠶ར༻͍ͨ͠ͱ͖ʹ͏ɻ SFEVDFSΛผϑΝΠϧʹهड़
VTF3FEVDFS
VTF.FNP w࠶ϨϯμϦϯάʹΑ͋͘Δɺແବͳॲཧ͕Βͳ͍Α͏ʹͳΔ wୈҾʹࢹ͍ͨ͠ͷΛྻʹೖΕͯ͢
VTF$BMMCBDL w࠶ϨϯμϦϯάʹΑ͋͘Δɺແବͳؔ࠶ੜΛ͠ͳ͍Α͏ʹͳΔ wৄ͘͠ʮ3FBDUΠϯϥΠϯؔʯͰݕࡧ
VTF3FG wSFGΛ͏ͨΊͷઃఆ͜Ε͚ͩ wࠓ·ͰͰҰ൪γϯϓϧʹ͑Δ͔͠Εͳ͍
)PPLTͰ࡞ͬͨ5PEPͷαϯϓϧ IUUQTHJUIVCDPNUGSDNIPPLTUSFFIPPLTPOMZ ϒϥϯνຖʹ)PPLTͷΈͩͬͨΓɺ )PPLT 3FVEYͰ͋ͬͨΓɺ )PPLT $POUFYUͩͬͨΓɺ ৭ʑͳαϯϓϧύλʔϯΛ࣮͠Α͏ͱࢥͬͯ·͢
ΞδΣϯμ wձࣾհ w3FBDU)PPLTͱ wSFDPNQPTFͷ։ൃ͕ऴΘΔ w3FBDU)PPLTͷ"1* w3FBDU)PPLT2" w·ͱΊ ͋͐͡Μͩ
2ࠓ͙͢ʹ)PPLTΛ࠾༻͖͢ʁ
"ݱࡏЋ൛ͳͷͰɺ 1SPEVDUJPOڥͰར༻Λආ͚ͨํ͕ྑ͍ɻ
2͍ͭ͑Δ༷ʹͳΔͷʁ
IUUQTSFBDUKTPSHCMPHSFBDUSPBENBQIUNM
2)PPLTͰ3FEVY͕ͳ͘ͳΔʁ
"3FEVY͕ٸʹແ͘ͳΔͱ͔ແ͍Ͱ͢ɻ ແͦ͘͏ͱࢥ͑ɺແͤ͘Δ͕)PPLT͚ͩͰͳ͘$POUFYU"1*ؔΘΓ·͢ɻ VTF$POUFYUͱVTF3FEVDFSΛ͑ɺΕͳ͍ࣄͳ͍͕ɺϧʔϧܾΊ͕େม ௐͯΒ͏ͱ͔Δ͕ɺݱঢ়৭Μͳҙݟ͕ඈͼަ͍ͬͯΔɻ ݱঢ়ฐࣾͰஅવ3FEVYΛ͍ଓ͚Δɻ )PPLTЋͰ͢͠
23FEVYͱ͔3PVUFSͱ͔ )P$Ͱఏڙ͞ΕͯΔϥΠϒϥϦͲ͏͏ʁ
"ී௨ʹ)P$Ͱ͑Δ͠ɺকདྷతʹ֤ϥΠϒϥϦͰରԠ͢Δ͔͠Εͳ͍ɻ ૣ͍͍ͨ͘ͳΒࣗͰ։ൃ͢Δ͔ɺ୭͔͕࡞ͬͨͷΛͬͨΒ͍͍ɻ
23FBDU)PPLTͷ࣮ΛͱΓ͋͑ͣ ݟ͍͕ͨࢀߟ͕͋Δ͔ʁ
wBXTPNFSFBDUIPPLT w3FBDU)PPLTͷҝʹ։ൃ͞ΕͨϥΠϒϥϦୡ͕ ·ͱΊΒΕ͍ͯΔ wlVTFSFEVYzzSFBDUVTFNJEEMFXBSFzͳͲ໊લ ͔Βͯ͑ͦ͠͏ͳϥΠϒϥϦୡ͕ू͍݁ͯ͠Δ wͪΌΜͱಈ࡞͢Δ͔֤ਓͰ͓͔֬ΊԼ͍͞ IUUQTHJUIVCDPNSFIPPLTBXFTPNFSFBDUIPPLT
ͪͳΈʹ
ެࣜʹ'"2͋Γ·͢ɻ Ћͳͷʹطʹஸೡʹ࡞ΒΕ͍ͯͯɺ'#ͷ)PPLTΛਖ਼ͬͯ͘͠ཉ͍͠ ͱ͍͏ؾ͕࣋ͪΘΓ·͢ɻ
ΞδΣϯμ wձࣾհ w3FBDU)PPLTͱ wSFDPNQPTFͷ։ൃ͕ऴΘΔ w3FBDU)PPLTͷ"1* w3FBDU)PPLT2" w·ͱΊ ͋͐͡Μͩ
·ͱΊ w3FBDU)PPLT'$ʹTUBUFϥΠϑαΠΫϧͳͲͷ෭࡞༻Λ࣋ͨ͢ࣄ͕Ͱ͖Δ"1*܈ w3FDPNQPTFͷ"OESFX͞Μ͕'BDFCPPLʹδϣΠϯͯ͠ɺຊՈ3FBDUͰϦϦʔεͨ͠ w༗໊ϥΠϒϥϦʹΑͬͯ)P$Ͱఏڙ͞Ε͍ͯΔؔͨͪɺ͍͔ͭΧελϜϑο ΫͰొ͢Δ༧ఆ wݱࡏЋ൛Ͱʮ͜Εͩʂʯͱ͍͏͍ํ͕ܾ·ͬͨͷ͕ͳ͍͠ɺഁյతมߋશ વݟࠐΊΔͷͰɺຊ൪ڥͰͷར༻ආ͚ͨ΄͏͕ྑ͍
͓·͚ ࡢͷࠒɺ೦ͷҝ3FBDUͷ ࠷৽όʔδϣϯΛௐΔͱɺ ఆ௨ΓͷʮWʯͰͨ͠ɻ
͓·͚ ࠓͷࠒɺ5XJUUFSΛ ݟ͍ͯΔͱɾɾɾ
͓·͚
͓·͚ W͕ϦϦʔε͞Εͯ·ͨ͠ɻ ͨͩ)PPLTೖͬͯͳͯ͘ɺ )PPLTϦϦʔεʮ͙͢ʹʯΒ͍͠Ͱ͢ɻ IUUQTSFBDUKTPSHCMPHSFBDUWIUNM
w 3FBDU)PPLTपΓͷ w Ξοϓσʔτָ͕͘͢͝͠ΈͰ͢Ͷʂ
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠