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
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
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
290
駆け足で Google から学ぶテスト設計の指針
ryounasso
0
230
React inside basics: learn from “build own react"
ryounasso
0
240
抽象データ型について学んだ
ryounasso
0
470
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
4.3k
Fast API を用いた Web API の開発
ryounasso
1
640
テストゼロの個人開発プロジェクトにテストを導入した話
ryounasso
0
510
簡易 DI コンテナを作って DI コンテナを知る
ryounasso
1
1.4k
TypeScript_コンパイラの内側に片足を入れる
ryounasso
3
1.1k
Other Decks in Programming
See All in Programming
Webエンジニアなのにブラウザの仕組みがわからないので、Pythonで自作してみた
tatsuki12
4
1.7k
From 6 People Classroom Meetup to 100 People Regional Conference / FOSS4G Hiroshima 2026
furukawayasuto
0
110
20260828_品質と開発生産性を両立させる、AI時代のE2Eテストの考え方
magicpod
0
160
Go × SIMDで高速化するベクトル検索 ~ルーフラインモデルでSIMDが効く境界を探れ! ~
po3rin
1
140
AIに既存システムを理解させる技術 ~レガシーを見捨てないハーネスエンジニアリング入門~
ochtum
0
210
Pythonの実行はどこまで賢くなったのか? CPythonとPyPyから見る最適化のしくみ
curekoshimizu
4
2.8k
スマート反転とウェブアクセシビリティ
camiha
0
140
Vibes Containers 〜AIで変わるコンテナ設計と運用〜
tkikuc
2
500
[DroidKaigi 2026] Bring your own phones to Gradle Managed Devices
f2lk
0
110
一参加者から『中の人』へ 〜全通PHPerがブースに立って学んだ、カンファレンスを100倍楽しむコツ〜
wp_daisuke
0
120
不幸な GC
chencmd
0
890
AI に Inclusive UI を書かせよう — Design Rules Skill で Compose UI を作り直す
theoriatec2024
1
460
Featured
See All Featured
The Cost Of JavaScript in 2023
addyosmani
55
10k
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
560
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
2
670
Reality Check: Gamification 10 Years Later
codingconduct
0
2.3k
WCS-LA-2024
lcolladotor
0
820
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
inesmontani
PRO
3
2.4k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.5k
The World Runs on Bad Software
bkeepers
PRO
72
12k
BBQ
matthewcrist
89
10k
Building an army of robots
kneath
306
46k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
28
3.6k
The Art of Programming - Codeland 2020
erikaheidi
57
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