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
960
Clean Architecture by TypeScript & NestJS
ryounasso
July 10, 2024
Tweet
Share
More Decks by ryounasso
See All by ryounasso
明日から始めるリファクタリング
ryounasso
0
110
駆け足で Google から学ぶテスト設計の指針
ryounasso
0
110
React inside basics: learn from “build own react"
ryounasso
0
140
抽象データ型について学んだ
ryounasso
0
260
開発効率向上のためのリファクタリングの一歩目の選択肢 ~コード分割~ / JJUG CCC 2024 Fall
ryounasso
0
3.1k
Fast API を用いた Web API の開発
ryounasso
0
540
テストゼロの個人開発プロジェクトにテストを導入した話
ryounasso
0
410
簡易 DI コンテナを作って DI コンテナを知る
ryounasso
1
1.3k
TypeScript_コンパイラの内側に片足を入れる
ryounasso
3
790
Other Decks in Programming
See All in Programming
高度なUI/UXこそHotwireで作ろう Kaigi on Rails 2025
naofumi
4
3.3k
Go言語の特性を活かした公式MCP SDKの設計
hond0413
1
120
そのpreloadは必要?見過ごされたpreloadが技術的負債として爆発した日
mugitti9
2
2.9k
メモリ不足との戦い〜大量データを扱うアプリでの実践例〜
kwzr
1
780
overlayPreferenceValue で実現する ピュア SwiftUI な AdMob ネイティブ広告
uhucream
0
100
CSC305 Lecture 02
javiergs
PRO
1
260
複雑化したリポジトリをなんとかした話 pipenvからuvによるモノレポ構成への移行
satoshi256kbyte
1
750
NetworkXとGNNで学ぶグラフデータ分析入門〜複雑な関係性を解き明かすPythonの力〜
mhrtech
3
980
止められない医療アプリ、そっと Swift 6 へ
medley
1
110
クラシルを支える技術と組織
rakutek
0
190
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
500
AI Coding Meetup #3 - 導入セッション / ai-coding-meetup-3
izumin5210
0
390
Featured
See All Featured
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
A Modern Web Designer's Workflow
chriscoyier
697
190k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
4 Signs Your Business is Dying
shpigford
185
22k
Become a Pro
speakerdeck
PRO
29
5.5k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6.1k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.7k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
Building Adaptive Systems
keathley
43
2.8k
Code Reviewing Like a Champion
maltzj
525
40k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Code Review Best Practice
trishagee
72
19k
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