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
Next.js 採用の説得材料を考える
Search
井内 将俊
October 30, 2023
Technology
0
130
Next.js 採用の説得材料を考える
CTOA若手エンジニアコミュニティ 勉強会 #4 で登壇した資料です。
井内 将俊
October 30, 2023
Tweet
Share
More Decks by 井内 将俊
See All by 井内 将俊
業務に役立つ! ブラウザデベロッパーツールの機能紹介と活用例
iuchimasatoshi
0
370
ReactメインのチームにNext.jsを導入した道のり
iuchimasatoshi
1
2.7k
新卒研修でNext.js AppRouterを導入した 学びと反省
iuchimasatoshi
3
2.2k
Other Decks in Technology
See All in Technology
Delegating the chores of authenticating users to Keycloak
ahus1
0
160
データ基盤からデータベースまで?広がるユースケースのDatabricksについて教えるよ!
akuwano
3
130
赤煉瓦倉庫勉強会「Databricksを選んだ理由と、絶賛真っ只中のデータ基盤移行体験記」
ivry_presentationmaterials
2
370
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
i35_267
6
13k
関数型プログラミングで 「脳がバグる」を乗り越える
manabeai
2
200
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
54
20k
Lakebaseを使ったAIエージェントを実装してみる
kameitomohiro
0
140
IPA&AWSダブル全冠が明かす、人生を変えた勉強法のすべて
iwamot
PRO
2
170
整頓のジレンマとの戦い〜Tidy First?で振り返る事業とキャリアの歩み〜/Fighting the tidiness dilemma〜Business and Career Milestones Reflected on in Tidy First?〜
bitkey
3
17k
Zero Data Loss Autonomous Recovery Service サービス概要
oracle4engineer
PRO
2
7.8k
Yahoo!しごとカタログ 新しい境地を創るエンジニア募集!
lycorptech_jp
PRO
0
130
Sansanのデータプロダクトマネジメントのアプローチ
sansantech
PRO
0
170
Featured
See All Featured
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
107
19k
4 Signs Your Business is Dying
shpigford
184
22k
How to Think Like a Performance Engineer
csswizardry
25
1.7k
Side Projects
sachag
455
42k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
970
Site-Speed That Sticks
csswizardry
10
690
A Modern Web Designer's Workflow
chriscoyier
695
190k
Embracing the Ebb and Flow
colly
86
4.7k
Adopting Sorbet at Scale
ufuk
77
9.5k
Transcript
Next.js 採用の説得材料を考える 井内 将俊(ペンギン丸) 1
自己紹介 井内将俊(いうち まさとし) X:@pengin_engineer (ペンギン丸) 合同会社DMM.com(23新卒) バーチャルライブチャット → フロントエンド 開発 2
ところで皆さん 3
技術選定してますか? 4
学生〜研修期間の技術選定イメージ 新しい技術! 面白そうな 技術! 使ったことのあ る技術 学びたい技術 よく聞く技術 何か カッコいい
技術 5
これを業務でやると 6
業務での技術選定のイメージ図 長期的に 負債にならな いか...? 運用 コストが高くな いか...? 学習コストが高 くないか...? 採用面で
魅力的か...? 7
「業務で」 「説得力のある」 「技術選定」 難しい... 8
Reactしか使ってないチームの 新規開発で Next.jsを採用する説得材料 🤔 9
技術選定することになった経緯 新卒研修でNext.js、AppRouter、SSR/SSG に触れる こうやってSSRを活 用するんだ! 楽しい! 10
技術選定することになった経緯 配属先でモノレポ React フロントエンドへ触れる スン... 11
技術選定することになった経緯 モノレポリポジトリとは別に、新規リポジトリでサブ的な機 能をReactで実装予定と聞く 新しくリポジトリを作る.... 今まで通りReactで.... 12
技術選定することになった経緯 Next.js使いましょう! うーん 理由は? …SSRとか便利ですし SSRするってことは 専用のサーバーを追加して運 用するってこと? その運用コスト以上の メリットがNext.jsにあるの? 13
技術選定することになった経緯 - Reactで問題なく運用できている - SEO対策も不要 - Next 導入したらNode.jsサーバーを 追加で運用? メリットが無い...
14
Next.jsを使うことで追加でサーバーが 必要なら、Next.jsは無理か... 15
Next.jsを使うことで追加でサーバーが 必要なら、Next.jsは無理か... 勉強不足! 16
SSR用のNode.jsサーバーを 用意しなくても Next.jsは利用可能....! 17
Next.jsで静的出力 18
SSRは行えないので 素のReactとそんなに違いがない...? Next.js採用のメリットは...? 19
Next.jsを採用するメリット 引用:React公式ドキュメント20
Next.jsを採用するメリット 引用:React公式ドキュメント21
Next.jsを採用する説得材料 - Next.jsを導入するからといって Node.jsサーバーを運用する必要があるわけではない - 今後は素のReactではなくNext.js等のフレームワークを 用いたReact活用が主流となってくる 22
Next.jsを採用する説得材料 - Next.jsを導入するからといって Node.jsサーバーを運用する必要があるわけではない - 今後は素のReactではなくNext.js等のフレームワークを 用いたReact活用が主流となってくる 無事新規開発の技術にNext.jsを採用🎉 23
今回の学び - 技術選定は客観的な事実を元に行う - 最新の技術のキャッチアップが欠かせない - 先輩や同期に頼り、知見を聞かせてもらうことも大切 24
ご清聴ありがとうございました! 25