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.5k
React_TypeScript_LT.pdf
gizm000
0
170
もう、例外投げたくないねん neverthrow
gizm000
1
420
レガシー業界を乗り越える
gizm000
1
45
Other Decks in Programming
See All in Programming
CSC305 Lecture 01
javiergs
PRO
1
400
Goで実践するドメイン駆動開発 AIと歩み始めた新規プロダクト開発の現在地
imkaoru
4
790
ポスターセッション: 「まっすぐ行って、右!」って言ってラズパイカーを動かしたい 〜生成AI × Raspberry Pi Pico × Gradioの試作メモ〜
komofr
0
1.2k
(Extension DC 2025) Actor境界を越える技術
teamhimeh
1
250
Back to the Future: Let me tell you about the ACP protocol
terhechte
0
140
CSC305 Lecture 06
javiergs
PRO
0
210
Six and a half ridiculous things to do with Quarkus
hollycummins
0
140
私はどうやって技術力を上げたのか
yusukebe
43
18k
GraphQL×Railsアプリのデータベース負荷分散 - 月間3,000万人利用サービスを無停止で
koxya
1
1.2k
Django Ninja による API 開発効率化とリプレースの実践
kashewnuts
0
1.2k
詳しくない分野でのVibe Codingで困ったことと学び/vibe-coding-in-unfamiliar-area
shibayu36
3
4.8k
止められない医療アプリ、そっと Swift 6 へ
medley
1
140
Featured
See All Featured
Build your cross-platform service in a week with App Engine
jlugia
232
18k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
45
2.5k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
Making the Leap to Tech Lead
cromwellryan
135
9.6k
Docker and Python
trallard
46
3.6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
970
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
850
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Code Review Best Practice
trishagee
72
19k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
Testing 201, or: Great Expectations
jmmastey
45
7.7k
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, … ご応募お待ちしております 😆