Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Clean Architecture by TypeScript & NestJS
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
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
300
駆け足で Google から学ぶテスト設計の指針
ryounasso
0
260
React inside basics: learn from “build own react"
ryounasso
0
250
抽象データ型について学んだ
ryounasso
0
500
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
4.4k
Fast API を用いた Web API の開発
ryounasso
1
650
テストゼロの個人開発プロジェクトにテストを導入した話
ryounasso
0
530
簡易 DI コンテナを作って DI コンテナを知る
ryounasso
1
1.5k
TypeScript_コンパイラの内側に片足を入れる
ryounasso
3
1.1k
Other Decks in Programming
See All in Programming
Railsのためのパスキー実践入門 〜マルチテナントSaaSでの意思決定〜
utakaha
3
770
AI時代のコードレビューは人に向けるな、仕組みに向けろ
texmeijin
5
3.7k
月間100万人のサービス刷新で、 技術選定をHonoに振り切った話
yutobara
8
6.7k
Agentic Software Factoryに、すごく賢いIF文を。 / super smart IF statement into the Agentic Software Factory.
rkaga
8
2.3k
ActionController meets Protocol Buffers
sorah
0
560
phperだってパンチカードでコーディングしたい
o0h
PRO
0
350
Verilogで学ぶCPU自作入門
uyuki234
8
4.2k
作れる、でも消せるか?──安全に「枯らして消す」機能削除術 / Drain, Then Delete
chobishiba
2
820
sbt 2.0: takeoff
eed3si9n
0
160
IBM Bob でAI駆動開発『QC-Playbook』
ichirokano2
0
110
Findy - エンジニア向け会社紹介/Findy Company Deck
findyinc
6
400k
ジョジョの世界をXRで再現する
mofurune
0
170
Featured
See All Featured
Become a Pro
speakerdeck
PRO
31
6.3k
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
570
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
790
Faster Mobile Websites
deanohume
310
32k
Technical Leadership for Architectural Decision Making
baasie
3
600
Paper Plane (Part 1)
katiecoart
PRO
2
12k
Reflections from 52 weeks, 52 projects
jeffersonlam
356
22k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
74
43k
A better future with KSS
kneath
240
18k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
710
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
370
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