Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
What is Standard Schema?
Search
Takashi Machinaga
February 26, 2025
Technology
0
83
What is Standard Schema?
Mita.ts #4(2025-02-26)
Takashi Machinaga
February 26, 2025
Tweet
Share
More Decks by Takashi Machinaga
See All by Takashi Machinaga
AI駆動の自動テスト生成
macchiitaka
1
110
事業モメンタムを生み出すプロダクト開発
macchiitaka
1
170
Other Decks in Technology
See All in Technology
asken AI勉強会(Android)
tadashi_sato
0
130
Connect 100+を支える技術
kanyamaguc
0
110
Delegating the chores of authenticating users to Keycloak
ahus1
0
130
製造業からパッケージ製品まで、あらゆる領域をカバー!生成AIを利用したテストシナリオ生成 / 20250627 Suguru Ishii
shift_evolve
PRO
1
160
使いたいMCPサーバーはWeb APIをラップして自分で作る #QiitaBash
bengo4com
0
1k
5min GuardDuty Extended Threat Detection EKS
takakuni
0
180
Amazon Bedrockで実現する 新たな学習体験
kzkmaeda
2
660
Claude Code Actionを使ったコード品質改善の取り組み
potix2
PRO
6
2.6k
PHPでWebブラウザのレンダリングエンジンを実装する
dip_tech
PRO
0
210
2025-06-26 GitHub CopilotとAI駆動開発:実践と導入のリアル
fl_kawachi
1
210
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
kkuv
1
360
生成AI活用の組織格差を解消する 〜ビジネス職のCursor導入が開発効率に与えた好循環〜 / Closing the Organizational Gap in AI Adoption
upamune
5
4.4k
Featured
See All Featured
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
5
230
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Visualization
eitanlees
146
16k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
How to Think Like a Performance Engineer
csswizardry
24
1.7k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.3k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.5k
Balancing Empowerment & Direction
lara
1
390
Side Projects
sachag
455
42k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Transcript
What is Standard Schema? Mita.ts #4(2025-02-26) Takashi Machinaga @macchiitaka
⾃⼰紹介 • @macchiitaka • 2024年8⽉ IVRy に⼊社 ◦ 主に WEB
フロントエンド Takashi Machinaga 2 エンジニア
Zod v3.24.0 3
@standard-schema/spec? 4
@standard-schema/spec ? 5
Colin McDonnell 6 “これは、Zod(👋)、Valibot、ArkType の作成者が、相互運⽤性を促進するため に共同で作成した、すべて TypeScript スキーマライブラリが実装する「共通イン ターフェース」の仕様です。”
= Standard Schema はTypeScript の型定義(意訳) 7
Standard Schema が⽣まれる前の世界 8
スキーマと連携するライブラリ 9 • React Hook Form • Hono • tRPC
• TanStack Router • ...
React Hook Form とスキーマ 10 • React Hook Form +
Zod • React Hook Form + Yup • React Hook Form + Joi • React Hook Form + Valibot • React Hook Form + ArkType • ...
React Hook Form とスキーマ 11 • React Hook Form +
Zod Resolver + Zod • React Hook Form + Yup Resolver + Yup • React Hook Form + Joi Resolver + Joi • React Hook Form + Valibot Resolver + Valibot • React Hook Form + ArkType Resolver + ArkType • ...
Standard Schema なしで連携する世界 12 React Hook Form Zod Resolver Valibot
Resolver Zod Valibot Input RHF Result Zod Validate Zod Result Valibot Validate Valibot Result
サポートするスキーマの数だけ Resolver を提供 13
😇😇😇 14
Standard Schema がある世界 15
Standard Schema なしで連携する世界 16 React Hook Form Zod Resolver Valibot
Resolver Zod Valibot Input RHF Result Zod Validate Zod Result Valibot Validate Valibot Result Standard Schema は この間の共通 インターフェイス
Standard Schema で連携する世界 17 React Hook Form Standard Schema Resolver
Zod Valibot Input RHF Result Validate Result
🎉 ひとつの Resolver で連携できる 🎉 18
🥳🥳🥳 19
直接スキーマライブラリを利⽤する
直接スキーマライブラリを利⽤する
直接スキーマライブラリを利⽤する
スキーマ定義と実装サンプルを⾒てみよう 23
スキーマ 24 https://github.com/standard-schema/standard-schema/blob/main/packages /spec/src/index.ts • 100 ⾏未満のコード • バリデーターの呼び出し⽅、実⾏結果、エラーメッセージと位置 •
`~standard` プロパティ配下に実装する ◦ `~` で始まるプロパティは⾃動補完の優先順位が低い
スキーマライブラリ 25 https://github.com/standard-schema/standard-schema/blob/main/packages /examples/implement.ts
スキーマ連携ライブラリ 26 https://github.com/standard-schema/standard-schema/blob/main/packages /examples/integrate.ts