AIに安心して任せるためにTypeScriptで一意な型を作ろう

LayerX bet ai day 7days LTのday 4「あえてのNot AI」の発表資料です

Transcript

1. AIに安心して任せるために TypeScriptで一意な型を作ろう バクラク事業部 勤怠開発グループ yata YATA, Yuki DAY04 topic あえてのnot AI Speaker
2. Speaker バクラク勤怠 ソフトウェアエンジニア • 2025年 新卒入社 • スマブラとヨルシカが好きです yata(@0e2b3c) YATA, Yuki
3. © LayerX Inc. 技術組織としての分岐点 • ⽂字列リテラルの⼀括変換をAIに任せるために、 • TypeScriptの型でガードレールを作ったけど、 • 実⾏速度の問題でうまく⾏かなかった！ ３⾏サマリ AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
4. © LayerX Inc. 技術組織としての分岐点 AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう • バクラク勤怠ではGraphQLを使って開発を⾏なっている • 最近graphql-codegenでenumがas constオブジェクトとして⽣成される様になった きっかけ
5. © LayerX Inc. 技術組織としての分岐点 AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう • 私「だったらコードベース上の⽂字列リテラルも全部変換したい...!」 • でも数えてみたら2000件くらい⽂字列リテラルがある... • ⼿動で変換するのは時間がかかりすぎる... • AIに全任せすると変換ミスに気付けない... きっかけ
6. © LayerX Inc. 技術組織としての分岐点 ガードレールを作る • AIが変換を間違えても気付ける様にすればいい ◦ 修正箇所も明確 ◦ 安⼼してリリースできる • じゃあカスタムlintとか作る？ ◦ エラーが出る様になれば安⼼ じゃあどうする？ AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
7. © LayerX Inc. 技術組織としての分岐点 • どのオブジェクト問題 ◦ “AMY”←これどのオブジェクトの”AMY”？PersonType.AMY？SongType.Amy？ • 野良かも問題 ◦ “AMY”←これ野良の⽂字列リテラル？それともGraphQL由来のプロパティ？ 少なくとも⾃分ではこのアプローチは無理だった😢 カスタムlintじゃ無理そう AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
8. © LayerX Inc. 他に⼿はないのか... AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
9. © LayerX Inc. 技術組織としての分岐点 • どのオブジェクト問題：型エラーで気付ける！ ◦ 例：PersonType.Amyとすべき”AMY”をSongType.Amyに変換してしまう • 野良かも問題：型エラーで気付ける！ ◦ 例：GraphQLと関係ない”AMY”をSongType.Amyに変換してしまう 全ての文字列に一意な型を付ければいいんじゃない？ AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
10. © LayerX Inc. 技術組織としての分岐点 • typescriptの解析や修正を⾏うことができるツールキット • 置換部分まで⾏うのはコストが⼤きそうだったので ⼀旦型を付けてエラーを出させるところまでをやってみる ts-morphで型付けやってみた AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
11. © LayerX Inc. 技術組織としての分岐点 • graphql.tsの中からas constを⾛査して、全ての⽂字列に型アサーションする ◦ • 型はstringと{ __${オブジェクト名}_${値}__: unknown }の直⾏型 ◦ できるだけ嘘が少ないbranded typeを使う様にした ◦ 変数名と値の組み合わせが⼀意なことは保証されるのでsymbolを使うのはサボりました ◦ ⽂字列リテラル型ではなくstring型にした理由は省略 ts-morphで型付けやってみた AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
12. © LayerX Inc. その結果 AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
13. © LayerX Inc. うまくいかなかった！ AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
14. © LayerX Inc. 技術組織としての分岐点 • 変換の精度はかなり⾼くなったし、ミスしていても気付ける様になった • でも時間がかかりすぎて無理だった ◦ 10分かけて３ファイルくらいしか処理できない ◦ 2,30件くらい処理した段階で「完了です！」とか⾔ってくる ◦ Claude Codeにやらせたのが間違いだったかもしれないが、他のAIだと従量課 ⾦になってしまう 結果 AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
15. © LayerX Inc. 技術組織としての分岐点 • 変換部分をAIにやらせるのは悪くないアプローチだったと思う ◦ AIの「よしなに⼒」が活かせる場⾯ ◦ ts-morphだと成功判定は型エラーを⾒るしかないが、 ↓のコードだと4⾏に渡って型エラーが出るので２つ同時に修正されな いと成功判定にならない 考察 AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
16. © LayerX Inc. 技術組織としての分岐点 • roo codeなどの厳密にサブタスクを切るAI Agentにやらせてみる • 全てをNot AIで進めるのであれば、⼀旦決めつけで全て変換してみて最後 に評価する様な⽅法を取ってみると良いかも 改善点 AIに安⼼して任せるためにTypeScriptで⼀意な型を作ろう
17. AIに安心して任せるために TypeScriptで一意な型を作ろう バクラク事業部 勤怠開発グループ yata YATA, Yuki DAY04 topic あえてのnot AI Speaker
18. AIに安心して任せるために TypeScriptで一意な型を作ろう バクラク事業部 勤怠開発グループ yata YATA, Yuki DAY04 topic あえてのnot AI Speaker
19. TypeScriptで一意な型を作ったけど AIには任せられなかった 😭 バクラク事業部 勤怠開発グループ yata YATA, Yuki DAY04 topic あえてのnot AI Speaker
20. 2025年8月1日 13:00−18:30 オンライン配信 https://layerx.co.jp/events/2025/bet-ai-day ご登録はこちら