Slide 1

Slide 1 text

TypeScript開発を効率化させるための おすすめ型ライブラリ3選             2023.03.02 MixLeap Live Study #70 - 教えて!みんなのTypeScript

Slide 2

Slide 2 text

©︎ 2023 Gemcook, Inc. 自己紹介 名前 経歴 昨年8月から、株式会社Gemcookにインターンとして
 ジョイン 。React, TypeScriptを使ったフロントエンド
 開発に従事。 関西学院大学 法学部 政治学科 4年 (今年4月~) 井上 倖太朗 出身 東京都府中市出身

Slide 3

Slide 3 text

型ライブラリを紹介しようと思った背景 ・単純に記述量も増える。 ・型による安全性は担保しつつ、型定義はなるべく最小限の労力で行なってメインとなる実装に  より多く時間を使いたいというのが個人的な思い。 ・実装に加えて、型も同時に定義していかなくてはいけないので、考えることが増える。 TypeScriptのような静的型付け言語では、多くの利点がある一方で、 静的型付けにはいくつか「しんどいな」と感じる側面もあると思っている。

Slide 4

Slide 4 text

ライブラリを導入して 少しでも開発効率を高められないだろうか?

Slide 5

Slide 5 text

便利な型ライブラリ3選 ・ts-essentials ・ts-toolbelt ・type-fest GithubのStar数: 5.4k (2023.2.26日時点) GithubのStar数: 10.2k (2023.2.26日時点) GithubのStar数: 2.9k (2023.2.26日時点) 何が嬉しい? 具体的に何ができる? (一部紹介) ・TypeScriptの標準機能にはない型定義を提供しており、より柔軟な開発が可能 (ユーティリティタイプでは足りないようなケースに対応) ・型を一から自作する必要がないため、工数削減できる。 Ý オブジェクトの一部のプロパティのみ省略可能にする。 Ý スネークケースやケバブケースの命名規則をキャメルケースに変換する。 Ý ネストされたオブジェクトのプロパティを readonly (読み取り専用) にする。

Slide 6

Slide 6 text

ts-toolbeltのコード例を紹介 方法3 (ts-toolbeltならスッキリ!) ・ts-toolbeltでオブジェクトの一部のプロパティのみ省略可能にするコード例です! オブジェクトの一部プロパティをオプショナルにして定義したい。 方法2 (んー。なんか冗長) 方法1 (んー。なんかわかりづらい)

Slide 7

Slide 7 text

まとめ ©︎ 2023 Gemcook, Inc. a ライブラリにはさまざまな型ユーティリティが用意
 されていて、複雑で高度な型の定義も簡単に実現する
 ことが可能です。 a 長期的に見て開発効率を重視するのであれば、
 ライブラリを検討してみるのもありだと思います。
 (導入コストが低い+メンテナンスコストも減る) a TypeScriptを使った開発を効率化させる
 型ライブラリの紹介をしました。

Slide 8

Slide 8 text

ご静聴ありがとうございました