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
この1年でNext.jsで学んだこと あれこれ
Search
Ibuki KAWAMITSU
December 04, 2021
Programming
0
120
この1年でNext.jsで学んだこと あれこれ
Ibuki KAWAMITSU
December 04, 2021
Tweet
Share
More Decks by Ibuki KAWAMITSU
See All by Ibuki KAWAMITSU
GraphQL, Apollo Clientと状態管理
puremoru
1
540
エンジニア目線の「良い失敗」について
puremoru
0
99
Stripe Billingを導入してサブスクリプションを実装した話
puremoru
1
2.1k
BFF勉強会~BFF開発のベストプラクティスを探る研究の途中報告vol.1~
puremoru
2
100
Other Decks in Programming
See All in Programming
Ruby製社内ツールのGo移行
bgpat
2
330
PHP8.3の機能を振り返る / Review of PHP 8.3 features
seike460
PRO
1
110
TYPO3 v13 – The road to LTS: What's new and new APIs
luisasofie_xoxo
0
180
本格ローグライク制作にEbitengineを選んでみた
nagainaganawa
0
290
Git Lint
bkuhlmann
4
740
SwiftUI Performance 不要なViewの再描画と更新を抑える
bigamitiongit
1
150
入門 AWS Amplify Gen2 / Introduction to AWS Amplify Gen2
genkiogasawara
1
310
スクラムガイドのスプリントレトロスペクティブを改めて読みかえしてみた / Re-reading the Sprint Retrospective Section in the Scrum Guide
mackey0225
3
320
코틀린으로 멀티플랫폼 만들기
pangmoo
0
120
Front-end application development, Symfony-style(s)
dunglas
2
1.9k
OpenAPIを中心に考えるAPI開発入門 / Introduction to API Development with a Focus on OpenAPI
seike460
PRO
2
110
スクラムチームと認知負荷 - ニフティのスクラムトーク Vol2. / NIFTY Tech Talk #18
niftycorp
PRO
1
120
Featured
See All Featured
How GitHub (no longer) Works
holman
304
140k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Designing for humans not robots
tammielis
247
25k
Atom: Resistance is Futile
akmur
258
25k
The Invisible Customer
myddelton
114
12k
Typedesign – Prime Four
hannesfritz
36
2k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
240
1.2M
Why Our Code Smells
bkeepers
PRO
331
56k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
154
14k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
119
38k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
39
4.4k
Infographics Made Easy
chrislema
237
18k
Transcript
͜ͷͰ/FYUKTͰֶΜͩ͜ͱ ͋Ε͜Ε $0%&#"4&ଔۀੜ-5େձ
ຬาو ͔ΘΈ͍ͭͿ͖ גࣜձࣾ&#*-"# ༗ݶձࣾΚͼιϑτΣΞΤϯδχΞ ࡾॏݝҏࢢࡏॅ $0%&#"4&ظੜ ݩߨࢣ ࠓͷΧϦΩϡϥϜͷલͷߨ࠲ಈըͷΛ୲ͯ͠·͢
ϑϩϯτΤϯυΑΓͷͳΜͰ !LBJCVLJ ˣ͜͜Ͱຖࣄͯ͠·͢
ࠓ͢͜ͱͱత w લॳֶऀ͚ʹ/FYUKTͷհͱֶश͢Δ্Ͱ࠷ݶ͓͍ͬͯ ͨ΄͏͕͍͍͜ͱΛ͠·͢ɻ w ϑϩϯτΤϯυʹڵຯ͋Δํ͕͜ΕΛػʹ3FBDU /FYUKTΛ৮ͬͯΈ Α͏ͱࢥͬͯ͘ΕͨΒ͍ w ޙ3FBDU
/FYUKTΛ͢Ͱʹ৮ͬͯΔਓ͚ʹ$44ͷঢ়ଶཧ ͷΛͯ͠Έ·͢ɻ ͕࣌ؒ͋Ε
/FYUKTͱ
ग़యIUUQTOFYUKTPSH
/FYUKTͱ w /FYUKT3FBDUΛϕʔεʹͨ͠ϑϩϯτΤϯυϑϨʔϜϫʔΫ w ϑϩϯτΤϯυ։ൃʹ͓͚ΔઃఆύϑΥʔϚϯεɺϧʔςΟϯά ͷஔΛͯ͢ϑϨʔϜϫʔΫͰѲͬͯ͘ΕΔͷͰ։ൃମݧ͕͔ͳ Γྑ͍
ͳͥ/FYUKT͔
ͳͥ/FYUKT͔ w ʑେ͖͘ͳΔϑϩϯτΤϯυͷύϑΥʔϚϯεͷधཁʹɺଞͷٕ ज़ɺϑϨʔϜϫʔΫΑΓઌߦͯ͠ϑϩϯτΤϯυͷਐԽΛݗҾ͠ ͍ͯΔ 1SF3FOEFSJOH ը૾࠷దԽ 3VTU$PNQJMFS 3FBDUS4FSWFS $PNQPOFOUͳͲ
w ઃఆ͍ΒͣͰ࣮ʹணखͰ͖ΔθϩίϯϑΟάΛܝ͍͛ͯͯɺ։ൃ ऀମݧ͕ྑ͍
w $MBTT$PNQPOFOUͱ'VODUJPOBM$PNQPOFOU w 4UZMJOH $44.PEVMF $44JO+4 5BJMXJOE$44 w ঢ়ଶཧ
w $MBTT$PNQPOFOUͱ'VODUJPOBM$PNQPOFOU w 4UZMJOH $44.PEVMF $44JO+4 5BJMXJOE$44 w ঢ়ଶཧ
$MBTT$PNQPOFOUͱ'VODUJPOBM$PNQPOFOU w ͱͱ3FBDUͰίϯϙʔωϯτΛ࣮͢Δʹ$MBTT$PNQPOFOUͱ ݺΕΔछྨͷͷͰॻ͘ඞཁ͕͋ͬͨ w ίϯϙʔωϯτͷϚϯτ࣌ίϯϙʔωϯτͷߋ৽ͳͲͷΠϕ ϯτʹԠͯ͡ॲཧ͕ߦΘΕΔϥΠϑαΠΫϧϝιου͔࣌͠ खஈ͕ͳ͔ͬͨ w ίϯϙʔωϯτͷঢ়ଶΛද͢TUBUF
Մม ্͕هͷཧ༝ΑΓಉ༷ʹ $MBTT$PNQPOFOUͰ͔͠ཧ͕Ͱ͖ͳ͔ͬͨ
$MBTT$PNQPOFOUͱ'VODUJPOBM$PNQPOFOU w 3FBDUWΑΓ)PPLTͱݺΕΔػೳ͕࣮͞ΕɺVTF4UBUF VTF&GGFDUΛͬͯίϯϙʔωϯτͷঢ়ଶཧͱΠϕϯτϥΠϑαΠ ΫϧʹԠͨ͡ॲཧΛɺ'VODUJPOBM$PNQPOFOUͰॻ͚ΔΑ͏ʹͳͬ ͨɻͦΕ؆ܿʹɻ
4UBUF $MBTT$PNQPOFOU
4UBUF 'VODUJPOBM$PNQPOFOU
-JGF$ZDMF $MBTT$PNQPOFOU
-JGF$ZDMF 'VODUJPOBM$PNQPOFOU
-JGF$ZDMF 'VODUJPOBM$PNQPOFOU VTF& ff FDUͷୈҾʹมΛ͢͜ͱͰɺͦͷมʹมߋ͕͋ͬͨͱ͖ͷΈॲཧΛ࣮ߦͤ͞Δࣄ͕Ͱ͖Δ
$MBTT$PNQPOFOUͱ'VODUJPOBM$PNQPOFOU w ͱͱ'VODUJPOBM$PNQPOFOUͰTUBUFͷཧɺϥΠϑαΠΫϧ ʹԠͨ͡ॲཧͷهड़͕͔ͬͨ͠ w )PPLTͷొͰͦͷঢ়گେ͖͘มΘΓɺ'VODUJPOBM$PNQPOFOUͰ ͷهड़͕Մಡੑߴ͘؆ܿʹॻ͚Δ w $MBTT$PNQPOFOUલఏͰઆ໌͕͞Ε͍ͯΔهࣄॻ੶·ͩ·ͩଟ ͍ͷͰɺ'VODUJPOBM$PNQPOFOUͰઆ໌͞Ε͍ͯΔใΛऔΓʹߦ͘
͜ͱ͕͓͢͢Ί
w $MBTT$PNQPOFOUͱ'VODUJPOBM$PNQPOFOU w 4UZMJOH $44.PEVMF $44JO+4 5BJMXJOE$44 w ঢ়ଶཧ
$44.PEVMFWT$44JO+4
$44.PEVMFWT$44JO+4 w ະͩʹ͜͜ͷ૪ଓ͍͍ͯΔɻͲͪΒ͕͍͍͔Έͷ෦͕େ ͖͍ɻ w /FYUKTඪ४Ͱ$44.PEVMF͕ϏϧτΠϯ͞Ε͍ͯΔ w $44JO+4ϥΠϒϥϦ͕ଟ͋͘ΔͷͰԿΛબ͢Δ͔ށ͍͢ ͍ TUZMFEDPNQPOFOUT
TUZMFEKTY FNPUJPO -JOBSJBʜ
$44.PEVMF #VUUPONPEVMFDTT
$44.PEVMF w $44.PEVMFૉͷ$44Ͱ3FBDUʹͳΕͯͳ͍ϚʔΫΞοϓΤϯδχ ΞൺֱతೖΓ͍͢ w ͔͠͠ɺ$44ΛNPEVMFͱݟཱͯͯ%0.ΛSFOEFS͢Δίϯϙʔωϯ τͱผͰ࡞͢Δඞཁ͕͋ΔͷͰɺίϯϙʔωϯτઃܭΛݟ͢Δ ͱґଘؔͰޙʑർฐͦ͠͏
$44JO+4 TUZMFEDPNQPOFOU
$44JO+4 TUZMFEKTY
$44JO+4 TUZMFEDPNQPOFOU TUZMFEKTY w ໊લͷ௨Γ%0.ΛSFOEFSJOH͢Δίϯϙʔωϯτ෦ʹͲͪΒTUZMFΛॻ ͚ΔͷͰґଘ͕ؔ໌ࣔతͰΘ͔Γ͍͢ w 4UZMFEDPNQPOFOUʹؔͯ͠ɺมʹϚʔΫΞοϓͷλάΛೖΕΔͷͰɺ ͲΕ͕ϐϡΞͳ)5.-ͳͷ͔Θ͔Γʹ͍͘ w
4UZMFEKTYTUZMFͷӨڹൣғ͕໌ࣔతͰΘ͔Γ͍͚͢Ͳɺάϩʔόϧʹ ͍͍ͨ$44Λ͔͚ͳ͍
$44JO+4ͷϥΠϒϥϦͷݸਓతͳબఆج४ w 3FBDUಠಛͷTUZMFͷॻ͖ํΛ͠ͳ͍ͱ͍͚ͳ͍͜ͱආ͚ͯɺϚʔΫΞοϓΤϯδχ ΞTUZMFΛॻ͚ΔΑ͏ʹϐϡΞʹ$44ΛදݱͰ͖ΔͷΛબͼ͍ͨ w "UPNJD%FTJHOͰݴ͏ͱ͜ΖͷBUPN͙Β͍ͷنͷίϯϙʔωϯτͷͨΊʹ$44ϑΝ ΠϧΛ༻ҙͨ͘͠ͳ͍ɻάϩʔόϧʹӨڹ͍ͤͨ͞$44ϑΝΠϧׂΛ͠ɺͦΕҎ ֎ͳΔ͘ίϯϙʔωϯτͰ݁Ͱ͖ΔΑ͏ʹ͍ͨ͠ w +4ͷมʹϚʔΫΞοϓͷλάͷίʔυΛೖΕࠐΉΑ͏ͳɺ3FBDUͱີʹॻ͖ͨ͘
ͳ͍ /FYUKT͔Βผ'8ʹҠߦ͢ΔࡍͳͲͷϦεΫ
&NPUJPO 5BJMXJOE$44👍
&NPUJPO w +BWB4DSJQUͰ$44ελΠϧΛهड़͢ΔͨΊʹઃܭ͞ΕͨϥΠϒϥϦ $44JO+4 ϥΠϒϥϦ w ιʔεϚοϓɺϥϕϧɺςετϢʔςΟϦςΟʔͳͲͷػೳʹΑΓɺ։ൃऀʹ ༏ΕͨମݧΛఏڙ͢Δ͚ͩͰͳ͘ɺڧྗͰ༧ଌՄೳͳελΠϧߏΛఏڙ͢Δ w
ҰൠతͳϐϡΞͳ$44ͷهड़Ͱ͖Δ͠ɺଞ$44JO+4ϥΠϒϥϦͱಉ༷ʹ TUZMFΛΦϒδΣΫτͰཧ͢Δॻ͖ํͷྍ๏Λαϙʔτ͍ͯ͠Δ ग़యIUUQTFNPUJPOTIEPDTJOUSPEVDUJPO
&NPUJPO $44ΛϐϡΞʹॻ͍ͯͦΕΛૉͷ)5.-λάʹཁૉͱͯͤ͠Δ
&NPUJPO 1SPQTͰड͚औΔ$44ʹίϯϙʔωϯτͰTUZMFΛ͞ΒʹՃ͢Δ্ॻ͖Ͱ͖Δ
5BJMXJOE$44 ग़యIUUQTUBJMXJOEDTTDPN
5BJMXJOE$44 w େͳϢʔςΟϦςΟΫϥεΛ٧Ί߹ΘͤͨϥΠϒϥϦɻಠࣗͷίϯϙʔω ϯτͳͲ༻ҙ͞Ε͍ͯͳ͍ɻ w جຊ༻ҙ͞Ε͍ͯΔϢʔςΟϦςΟΫϥεΛͬͯελΠϧΛ͍ͯͯ͘ͷ Ͱɺ$44ͷઃܭ໋໊نଇɺཧͷίετ͕ݮΔ w TNUFYUMFGUͷΑ͏ʹը໘෯͝ͱʹTUZMFΛͯΔͨΊͷDMBTT͕༻ҙ͞Ε͍ͯΔ w
ͨͩɺ༻ҙ͞Ε͍ͯͳ͍TUZMFͳͲ͕ग़͖ͯͨࡍʹUBJMXJOEDPOGJHKTͦͷଞಠ ࣗͰ$44ϑΝΠϧΛ༻ҙ͢Δ͜ͱʹͳΓ͕ͪͰத్ͳ$44ઃܭʹͳΔϦε Ϋ༗Γɻ
&NPUJPO 5BJMXJOE$44ʹ͢Δ͜ͱͰ w جຊͷελΠϦϯά5BJMXJOE$44Λͬͯɺಠࣗίϯϙʔωϯτ ͷ࡞TUZMFʹ͚ͩؔ৺ͷ͋Δίϯϙʔωϯτ࣮ͷࡍʹ FNPUJPO w $44ઃܭӡ༻ͷίετΛ͑ͭͭɺ5BJMXJOE$44Ͱ༻ҙ͞Ε͍ͯ ͳ͍TUZMFΛͲ͜ʹॻ͔͘໌֬ʹͳΔ
w $MBTT$PNQPOFOUͱ'VODUJPOBM$PNQPOFOU w 4UZMJOH $44.PEVMF $44JO+4 5BJMXJOE$44 w ঢ়ଶཧ
ঢ়ଶཧͷํΛܾΊΔલʹ w σʔλͷϦΞϧλΠϜੑͷ༏ઌ͕ߴ͍͔Ͳ͏͔ w ͋ΔఔͷϦΞϧλΠϜੑͰ͋ΕΩϟογϡͷੜଘظؒΛௐ͠ͳ͕ Β$43Ͱ੩తϑΝΠϧͷ$%/৴͕Մೳ /FYUKTͷ+".TUBDLࢥ w 3FBE͕ଟ͍ΞϓϦέʔγϣϯͳͷ͔ɺ8SJUF͕ଟ͍ΞϓϦέʔγϣϯͳͷ͔
w 8SJUF͕ଟ͍ΞϓϦέʔγϣϯͰ͋ΕɺϖʔδΛ·͍ͨͩঢ়ଶͷཧ͕ ཁ݅ͱͯ͠ग़ͯ͘Δ͜ͱ͕ଟ͍ɻ
σʔλͷϢʔεέʔεɺͲͪΒʹدͤΔ͔ w ϑϩϯτΤϯυͱόοΫΤϯυΛͨ͠߹ɺϑϩϯτΤϯυͷϢʔ εέʔεʹ߹Θͤͯ"1*Λ࣮͢Δ͔ɺ$36%Ϩϕϧͷγϯϓϧͳ"1*ͷ ߹ϑϩϯτΤϯυ͕ෳϦΫΤετͳͲΛ͢Δ͜ͱͰղܾ͢Δ͔ w ޙऀͷ߹ɺύϑΥʔϚϯεΛ୲อ͢ΔͨΊʹαʔόʔαΠυ͔Βऔಘ ͢Δσʔλ 4FSWFS4UBUF ͷঢ়ଶཧͷ࣮ίετ্͕͕Δ
3FEVY 3FDPJM ͳͲΛͬͨ಄ͷ͍͍ϑϩϯτΤϯυ ˠϑϩϯτΤϯυશମͷ࣮ίε τ্͕͕ͬͯݸਓతʹਏ͍😩
(SBQI2- "QPMMP$MJFOU-4. ✨
(SBQI2- "QPMMP$MJFOU-4. w ϑϩϯτΤϯυͱόοΫΤϯυͷதؒʹ(SBQI2-ΛೖΕΔ͜ͱͰ ϢʔεέʔεΛ(SBQI2-ଆͰٵऩͰ͖Δ w ϑϩϯτΤϯυɺόοΫΤϯυ͕ͦΕͧΕγϯϓϧͳ࣮͕Ͱ͖ Δ w ϑϩϯτΤϯυଆͷ"QPMMP$MJFOU$BDIFΛ3FEVY
3FDPJMͷΑ͏ͳά ϩʔόϧͳঢ়ଶΛೖΕΔೖΕͱݟཱͯΔ͜ͱ͕Ͱ͖Δɻ ϩάΠϯ ͍ͯ͠ΔϢʔβʔใͳͲͷσʔλΛ༻ҙʹཧͰ͖Δ
(SBQI2- "QPMMP$MJFOU-4. ग़యIUUQTXXXBQPMMPHSBQIRMDPNEPDTSFBDUMPDBMTUBUFMPDBMTUBUFNBOBHFNFOU
(SBQI2- "QPMMP$MJFOU-4. ϩάΠϯ͍ͯ͠ΔϢʔβʔΛऔಘ͢Δ2VFSZΛ࣮ߦ͢ΔIPPLTΛ༻ҙͯ͠ɺͦΕΛඞཁͳίϯϙʔωϯτ Ͱ࣮ߦ͢Δ͚ͩͰϩάΠϯ͍ͯ͠ΔϢʔβʔΛऔಘͰ͖Δ
(SBQI2- "QPMMP$MJFOU-4. Λಋೖ͢Δ͜ͱͰ w ϑϩϯτΤϯυଆຖ"QPMMP$MJFOUͷ2VFSZΛ࣮ߦ͢Δ͜ͱͰ 4FSWFS4UBUFͷཧ͕༻ҙʹͰ͖Δɻ w "QPMMP$MJFOUͷ$BDIFΛར༻͢Δ͜ͱͰɺ3FEVYͳͲΛΘͣʹ )PPLTΛ༻ҙͯ͠γϯϓϧͳ࣮͕Մೳ w
(SBQI2-͍͍ͧ