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
0
640
TypeScriptで統一したアーキテクチャ
iseki
May 11, 2024
Tweet
Share
More Decks by iseki
See All by iseki
TypeScriptで統一したアーキテクチャ
masayaiseki
1
75
QUICの安全性解析と証明
masayaiseki
0
20
WebRTCの安全性証明をしたい
masayaiseki
0
22
Precise study on a SOA-PSA based optical signal regenerator with numerical analysis
masayaiseki
0
24
Other Decks in Programming
See All in Programming
CSC305 Lecture 26
javiergs
PRO
0
140
見えないメモリを観測する: PHP 8.4 `pg_result_memory_size()` とSQL結果のメモリ管理
kentaroutakeda
0
130
モバイルアプリにおける自動テストの導入戦略
ostk0069
0
110
Semantic Kernelのネイティブプラグインで知識拡張をしてみる
tomokusaba
0
180
ゆるやかにgolangci-lintのルールを強くする / Kyoto.go #56
utgwkk
1
360
DevFest Tokyo 2025 - Flutter のアプリアーキテクチャ現在地点
wasabeef
5
900
Effective Signals in Angular 19+: Rules and Helpers @ngbe2024
manfredsteyer
PRO
0
130
SymfonyCon Vienna 2025: Twig, still relevant in 2025?
fabpot
3
1.2k
The Efficiency Paradox and How to Save Yourself and the World
hollycummins
1
440
Keeping it Ruby: Why Your Product Needs a Ruby SDK - RubyWorld 2024
envek
0
180
競技プログラミングへのお誘い@阪大BOOSTセミナー
kotamanegi
0
350
StarlingMonkeyを触ってみた話 - 2024冬
syumai
3
270
Featured
See All Featured
GraphQLとの向き合い方2022年版
quramy
44
13k
Adopting Sorbet at Scale
ufuk
73
9.1k
The Cost Of JavaScript in 2023
addyosmani
45
7k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
191
16k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
2
290
4 Signs Your Business is Dying
shpigford
181
21k
How STYLIGHT went responsive
nonsquared
95
5.2k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Building an army of robots
kneath
302
44k
Making the Leap to Tech Lead
cromwellryan
133
9k
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