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
サーバーサイドもTSにしたらモノレポになった.pdf
Search
gizm000
May 10, 2024
Programming
2
170
サーバーサイドもTSにしたらモノレポになった.pdf
gizm000
May 10, 2024
Tweet
Share
More Decks by gizm000
See All by gizm000
NestJSを実運用してみて.pdf
gizm000
1
130
XStateでReactに秩序を与えたい
gizm000
0
1.1k
営業製作所_採用ピッチ資料_202407
gizm000
3
3.6k
React_TypeScript_LT.pdf
gizm000
0
170
もう、例外投げたくないねん neverthrow
gizm000
1
420
レガシー業界を乗り越える
gizm000
1
48
Other Decks in Programming
See All in Programming
Software Architecture
hschwentner
6
2.3k
いま中途半端なSwift 6対応をするより、Default ActorやApproachable Concurrencyを有効にしてからでいいんじゃない?
yimajo
2
440
Six and a half ridiculous things to do with Quarkus
hollycummins
0
180
「ちょっと古いから」って避けてた技術書、今だからこそ読もう
mottyzzz
11
6.9k
NixOS + Kubernetesで構築する自宅サーバーのすべて
ichi_h3
0
1.1k
株式会社 Sun terras カンパニーデック
sunterras
0
370
コードとあなたと私の距離 / The Distance Between Code, You, and I
hiro_y
0
180
kiroとCodexで最高のSpec駆動開発を!!数時間で web3ネイティブなミニゲームを作ってみたよ!
mashharuki
0
730
TFLintカスタムプラグインで始める Terraformコード品質管理
bells17
2
320
AI Coding Meetup #3 - 導入セッション / ai-coding-meetup-3
izumin5210
0
3.4k
ALL CODE BASE ARE BELONG TO STUDY
uzulla
25
6.4k
Claude Agent SDK を使ってみよう
hyshu
0
1.3k
Featured
See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
It's Worth the Effort
3n
187
28k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Unsuck your backbone
ammeep
671
58k
Java REST API Framework Comparison - PWX 2021
mraible
34
8.9k
Making Projects Easy
brettharned
120
6.4k
Side Projects
sachag
455
43k
Visualization
eitanlees
149
16k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
37
2.6k
Code Reviewing Like a Champion
maltzj
526
40k
Transcript
サーバーサイドもTSにしたら モノレポになった 営業製作所 白石 卓馬
会社紹介:営業製作所 ・設立 2020年4月 ・本社 大阪 (肥後橋駅 徒歩3分) ・従業員数 150名弱 (2024年4月時点)
・目的 日本の製造業を支える ・特徴 泥臭い中にこそ本質がある
自己紹介 ・なまえ 白石 卓馬 (gizm000) ・出身地 大阪 ・職種 ソフトウェアエンジニア ・経歴
SIer → 受託 → SaaS
営業製作所のざっくり技術スタック ・フロントエンド:Next.js ・サーバーサイド:NestJS ・IasC:Terraform (CDKじゃないヨ) 業務で使う80%以上がTypeScript
サーバーサイドで TS書いてる人?
プラクティス不足し ていませんか?
弊社で採用してい る手法を紹介させ てもらいます!
インフラ紹介(一部)
インフラ紹介(一部) ・複数アプリケーションが存在
インフラ紹介(一部) ・複数アプリケーションが存在 ・データベースはひとつ
インフラ紹介(一部) ・複数アプリケーションが存在 ・データベースはひとつ 処理を共通化したい
npm workspace ・ほぼ設定いらずでモノレポが作れる ・パッケージ間での相互参照が簡単にできる ・npm package 作るとかめんどくさいので助かる ✨ ・ビルドの依存関係ガーとか細かいことはそんなにできない ・裏を返すと引き剥がしやすい
・大きくなったらTurboとかにお引越しも検討 🚚
npm workspace product ┗ node_modules ┗ packages ┗ frontend ┗
backend ┗ schema ┗ and more
npm workspace product ┗ node_modules ┗ packages ┗ frontend ┗
backend ┗ schema ┗ and more ← node_modulesに各パッケージへの シンボリックリンクが生成される
npm workspace product ┗ node_modules ┗ packages ┗ frontend ┗
backend ┗ schema ┗ and more ← node_modulesに各パッケージへの シンボリックリンクが生成される `import { hoge } from @product/schema` これで他パッケージから参照可能 ✨
npm workspace product ┗ node_modules ┗ packages ┗ validators ┗
utilities ┗ tsconfig ┗ eslint ← zodで記述した共通バリデーション frontend/backendで共通利用
npm workspace product ┗ node_modules ┗ packages ┗ validators ┗
utilities ┗ tsconfig ┗ eslint ← 各種パッケージで共通のtsconfigを用意 front, back間で共通はさせない方がよいかも...
NestJS モノレポモード ・NestJSではモノレポモードというものがある ・複数のアプリケーションを構築できる e.g. GraphQL Server, REST API Server,
Queue worker, etc…. ・共通処理(ユーティリティ、ドメインロジック)を再利用しやすい
NestJS モノレポモード product ┗ node_modules ┗ packages ┗ frontend ┗
backend ┗ schema ┗ and more
NestJS モノレポモード product ┗ node_modules ┗ packages ┗ frontend ┗
backend ┗ schema ┗ and more ← この配下でネストさせられる 👀
NestJS モノレポモード backend ┗ apps ┗ main ┗ worker ┗
other ┗ shared ┗ core ┗ infrastructure ┗ utils
NestJS モノレポモード backend ┗ apps ┗ main ┗ worker ┗
other ┗ shared ┗ core ┗ infrastructure ┗ utils ← ひとつのNestJSプロジェクトに格納可能
NestJS モノレポモード backend ┗ apps ┗ main ┗ worker ┗
other ┗ shared ┗ core ┗ infrastructure ┗ utils ← appsで共通利用可能なドメインロジック
NestJS モノレポモード backend ┗ apps ┗ main ┗ worker ┗
other ┗ shared ┗ core ┗ infrastructure ┗ utils ← AWSクライアントなどのインフラ層
NestJS モノレポモード backend ┗ apps ┗ main ┗ worker ┗
other ┗ shared ┗ core ┗ infrastructure ┗ utils ← ドメインの関係ないユーティリティ
NestJS モノレポモード backend ┗ apps ┗ main ┗ worker ┗
other ┗ shared ┗ core ┗ infrastructure ┗ utils ← ドメインの関係ないユーティリティ npm workspaceでも 同じことできそう 🤔
NestJS モノレポモード ・npm workspace との違いは? ・NestJS モノレポモードではnpm packageの単位として同一になる ・つまり package.jsonは共有
→ package.jsonを分離したいなら分けた方がよい ・何が嬉しい? ・npm workspaceで複数のNestJSアプリを作らなくてよい → 認知負荷の軽減
まとめ 📚 ・サーバーサイドをTSにしたときのプラクティスがもっと欲しい! Ruby, Java, PHP のように枯れていない・・・ ・営業製作所では以下を使って構成している ・npm workspace
・モジュラーモノリスのような構成が作りやすい ・NestJS モノレポモード ・NestJSに閉じるなら、npm workspaceよりカンタン
さいごに ・他企業との合同勉強会を企画したい ❗ → X, LinkedIn などで気軽にご連絡ください ・絶賛採用活動中です❗ → X,
LinkedIn, Green, LAPRAS, … ご応募お待ちしております 😆