TSKaigi ZOZOブース クイズの裏側

2026/07/29 開催「LLMアプリケーション開発のリアル — オブザーバビリティと品質評価の実践」の登壇資料です。

https://findy-tools.connpass.com/event/400106/

株式会社ZOZO
基幹システム本部
リプレイス推進部 リプレイス推進ブロック
テックリード 冨川 宗太郎

#tskaigi_after_talk_m3_freee

Transcript

1. TSKaigi ZOZOブース クイズの裏側 株式会社ZOZO 基幹システム本部 リプレイス推進部 リプレイス推進ブロック テックリード 冨川 宗太郎 Copyright © ZOZO, Inc. 1
2. 株式会社ZOZO 基幹システム本部 リプレイス推進部 リプレイス推進ブロック テックリード 冨川 宗太郎 ssssota / Xは@ssssotaro いろんなフロントエンドカンファレンスに出没 TSKaigi 2026は以下の内容で登壇 「ReactとSvelteのその先、Ripple-TS」 登壇後からRipple/TSRXが変更祭りで汗 © ZOZO, Inc. 2
3. https://zozo.jp/ • ファッションEC • 1,700以上のショップ、11,000以上のブランドの取り扱い • 常時107万点以上の商品アイテム数と毎日平均2,700点以上の新着 商品を掲載（2026年3月末時点） • ブランド古着のファッションゾーン「ZOZOUSED」や コスメ専門モール「ZOZOCOSME」、シューズ専門ゾーン 「ZOZOSHOES」、ラグジュアリー＆デザイナーズゾーン 「ZOZOVILLA」を展開 • 即日配送サービス • ギフトラッピングサービス • ツケ払い など © ZOZO, Inc. 3
4. ZOZOのブース、行きましたか？ 株式会社ZOZO、スポンサーしてました。 2日間で計20問の激ムズ(?)JS/TSクイズをやっていました。 いくつかクイズの解説と、 作問、アプリ作成の裏側を紹介します。 © ZOZO, Inc. 4
5. Day1 Q1 次のコードはエラーになる？ (tsconfig strict:true) const a = 1 + '1'; © ZOZO, Inc. 1. 実行時エラー 2. コンパイルエラー 3. ならない 5
6. Day1 Q1 次のコードはエラーになる？ (tsconfig strict:true) const a = 1 + '1'; 1. 実行時エラー 2. コンパイルエラー 3. ならない 実行時はJavaScriptなので演算時に 動的に文字列化する。 このようなJavaScriptの挙動を許容するため コンパイルでエラーにならない。 検出したい場合ESLint/Oxlintが必要。 © ZOZO, Inc. 6
7. Day1 Q3 TypeScript 7 はなんの言語 で開発されている？ © ZOZO, Inc. 1. TypeScript 2. Rust 3. Go 7
8. Day1 Q3 TypeScript 7 はなんの言語 で開発されている？ 1. TypeScript 2. Rust 3. Go パフォーマンスとTypeScript実装の移植性から Go言語が選定された。 （基調講演でもありましたね） © ZOZO, Inc. 8
9. Day1 Q9 次の JavaScript ファイルを実行するとエラー になるのは？ const obj = {}; obj.__proto__.a = 1; console.log(obj.a); 1. Node.js 2. Deno 3. Bun // node ./index.mjs // deno run ./index.mjs // bun run ./index.mjs © ZOZO, Inc. 9
10. Day1 Q9 次の JavaScript ファイルを実行するとエラー になるのは？ const obj = {}; obj.__proto__.a = 1; console.log(obj.a); // node ./index.mjs // deno run ./index.mjs // bun run ./index.mjs © ZOZO, Inc. 1. Node.js 2. Deno 3. Bun Denoはセキュリティ上の理由から、 Object.prototype.__proto__ をサポート していない。（プロトタイプ汚染防止） Node.jsでも --disable-proto オプションで 無効化可能。 10
11. Day2 Q4 返り値の型が void で推論されるのは？ const A = () => { throw 'Oops'; }; function B() { throw 'Oops'; } const C = function () { throw 'Oops'; }; © ZOZO, Inc. 1. A 2. B 3. C 11
12. Day2 Q4 返り値の型が void で推論されるのは？ const A = () => { throw 'Oops'; }; function B() { throw 'Oops'; } const C = function () { throw 'Oops'; }; © ZOZO, Inc. 1. A 2. B 3. C class メソッドのオーバーライド挙動のために Bになっている（とされている）。 A, Cはneverで推論される。 ref. Inconsistent never type inference 12
13. Day2 Q5 次のコードの結果は？ "use strict"; let str = "zozo"; str[0] = "s"; console.log(str); © ZOZO, Inc. 1. "sozo" 2. "zozo" 3. Error 13
14. Day2 Q5 次のコードの結果は？ "use strict"; let str = "zozo"; str[0] = "s"; console.log(str); 1. "sozo" 2. "zozo" 3. Error 文字列リテラルのindex-access propertyは writable:falseなので上書きできない。 writable:falseをstrictモードで上書きしよう とするとエラー © ZOZO, Inc. 14
15. 何問わかりましたか？ TSKaigiでは1日目、2日目それぞれ10問ずつ出題し平均4点くらいでした。 （正確な統計が取れてないので感覚値） 他にも15問あるので、会場で挑戦できなかったひとはテックブログへ → TSKaigi 2026 スポンサーブースクイズ解説 - ZOZO TECH BLOG © ZOZO, Inc. 15
16. 時は遡り... © ZOZO, Inc. 16
17. 難問クイズ20問を考える • • • • • • TypeScriptのカンファレンス ◦ TypeScript/JavaScript すべてが難しすぎると辛い。そもそも難問とは...? ◦ とても複雑だったり、極度な知識問題は難しいかもしれないが面白くない AIに相談する ◦ →絶妙におもしろみに欠ける問題を作ってくれる ZOZOにつながるエッセンスも... 型に関するクイズは過去にも... (TSKaigi Kansai 2024) ◦ JavaScriptもひとつまみ... ギリギリ実務で役に立たないラインがほどよく難しく面白い 4/21（TSKaigi 1ヶ月前、ブース印刷物など余裕を持って）、業務の隙間で20問完成 © ZOZO, Inc. 17
18. どうやって10問解いてもらう？ • • • • • • • • • • Google Forms? 紙？ フロントエンドエンジニアなのにアプリ作らないのか...? →答えはどう開示する？ →フロントエンドエンジニアとしてはクライアントには答えを含めたくない →バックエンド込みの公開は会社のルール的に少し大変 →GitHub Pagesでなんとかいけると手早い... →QRコードで回答読み込みならアプリケーションには回答を載せなくても済む GitHub Pages + QRコードな仕組みでアプリを作ろう フレームワークは？ ◦ たまたま登壇がRipple-TSだからそれも使ってみよう！ © ZOZO, Inc. 18
19. AIに頼る • • • アプリの要件を洗い出しAI Agentに投げつける バンドルサイズやライブラリ利用など、AIの判断が怪しい箇所は人間でカバー QRコードリーダーで正解を読み取る形式にしたので自動テストはコストに見合わないと判断 ◦ 2日だけの命、多少の不具合が出ても目を瞑ってもらう © ZOZO, Inc. 19
20. ssssotaアメリカへ • • • • • • 5/18 Google I/O 2026に参加するためサンフランシスコへ✈ 5/19 Google I/O Day1 5/20 Google I/O Day2 5/21 深夜1時のフライトで羽田へ✈ 5/22 早朝5時羽田着→荷物を置きに自宅へ→TSKaigiに参加するため羽田へ 5/23 登壇 © ZOZO, Inc. 20
21. おわりに 改めて、クイズは楽しんでもらえましたか？ クイズは「滅多に使わないけど、いつか役に立ちそう」くらいが楽しい。 みんなも業務に役に立たないクイズを(作ろう|やろう)！ © ZOZO, Inc. 21