TypeScript Developers Meetup 〜フロントからバックまで TypeScript〜 イベントレポート

TypeScript Developers Meetup ヘッダー画像

こんにちは!ケップルで Creator Success *1を推進している池浦です。

2024年5月8日にケップル主催のもと、コミューン株式会社、X Mile株式会社、株式会社Helpfeel (以下、コミューン、 X Mile、 Helpfeel )の4社でオフラインイベント「TypeScript Developers Meetup〜フロントからバックまで TypeScript〜」を開催しました。

今回のイベントではバックエンド・フロントエンドともに TypeScript で開発する事例や知見をライトニングトーク形式で各社からお話ししました。

本記事では、イベントの様子や弊社から登壇したメンバーの発表について紹介したいと思います。

イベントの概要

ここ数年で TypeScript の活躍の場は広がり続けており、現在ではフロントエンドのみならずバックエンドやインフラ、ネイティブアプリまで構築することができます。

ブラウザ上で動的な表現を行うために生まれた言語「JavaScript」のスーパーセットという立場であることからフロントエンドでの利用をイメージしやすいかと思いますが、 Node.js や React Native など JavaScript の活用が広がるにつれて TypeScript の活躍の場も広がっています。

昨今では、フロントエンド・バックエンドのみならずインフラまで TypeScript で製品を開発している企業が増えており、そういった企業が持つ知見を広く共有して、TypeScript を利用している方や TypeScript に興味を持っている方の気づきや学びに繋がることを目的として開催しました。

会場はコミューンさんの芝生!

本イベントの会場にはコミューンさんの芝生をお借りしました。コミューンさんでは全社会議などに使っているそうで、大きなスクリーンをリラックスして見られる最高の環境でした。私はあの空間で映画を見たいです。

コミューンさんの芝生

コミューンさんの芝生

雛壇も合わせると 40 ~ 50 人は収容できる広々空間で、イベントに参加していただいた方々もリラックスしてトークを聞いていただけたようです。

ケップルのLT発表

ケップルからはスタートアプデータベース「KEPPLE DB」の開発に関わっている芹田がタイトル「null と optional と undefined、TypeScript 統一による型の互換性」を発表しました。

芹田が登壇している様子

TypeScript では「データがない」状態の表現が null、optional、undefined の 3 種類あり、混乱を招いてます。

TypeScript 4.4 以降で undefined と optional を明確に区別できるようになり、状況が多少改善されましたが、利用するライブラリによってそれぞれの扱い方が異なるシーンはまだまだあり、結局のところは互いの妥協点を探る戦いになっています。

これは言語間でも同様で、TypeScript で作られるフロントエンドと他の言語で作られるバックエンドを繋ぎこむときにバックエンドで利用している言語の「データがない」状態に合わせてフロントエンド側を実装する必要があります。

こういった背景からバックエンドも TypeScript を利用することによって「データがない」状態の扱いを統一し、型定義や型ガードのみならず Linter の設定やテストの流儀を巧みに使い回してあらゆるスイッチングコストを減らしたというのが今回の発表の趣旨でした。

ケップルでは「Product First」というプロダクトの価値にフォーカスする理念を大事にしており、 TypeScript の統一によって開発コストを減らし、よりプロダクトの価値向上に繋がる本質的な開発に取り組めているように感じられます。

コミューン、X Mile、 Helpfeel の LT 発表

各社が抱えている課題や技術的な取り組みも紹介します!

角田さんが登壇している様子

角田さんが登壇している様子

コミューン Software Engineer 角田 武蔵 さん: 「Compiler APIを利用してTypeScriptのAPI型定義からOpenAPI.jsonを作成する」

複数チーム間のデータ連携に OpenAPI.json を利用し、その JSON ファイルを API 型定義から出力するという趣旨の発表でした。

丁寧にドキュメンテーションしていても気づけば認識齟齬が発生するデータ定義問題にピリオドを打つ取り組みです。

 

コミューンさんのイベントレポートはこちらからご覧ください!

tech.commune.co.jp

 

蝦名さんが登壇している様子

蝦名さんが登壇している様子

X Mile 開発責任者 蝦名 潤 さん: 「TypeScriptでフルスタックな開発体験をとことん追求してみる」

フロントエンドを Next.js、バックエンドを AWS CDK(Lambda によるサーバーレスアーキテクチャ)という構成にすることにより、アプリケーション全体( Next.js + CDK )で関心ごとを整理できる旨みやスイッチングコストの低下が発表の趣旨でした。

モノレポと相性良さそうだな〜と聞いていたらモノレポに寄せる未来を描いていて、以心伝心でした。

 

秦さんが登壇している様子

秦さんが登壇している様子

Helpfeel 秦 友幸 さん: 「TypeScriptに頼りながら作るバリデーター」

外部の API からデータを取得するときのバリデーションのノウハウ、そしてバリデーションライブラリ zod の導入に関する社内での歴史と実例を発表していただきました。

最近では zod をよく聞くようになり、バリデーションライブラリのデファクトスタンダードになりつつある気配を感じます。

秦さんの note はこちら

最後に

今回はイベントページを公開してから数日で枠が埋まるほどの盛況で、改めて TypeScript の人気と熱量を感じられる機会となりました。

弊社では引き続き TypeScript を幅広い領域で活用していきますので、 TypeScript を使っている人・これから使いたい人は気軽にお話ししましょう!

*1: クリエイターの就業体験を向上させるロール。詳しくはこちらの記事をお読みください!