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
TypeScriptで統一したアーキテクチャ
Search
iseki
May 11, 2024
Programming
1.7k
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
TypeScriptで統一したアーキテクチャ
iseki
May 11, 2024
More Decks by iseki
See All by iseki
TypeScriptで統一したアーキテクチャ
masayaiseki
1
88
QUICの安全性解析と証明
masayaiseki
0
31
WebRTCの安全性証明をしたい
masayaiseki
0
36
Precise study on a SOA-PSA based optical signal regenerator with numerical analysis
masayaiseki
0
50
Other Decks in Programming
See All in Programming
Laravel Boostに学ぶ、AIにPHPを書かせる技術 〜OSSの実装から蒸留するエージェント制御の王道〜
kentaroutakeda
3
530
全PRの83%がAIレビューだけでマージできるようになった開発組織はその後どうなったか
athug
0
380
Welcome to the "Parametricity" 🏙️ − Generic だけど Specific な世界 −
guvalif
PRO
1
180
分散システム、なんですぐ死んでしまうん?耐障害性を高めたいあなたのためのレジリエンスパターン入門
mshibuya
7
6.9k
AI時代のPHPer生存戦略 ~「言語、もうなんでもよくない?」に本気で向き合う~
vivion
0
170
言語を使う側から、作る側へ。 自作 Lisp で得た新たな気づき。
andpad
0
130
What's New in Android 2026
veronikapj
0
200
【やさしく解説 設計編・中級 #1】一つの車に、運転手は一人 ~ある倉庫システムの事例から~
panda728
PRO
0
190
act1-costs.pdf
sumedhbala
0
250
AI駆動開発を妨げる技術的負債の解消アプローチ / ai-refactoring-approach
minodriven
17
9.3k
yield再入門 #phpcon
o0h
PRO
0
740
SLOをサービス品質の共通言語にするために 取り組んできたこと
wakana0222
0
550
Featured
See All Featured
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
56k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
The Invisible Side of Design
smashingmag
301
52k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
190
Designing for Performance
lara
611
70k
Ten Tips & Tricks for a 🌱 transition
stuffmc
0
150
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
37
6.5k
AI Search: Where Are We & What Can We Do About It?
aleyda
0
7.7k
A Modern Web Designer's Workflow
chriscoyier
698
190k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
380
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.8k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
310
Transcript
EventHub All Rights Reserved. TypeScriptで統一したアーキテクチャ 2024年05月11日
EventHub All Rights Reserved. 自己紹介 • 井関 正也(@iskmsy) • 株式会社EventHub
取締役CTO • 2016年2月に代表の山本と一緒に EventHubを創業 • 開発組織、技術、プロダクトをみてます Chromium、Geckoのコミッターでした。 2
EventHub All Rights Reserved. EventHubとは 3 すべてのイベントを一気通貫でラクラク管理 成果を最大化するNO.1イベントプラットフォーム※ ※ 日本マーケティングリサーチ機構調べ「オンラインイベント」に関する競合調査(2021年8月期)
EventHubには、イベント開催に必要なあらゆる機能が揃っ ています。優れた操作性に加え、様々な形式のイベントに 利用できるため、多くの企業・団体様に選ばれています。 • 参加申込から当日開催、開催後アンケートまで対応 • オンライン、オフライン、ハイブリッド形式全てのイベン トタイプで利用可能 • ウェビナー・カンファレンスなどを中心に、BtoBイベント の開催実績は1000件以上
EventHub All Rights Reserved. 今日お話すること 少人数のエンジニアからスタートしたEventHubでどういった 理由で選定した技術なのかをお話します 4
EventHub All Rights Reserved. 技術選定の判断軸 5 組織 技術 製品 市場に受け入れられる製品であり続けるために、技術と組織を変化させていく
EventHub All Rights Reserved. 製品-フェーズによって求められる要件 6 PSF(Problem Solution Fit)到達前 顧客課題の発見・解決策の模索。できるだけコードは書かずに検証できるのが理想。
PMF(Product Market Fit) 到達前 最適な顧客体験・プランの構築。将来の拡張性を考慮しつつ個人あたりの開発効率を向上さ せていく。 PMF(Product Market Fit)到達後 更なる顧客拡大のために組織も拡大していきたい。個人あたりの開発効率も維持しつつ組織 拡大させていく。 1 2 3
EventHub All Rights Reserved. 組織-開発スタイル 7 • EventHubは、スクラムによる開発を推進しており、 フルサイクルを前提としています •
一部のスペシャリストを除いて、エンジニアは原則、 設計から開発・テスト、QA、リリース、O&M、 サポートの全ての工程に携わります Design Develop QA Deploy O&M Support Fullcycle Developer
EventHub All Rights Reserved. 技術スタック 8 フロントエンド Typescript、React、styled-component バックエンド Typescript、Node.js、NestJS、TypeORM
データベース MySQL インフラ AWS(Fargate、Elastic Beanstalk) CI CircleCI モニタリング Sentry、AWS CloudWatch
EventHub All Rights Reserved. 選定技術 9 TypeScriptでの統一 フロントエンド・バックエンドを同一リポジトリで管理 NestJSの採用 1
2 3 • 認知負荷を低減できる • コード共通化できる • モジュールを横断した編集がしやすい • 環境構築やビルドなどのプロセスを統一しやすい • 実装方法の指針がある • TypeScript との親和性
EventHub All Rights Reserved. TypeScriptでの統一 10 選定理由 • 言語スイッチによる認知負荷の低減できる •
フロントエンド・バックエンドでコードを共通化できる デメリット • プロダクト要件に合わせたバックエンドの選定ができない。
EventHub All Rights Reserved. Validationの統一 11 • class-validatorを利用して、フロントエンド・バックエンドにおいて処理を統一 ◦ 共通のクラスファイルを作成
◦ フロントエンドでリクエストする際にvalidationを実行 ◦ バックエンドでリクエスト内容をvalidationを実行 共通クラス NestJSでのバリデーション フロントエンドでのバリデーション
EventHub All Rights Reserved. 選定技術 12 TypeScriptでの統一 フロントエンド・バックエンドを同一リポジトリで管理 NestJSの採用 1
2 3 • 認知負荷を低減できる • コード共通化できる • モジュールを横断した編集がしやすい • 環境構築やビルドなどのプロセスを統一しやすい • 実装方法の指針がある • TypeScript との親和性
EventHub All Rights Reserved. エンジニア積極採用中です!!! 13 https://jobs.eventhub.co.jp/ • Webエンジニア •
セキュリティエンジニア • QAエンジニア • インフラエンジニア • コーポレートエンジニア • BizOps