Slide 1
Slide 1 text
Kanon
#TSKaigi 2025
Type Challengesに新しい問題を追加して
Type ChallengesのMaintainerになった話
ysknsid25
ysknsid25.bsky.social
Slide 2
Slide 2 text
2
Type Challengesとは
Slide 3
Slide 3 text
3
TypeScriptの型パズル集
Type Challengesとは
Slide 4
Slide 4 text
4
anyで定義された型を適切に定義する
Type Challengesとは
Slide 5
Slide 5 text
このLTのゴール
5
帰ったらType Challenges解いてみよう
と思ってもらうこと
初心者編
Slide 6
Slide 6 text
このLTのゴール
6
帰ったらType Challenges(他のOSSでも)に
コントリビュートしてみよう
と思ってもらうこと
中・上級者編
Slide 7
Slide 7 text
7
Type Challengesをやる理由
初心者編
Slide 8
Slide 8 text
こういう悩みを持ってる人にやってみてほしい
8
● ドキュメントとか参考書を読み込んだのに、全然型システムを使いこなせて
る気がしない 😭
● この辺のキーワードに馴染みがない
○ Inferring Within Conditional Types
○ Conditional Types
○ Template Literal Types
○ Indexed Access Types
○ keyof Type Operator
初心者編
Slide 9
Slide 9 text
9
TypeScriptのいい教材はたくさんある
初心者編
Slide 10
Slide 10 text
10
公式ドキュメントも読む、読む、読む
初心者編
Slide 11
Slide 11 text
11
よっしゃTSの型システムを使いこなすぞ !!!!!!!!
てんぷれーとりてらる？こんでぃしょなるたいぷ？なんぼのもんじゃい
初心者編
Slide 12
Slide 12 text
12
さーて いい感じに型を書き換えるOSSコントリビュートしていくか
初心者編
Slide 13
Slide 13 text
13
…
Slide 14
Slide 14 text
14
… …
Slide 15
Slide 15 text
15
… … …
Slide 16
Slide 16 text
16
ワイ「全然 書けねえじゃん」
？？？「いや、申し訳ございません」
これの為だけにわざわざ十三行った
Slide 17
Slide 17 text
17
わかる と できる は違う
いろんなところで言われてる話だけど
初心者編
Slide 18
Slide 18 text
18
Type Challengesってのがあるらしい
やってみるか...
初心者編
Slide 19
Slide 19 text
19
全問解いたれ
● 結論: 全部解く必要はないと思う
○ hardからは型システムで計算とかし始める
○ 「すごいけど実戦でいつ使うんそれ」な問題が大半
○ mediumまでを3周くらいすれば実戦でも勝手に手が動くようになる
○ その頃にはOSSライブラリの型定義とかも難なく「読める、読めるぞぉ」となる(と思う)
● 「Type Challengesは全問解く意味はない」という意見が本当か確かめるためにも解いた
○ 自分もそれを言うためには全部解く必要があると思ったから
初心者編
Slide 20
Slide 20 text
20
全問解いたれ
● 結論: 全部解く必要はないと思う
○ hardからは型システムで計算とかし始める
○ 「すごいけど実戦でいつ使うんそれ」な問題が大半
○ mediumまでを3周くらいすれば実戦でも勝手に手が動くようになる
○ その頃にはOSSライブラリの型定義とかも難なく「読める、読めるぞぉ」となる(と思う)
● 「Type Challengesは全問解く意味はない」という意見が本当か確かめるためにも解いた
○ 自分もそれを言うためには全部解く必要があると思ったから
作者のAnthonyさん曰く
「mediumくらいまで解ければ普通にすごい」
って一昨日のスピーカーディナーで言ってた
初心者編
Slide 21
Slide 21 text
21
全通 + mediumまでを2周して解説本を書いた
初心者編
Slide 22
Slide 22 text
22
そんなある日
初心者編
Slide 23
Slide 23 text
23
これ問題作れるんじゃね？
PR作成、っと…
初心者編
Slide 24
Slide 24 text
24
🎉
Slide 25
Slide 25 text
25
このへんで 量が質に転化 してきたこと を実感した
手がするする動いて他の OSSにもコントリビュートできるようになってきた
中・上級者編
Slide 26
Slide 26 text
26
追加した問題
中・上級者編
Slide 27
Slide 27 text
27
IsAlphabet
中・上級者編
Slide 28
Slide 28 text
28
IsAlphabet
type IsAlphabet = any
type cases = [
Expect, true>>,
Expect, true>>,
Expect, false>>,
Expect, false>>,
Expect, false>>,
Expect, false>>
]
あとで解きたい人はここから
中・上級者編
Slide 29
Slide 29 text
29
解答例
Slide 30
Slide 30 text
30
IsAlphabet
解答例
type IsAlphabet
= Uppercase extends Lowercase ? false : true;
受け取ったSが大文字にしても小文字にしても同じものはAlphabetでない
● “A” と “a”
● “!”, “😂”, “9”
Slide 31
Slide 31 text
31
後日談
中・上級者編
Slide 32
Slide 32 text
32
Type ChallengesのMaintainerになった 🎉
中・上級者編
Slide 33
Slide 33 text
33
Maintainerになった経緯
中・上級者編
● Type Challengesでレベルを上げたあとはUnJSにたくさんコントリビュートしてた
● そこでAnthonyさんに何度かレビューしてもらう機会があった
○ それこそ、ぶっ壊れてたlinterの設定修正とか
● その後blueskyで相互フォローになりちょこちょこ話すことがあった
● 一昨日のスピーカーディナーで
”はじめまして”して、Type Challegesの話題になった
● 自分が書いたZenn Bookを見てもらったところ、「メンテナーやってみる？」とお誘いをいただく
というジョブズもびっくりな
”Connect the dots”確変イベントが発生した
当初このLTは問題追加したところで終わりだった
Slide 34
Slide 34 text
34
まとめ
Slide 35
Slide 35 text
35
まとめ
● いい教材(インプット材料 )を読んで、 Type Challengesのmediumまでを3
周くらいする と学習効果が高そう
○ 型システム周りを手を止めずにコーディングできるようになってくる
○ OSSのライブラリのコードも「読める、読めるぞぉ」になる
○ 突然新しい問題を思いつくようになる
● 量が質に転化する
● Type Challengesに限らずOSSに貢献するといいことがある (かもしれない )
● 自分が会ってみたい人がいる場所があれば、是非会いに行こう
Slide 36
Slide 36 text
36
食戟のソーマ 13巻 63~64p
出会うことだ
出会うことでしか 料理人は前に進めない
たった一人で皿に向き合っても それまでと変わらぬ自分が映るだけ
才波 城一郎
Slide 37
Slide 37 text
37
学び、繋がり、 ”型”を破ろう
Slide 38
Slide 38 text
Happy Hacking !!
水瀬いのり さんが推し の
@ysknsid25
@ysknsid25.bsky.social
Presented by
Kanon でした