こんにちは。物流業界の価値最大化をミッションに掲げるアセンド株式会社でエンジニアをしている宮津(@kenshiro382)です。
本記事は2023/4/27に行われたエンジニアミートアップ、「全部見せます！アセンドの Full TypeScript アーキテクチャ大解剖」のイベントレポートです。
アセンド・エンジニアミートアップの開催経緯
アセンドでは月に１度エンジニアミートアップを開催しています。特に弊社は学びを重視するカルチャーを持っており、せっかくなので参加者の方々に良い情報と議論を通した深い学びが得られるミートアップを目指しています。また、CTOが作った美味しい料理も楽しみつつ、トータルで良い時間を過ごせることを目指しています。
今回のミートアップでは Full TypeScript アーキテクチャをテーマとしました。
アセンドではフロントエンド, バックエンド, k8sのmanifest生成, IaC(CDK), データパイプラインのいずれもTypeScriptで開発しています。
フロントエンド・バックエンドの両方がTypeScript、といういわゆる「サーバーサイドTypeScript」はここ数年で広まっています。一方で、ここまで徹底してTypeScript一色にしている開発についてはまだ多くありません。そこでアセンドでの取り組みを紹介すると共に、ディスカッションをして理解を深める場を作ることにしました。
ミートアップのお品書き
深いディスカッションがされる場を作るためにまずは自身から開示をしていくということで、はじめにアセンドにおける取り組みを紹介しました。その後に参加者の各社さんではどのように言語・アーキテクチャ選定をしているのかに加えて、具体的な推しポイントや辛みポイントを共有してもらいつつディスカッションしました。
下記が実際のアジェンダ・お品書きとなります。
- かた焼きそばを食べつつ歓談＆自己紹介
- 会社・プロダクトの特性紹介
- アセンドでのFullTypeScriptの取り組み紹介
- 参加各社の技術構成シートを利用してのディスカッション
- 記念撮影・解散
"かた"焼きそばでおもてなし
アセンドでのFullTypeScriptの取り組み紹介
アセンドでFullTypeScriptアーキテクチャを利用して感じるメリット、以下の3点を中心にご紹介しました。
- モジュールの共有
- フロントエンド/バックエンド間のコンテキストスイッチ負荷の軽減
- エンジニアが不得意な領域の開発へ臨む際の学習コストの削減
参考）
しかし、それぞれそのメリットを享受するには気を付けなければならないポイントがあり、乗り越えるための工夫が必要です。当日はクローズな場で詳細にお伝えしましたが、本記事でも簡単に紹介します。
1. モジュールの共有
- フロントエンドとバックエンドで言語が異なる場合、同一のドメインロジックを二重定義したり、バックエンドにロジックを寄せて、必ずバックエンド経由でそのロジックを呼び出す、といった工夫が求められます。
- TypeScriptに言語を統一し、モジュールを共有することで、上記の工夫は不要となります。
- ただし、ユーザーが触るデータと、DBに永続化すべきデータの間にはあるべき姿に乖離があることが多いため、ここはあえて共通化せず、フロントエンドとバックエンドでそれぞれ固有のデータ型を持つようにしています。
アセンドのアプリアーキテクチャ概略図
2. フロントエンド/バックエンド間のコンテキストスイッチコストの軽減
- アセンドでは「フルサイクルエンジニア」の開発スタイルを採用しているため、一人のエンジニアがフロントエンドとバックエンドを行き来しながら開発を行います。
- 言語がTypeScriptに統一されていることによって、コンテキストスイッチコストを小さくして開発することができます。
- 会の中では、フロントエンドとバックエンドのAPIのやり取りを具体例として、実際のコードも交えて紹介しました。
3. エンジニアが不得意な領域の開発へ臨む際の学習コストの削減
- アセンドではk8sのマニフェスト作成や、EKSクラスタ作成のIaCに関して、TypeScriptで開発を行っています。
- アプリケーションエンジニアがそれらの領域に手を伸ばすこともありますが、言語を統一することで、開発体験が大きく異なるアプリ/インフラ間も越境しやすくなります。
- 運用コストが問題視されるk8sのバージョンアップ作業を例として挙げると、ライブラリの変更に合わせた必要な改修を型システムが導いてくれるため、k8sのリリースノートを細かく追わずとも効率的にアップデートすることができています。
実際に開発した画面やコードを眺めながら紹介
各社の言語・アーキテクチャ選定とディスカッション
続いて発表形式からグループディスカッション形式に移行して各社の言語・アーキテクチャ選定について紹介し議論をしました。今回も皆さんが話しやすいように技術構成シートを用意して記入してもらった上でディスカッションをしてもらいました。
技術構成シート (アセンドメンバ記入)
特に、各社の言語選定やアーキテクチャにおける推しポイントや辛みポイントを共有し、結果として開発生産性にどう影響しているかを中心に議論しました。
- 「うちの会社ではここが辛いんですけど、皆さんのところはどうされてるんですか？」
- 「自社の戦略として、好きな言語で開発することを優先していて...」
といった、血の通った悩みや会社の思想について共有いただきました。
アセンドとしても、会を通して以下のような学びがありました。
- アセンドは開発スタイルとしてフルサイクルエンジニアを採用している前提があるからこそ、FullTypescriptによるメリットを強く享受できている。
- 例えば、フロントエンドとバックエンドの担当者が分かれていることによるコミュニケーションコストの悩みは、各参加者が共通して抱えていた。FullTypescriptでも担当者が異なった場合は問題が生じ得る。
- ただし、アセンドでは1機能に閉じて1人格で開発を進めるからこそ、機能ごとのコード品質にばらつきが生じている。
終わりに
今回はミートアップを通して、アセンドにおけるFullTypeScriptアーキテクチャの取り組みについて紹介しました。
私たちとしては、他の会社でのサーバーサイドTypeScriptの取り組みの実情を伺い知れた良い機会となりました。
参加者の方からも、以下のように嬉しい反響もいただけました。
- 自社で採用しているフロントからバックまでTypeScriptで統一したアーキテクチャについて、利点を言語化して認知する良い機会になった
- フロントエンドとバックエンドのそれぞれのチーム間で発生したバグの原因をめぐる諍いで悩んでいたが、一つの解決策を見ることができた
双方向に学びが多い会にできたようです！嬉しいです！
最後に記念撮影！
アセンドでは毎月オフラインでのエンジニアミートアップイベントを開催しております。
次回、5/24(水)は アセンドがこだわり続けている開発生産性の取り組みについて大公開します。
引き続き、深い学びが得られる会にしてまいりますので、ご興味のある方は是非ご参加ください！
Discussion