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
Clean Architecture by TypeScript & NestJS
Search
ryounasso
July 10, 2024
Programming
0
580
Clean Architecture by TypeScript & NestJS
ryounasso
July 10, 2024
Tweet
Share
More Decks by ryounasso
See All by ryounasso
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
1.6k
Fast API を用いた Web API の開発
ryounasso
0
440
テストゼロの個人開発プロジェクトにテストを導入した話
ryounasso
0
350
簡易 DI コンテナを作って DI コンテナを知る
ryounasso
1
840
TypeScript_コンパイラの内側に片足を入れる
ryounasso
3
680
kintone新機能開発のお仕事
ryounasso
2
100
Other Decks in Programming
See All in Programming
asdf-ecspresso作って 友達が増えた話 / Fujiwara Tech Conference 2025
koluku
0
1.4k
DevFest - Serverless 101 with Google Cloud Functions
tunmise
0
140
どうして手を動かすよりもチーム内のコードレビューを優先するべきなのか
okashoi
3
870
ISUCON14感想戦で85万点まで頑張ってみた
ponyo877
1
590
React 19でお手軽にCSS-in-JSを自作する
yukukotani
5
560
技術的負債と向き合うカイゼン活動を1年続けて分かった "持続可能" なプロダクト開発
yuichiro_serita
0
300
見えないメモリを観測する: PHP 8.4 `pg_result_memory_size()` とSQL結果のメモリ管理
kentaroutakeda
0
930
各クラウドサービスにおける.NETの対応と見解
ymd65536
0
250
20年もののレガシープロダクトに 0からPHPStanを入れるまで / phpcon2024
hirobe1999
0
1k
Stackless и stackful? Корутины и асинхронность в Go
lamodatech
0
1.3k
いりゃあせ、PHPカンファレンス名古屋2025 / Welcome to PHP Conference Nagoya 2025
ttskch
1
170
令和7年版 あなたが使ってよいフロントエンド機能とは
mugi_uno
10
5.1k
Featured
See All Featured
Site-Speed That Sticks
csswizardry
2
270
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
30
2.1k
Optimising Largest Contentful Paint
csswizardry
33
3k
What's in a price? How to price your products and services
michaelherold
244
12k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
960
Designing for humans not robots
tammielis
250
25k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
3
360
Agile that works and the tools we love
rasmusluckow
328
21k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
Visualization
eitanlees
146
15k
Keith and Marios Guide to Fast Websites
keithpitt
410
22k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
10
860
Transcript
Clean Architecture by TypeScript & NestJS
クリーンアーキテクチャを学んで 実装してみた経験をお話します
Clean Architecture とは ビジネスロジックを中心におき、インタフェースや技術を外側に配置する設計アプローチ 依存の向きは常に内側を向き、ユースケースと周辺の関心事を分離する 持つ特性 • フレームワーク非依存 • テスト可能
• UI 非依存 • データベース非依存 • 外部エージェント非依存 Clean Architecture 達人に学ぶソフトウェアの構造と設計
4 つのレイヤー Enterprise Business Rules Entities と呼ばれる、ビジネスルールをカプセル化したものが存在するレイヤ− Application Business Rules
システムのユースケースがカプセル化・実装されているレイヤー Interface Adapters 円の内側に便利な形から、Web や DB などに便利な形に変換するレイヤー Frameworks & Drivers フレームワークやツールで構成されるレイヤー (必ずしも 4 つである必要はない ただし依存関係の向きだけは守る必要がある)
Web ベースのシステムに落とし込むと 依存の向きを見てみると、 全てが依存性のルールに従って、 内側に向いている Clean Architecture 達人に学ぶソフトウェアの構造と設計
実装 お題 : Todo アプリ 使用技術 : TypeScript, NestJS, Prisma
リポジトリ : https://github.com/ryounasso/todo-app-by-clean-architecture
Entity constructor / getter は省略
Usecase ( Service )
Interface ( Controller )
Interface ( Repository )
じゃあこの Todo アプリでできることは?
この Todo アプリでできること
実装振り返り
実装振り返り Presenter を実装していない
実装振り返り getTodoList の返り値 当初は、Todo Entity の内容全てを返す設計 ↓ ユースケースとして、 Todo の一覧をユーザーが見るときに、
全ての情報が欲しいケースがありそうか? → なさそう
実装振り返り getTodoList の返り値 ユーザーが欲しいフィールドを返す設計に変更
まとめ • 各レイヤーに意図があり、それらの間に境界を設けて、 分けて管理することで可動性の向上を実感 • ユースケースをしっかり考えることが重要 • DB や Framework
の置き換えのコストを減らせる • テストがしやすい
参考資料 • Clean Architecture 達人に学ぶソフトウェアの構造と設計 • The Clean Architecture https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architectur
e.html