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
1.2k
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Clean Architecture by TypeScript & NestJS
ryounasso
July 10, 2024
More Decks by ryounasso
See All by ryounasso
明日から始めるリファクタリング
ryounasso
0
250
駆け足で Google から学ぶテスト設計の指針
ryounasso
0
210
React inside basics: learn from “build own react"
ryounasso
0
220
抽象データ型について学んだ
ryounasso
0
430
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
4k
Fast API を用いた Web API の開発
ryounasso
1
620
テストゼロの個人開発プロジェクトにテストを導入した話
ryounasso
0
490
簡易 DI コンテナを作って DI コンテナを知る
ryounasso
1
1.4k
TypeScript_コンパイラの内側に片足を入れる
ryounasso
3
990
Other Decks in Programming
See All in Programming
TAKTでAI駆動開発の品質を設計する
j5ik2o
6
1.2k
正しくソフトウェアを作る、前提を疑うための認知の視点 / doubt-premise
minodriven
21
6.6k
LLM本来の能力を解き放つサンドボックス技術とAI民主化への適用
yukukotani
3
3.8k
Lessons from Spec-Driven Development
simas
PRO
0
190
キャリア迷子上等 ─ "ない道"は自分で作ればいい
16bitidol
3
2.1k
Javaの型とAI時代に型が大事な理由 / java types and type in AI era
kishida
2
130
AI時代の仕事技芸論 — ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ
kuranuki
2
670
Semantic Version 単位で戦略を柔軟に変えて、パッケージアップデートを自動化する
daitasu
0
230
Language Server 使ってる? 〜VSCode と Zed の場合〜 / Are you using a Language Server? ~For VS Code and Zed~
handlename
0
780
肥大化するレガシーコードに立ち向かうためのインターフェース分離と依存の逆転 / JJUG CCC 2026 Spring
hirokunimaeta
0
540
技術記事、AIに書かせるか、自分で書くか? 〜それでも私が自分の手で書く理由〜 / #QiitaConference
jnchito
2
1.4k
AIで効率化できた業務・日常
ochtum
0
130
Featured
See All Featured
Technical Leadership for Architectural Decision Making
baasie
3
410
Context Engineering - Making Every Token Count
addyosmani
9
960
Odyssey Design
rkendrick25
PRO
2
700
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
Code Review Best Practice
trishagee
74
20k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.5k
Testing 201, or: Great Expectations
jmmastey
46
8.2k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.2k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.7k
Game over? The fight for quality and originality in the time of robots
wayneb77
1
200
The SEO identity crisis: Don't let AI make you average
varn
0
490
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
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