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
November 19, 2021
Technology
1
73
TypeScriptで統一したアーキテクチャ
https://increments.connpass.com/event/229358/
「次世代フロントエンドに向き合ったバックエンドアーキテクチャの話」での発表資料です。
iseki
November 19, 2021
Tweet
Share
More Decks by iseki
See All by iseki
TypeScriptで統一したアーキテクチャ
masayaiseki
0
460
QUICの安全性解析と証明
masayaiseki
0
18
WebRTCの安全性証明をしたい
masayaiseki
0
19
Precise study on a SOA-PSA based optical signal regenerator with numerical analysis
masayaiseki
0
24
Other Decks in Technology
See All in Technology
テストを楽に書きたい
tomorrowkey
2
240
とある事業会社にとっての Kaggler の魅力
hakubishin3
7
1.4k
UE5の雑多なテク
ryuichikawano
0
470
From naive to advanced RAG: the complete guide
glaforge
0
490
The road to green code (with Sonar)
bluehats
0
120
Qdrant を用いた検索改善施策の紹介 / Search Engineering Tech Talk 2024 Summer
visional_engineering_and_design
2
270
令和最新版 Perlコーディングガイド
anatofuz
5
4.2k
コード✕AIーソフトウェア開発者のための生成AI実践入門~
yuhattor
4
920
入社半年(合計1年)でGoogle Cloud 認定を全冠した秘訣🤫
risatube
1
260
Applied NLP with LLMs: Beyond Black-Box Monoliths
inesmontani
PRO
0
150
品質マネジメントで抑えておきたい2つのリスクを見分けて未来に備えよう #yapcjapan
makky_tyuyan
0
140
Vespaを利用したテクいベクトル検索
szdr
3
240
Featured
See All Featured
Unsuck your backbone
ammeep
668
57k
Fashionably flexible responsive web design (full day workshop)
malarkey
404
65k
Fireside Chat
paigeccino
32
3k
Mobile First: as difficult as doing things right
swwweet
222
8.9k
Visualization
eitanlees
143
15k
Agile that works and the tools we love
rasmusluckow
327
21k
4 Signs Your Business is Dying
shpigford
180
21k
Building Adaptive Systems
keathley
38
2.2k
Atom: Resistance is Futile
akmur
261
25k
Scaling GitHub
holman
458
140k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
13
1.7k
Debugging Ruby Performance
tmm1
73
12k
Transcript
EventHub All Rights Reserved. TypeScriptで統一したアーキテクチャ 2021年11月19日
EventHub All Rights Reserved. 自己紹介 • 井関 正也(@iskmsy) • 株式会社EventHub
取締役CTO • 2016年2月に代表の山本と一緒に EventHubを創業 • 開発組織、技術、プロダクトをみてます Chromium、Geckoのコミッターでした。 2
EventHub All Rights Reserved. 3 All-in-One Event Management Platform EventHubはデータを一元管理・分析する事により
イベントの成果を最大化するプラットフォームです オンライン・ハイブリッド・オフラインを問わず イベントの準備・開催・管理を効率化します
EventHub All Rights Reserved. メンバーの推移と沿革 2020年からの1年間で 11名から49名 に拡大しています。 4 2016
2017 2018 2019 2020 2021 新オフィス (神田) 会社設立 オンライン版 リリース EventHub リリース 資金調達 (Salesforce) 資金調達 (Sansan) 新オフィス (馬喰横山) 2名 2名 4名 6名 11名 49名
EventHub All Rights Reserved. 今日お話すること 少人数のエンジニアからスタートしたEventHubでどういった 理由で選定した技術なのかをお話します 5
EventHub All Rights Reserved. 技術選定の判断軸 6 組織 技術 製品 市場に受け入れられる製品であり続けるために、技術と組織を変化させていく
EventHub All Rights Reserved. 製品-フェーズによって求められる要件 7 PSF(Problem Solution Fit)到達前 顧客課題の発見・解決策の模索。できるだけコードは書かずに検証できるのが理想。
PMF(Product Market Fit) 到達前 最適な顧客体験・プランの構築。将来の拡張性を考慮しつつ個人あたりの開発効率を向上さ せていく。 PMF(Product Market Fit)到達後 更なる顧客拡大のために組織も拡大していきたい。個人あたりの開発効率も維持しつつ組織 拡大させていく。 1 2 3
EventHub All Rights Reserved. 製品-フェーズによって求められる要件 8 PSF(Problem Solution Fit)到達前 顧客課題の発見・解決策の模索。できるだけコードは書かずに検証できるのが理想。
PMF(Product Market Fit) 到達前 最適な顧客体験・プランの構築。将来の拡張性を考慮しつつ個人あたりの開発効率を向上さ せていく。 PMF(Product Market Fit)到達後 更なる顧客拡大のために組織も拡大していきたい。個人あたりの開発効率も維持しつつ組織 拡大させていく。 1 2 3
EventHub All Rights Reserved. 組織-開発スタイル 9 • EventHubは、スクラムによる開発を推進しており、 フルサイクルを前提としています •
一部のスペシャリストを除いて、エンジニアは原則、 設計から開発・テスト、QA、リリース、O&M、 サポートの全ての工程に携わります Design Develop QA Deploy O&M Support Fullcycle Developer
EventHub All Rights Reserved. 技術スタック 10 フロントエンド Typescript、React、styled-component バックエンド Typescript、Node.js、NestJS、TypeORM
データベース MySQL インフラ AWS(Fargate、Elastic Beanstalk) CI CircleCI モニタリング Sentry、AWS CloudWatch
EventHub All Rights Reserved. 選定技術 11 TypeScriptでの統一 フロントエンド・バックエンドを同一リポジトリで管理 NestJSの採用 1
2 3
EventHub All Rights Reserved. TypeScriptでの統一 12 選定理由 • 言語スイッチによる認知負荷の低減できる •
フロントエンド・バックエンドでコードを共通化できる デメリット • プロダクト要件に合わせたバックエンドの選定ができない。
EventHub All Rights Reserved. Validationの統一 13 • class-validatorを利用して、フロントエンド・バックエンドにおいて処理を統一 ◦ 共通のクラスファイルを作成
◦ フロントエンドでリクエストする際にvalidationを実行 ◦ バックエンドでリクエスト内容をvalidationを実行 共通クラス NestJSでのバリデーション フロントエンドでのバリデーション
EventHub All Rights Reserved. フロントエンド・バックエンドを同一リポジトリで管理 14 選定理由 • モジュールを横断した編集がしやすい(管理がしやすい) •
環境構築やビルドなどのプロセスを統一しやすい デメリット • コードベース・組織が大きくになるにつれて影響範囲が分かりづらくなる
EventHub All Rights Reserved. NestJSの採用 15 選定理由 • 実装方法の指針がある •
TypeScript との親和性が高い デメリット • 学習コストがかかる
EventHub All Rights Reserved. 選定技術(まとめ) 16 TypeScriptでの統一 フロントエンド・バックエンドを同一リポジトリで管理 NestJSの採用 1
2 3 • 認知負荷を低減できる • コード共通化できる • モジュールを横断した編集がしやすい • 環境構築やビルドなどのプロセスを統一しやすい • 実装方法の指針がある • TypeScript との親和性
EventHub All Rights Reserved. エンジニア積極採用中です!!! 17 https://jobs.eventhub.co.jp/ • Webエンジニア •
セキュリティエンジニア • QAエンジニア • インフラエンジニア • エンジニアリングマネージャ • コーポレートエンジニア