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
Superforms本番投入で分かった良さとハマりどころ
Search
kubotak
December 08, 2023
Programming
0
840
Superforms本番投入で分かった良さとハマりどころ
Svelte Japan Online Meetup #1
kubotak
December 08, 2023
Tweet
Share
More Decks by kubotak
See All by kubotak
情報漏洩させないための設計
kubotak
5
1.9k
Svelteコンポーネントの依存関係に秩序を〜
kubotak
0
110
DMARCレポート可視化ツールを SvelteKitで作った話
kubotak
2
510
Storybookを書くだけでリグレッションテストが 実行される世界へようこそ
kubotak
31
11k
(うまくいった||いかなかった) 技術選定は何を考えていたか
kubotak
1
1.2k
ウォーターフォールに思えたプロジェクトにあったアジャイルの要素
kubotak
2
770
Felteで作る簡単フォームバリデーション
kubotak
1
1.6k
SvelteKitを本番投入してみて
kubotak
2
2k
PlaywrightによるSvelteコンポーネントテスト
kubotak
0
3.8k
Other Decks in Programming
See All in Programming
SwiftUI API Design Lessons
niw
1
290
Compose Hot Reload is here, stop re-launching your apps! (Android Makers 2025)
zsmb
1
510
Building a macOS screen saver with Kotlin (Android Makers 2025)
zsmb
1
150
状態と共に暮らす:ステートフルへの挑戦
ypresto
1
510
Youtube Lofier - Chrome拡張開発
ninikoko
0
2.4k
自分のために作ったアプリが、グローバルに使われるまで / Indie App Development Lunch LT
pixyzehn
1
160
アプリを起動せずにアプリを開発して品質と生産性を上げる
ishkawa
0
2.8k
大LLM時代にこの先生きのこるには-ITエンジニア編
fumiyakume
7
3k
Memory API : Patterns, Performance et Cas d'Utilisation
josepaumard
0
140
Strategic Design (DDD)for the Frontend @DDD Meetup Stuttgart
manfredsteyer
PRO
0
150
The Implementations of Advanced LR Parser Algorithm
junk0612
1
300
Kamal 2 – Get Out of the Cloud
aleksandrov
1
190
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
32
5.4k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.2k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Product Roadmaps are Hard
iamctodd
PRO
52
11k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
13
1.4k
Making the Leap to Tech Lead
cromwellryan
133
9.2k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Art, The Web, and Tiny UX
lynnandtonic
298
20k
How to Think Like a Performance Engineer
csswizardry
23
1.5k
Documentation Writing (for coders)
carmenintech
69
4.7k
Fireside Chat
paigeccino
37
3.4k
Transcript
Copyright© M&A Superforms 入 Svelte Japan Online Meetup # 1
Kenjiro Kubota / @kubotak_public
Copyright© M&A Profile 田 二 kubotak-is kubotak_public kenjiro.kubota M&A TypeScript
PHP https://kubotak.page Web Laravel ( ) 犬 豆
Copyright© M&A
Copyright© M&A Nuxt SvelteKit 行 🎉 M&A Vue 2 EOL
2023 12 月 31 日 Nuxt 2 EOL 2024 6 月 30 日 Nuxt(2 ) SvelteKit 行 一 90% 行 https://v 2 .vuejs.org/lts/ https://v 2 .nuxt.com/ja/lts/
Copyright© M&A Nuxt SvelteKit 行 🎉 https://tech.macloud.jp/entry/ 202 3 /
1 2 / 0 6 / 1 3402 0
Copyright© M&A SvelteKit 行 Superforms 用 SvelteKit 行 Sveltekit form
Form actions Superforms 用
Copyright© M&A Superforms Superforms SvelteKit Form actions Zod 用 TypeScript
高 (Superforms Zod 色 )
Copyright© M&A Superforms Superforms Svelte Hack 20 2 3 Best
Library
Copyright© M&A Form actions
Copyright© M&A Form actions SvelteKit <form> POST use:enhance 用 =
Copyright© M&A +page.server.(ts/js) +page.svelte Form actions
Copyright© M&A +page.server.(ts/js) +page.svelte Form actions POST
Copyright© M&A +page.server.(ts/js) Form actions Named actions 用 +page.svelte
Copyright© M&A Form actions use:enhance 用 JavaScript 行 Ajax
Copyright© M&A Superforms
Copyright© M&A zod
Copyright© M&A Superform form +page.server.(ts/js)
Copyright© M&A Superform form +page.server.(ts/js) zod Form superValidate
Copyright© M&A 生 form Svelte 示 +page.svelte
Copyright© M&A 生 form Svelte 示 +page.svelte
Copyright© M&A 生 form Svelte 示 +page.svelte
Copyright© M&A Form Actions +page.server.(ts/js)
Copyright© M&A
Copyright© M&A constraints 用 用 +page.svelte
Copyright© M&A constraints 用 用 +page.svelte
Copyright© M&A constraints 用 用 +page.svelte
Copyright© M&A Superforms enhance +page.svelte
Copyright© M&A 用
Copyright© M&A 用
Copyright© M&A SvelteKit snapshot +page.svelte 自
Copyright© M&A 用方
Copyright© M&A Laravel(PHP) SvelteKit adapter-node Node.js SvelteKit SvelteKit
Copyright© M&A Laravel(PHP) SvelteKit Laravel(PHP) adapter-node Node.js SvelteKit SvelteKit +page.server
Larave HTTP API
Copyright© M&A Laravel(PHP) SvelteKit Laravel(PHP) adapter-node Node.js SvelteKit SvelteKit Superforms
form +page.svelte props
Copyright© M&A Laravel(PHP) SvelteKit Laravel(PHP) adapter-node Node.js SvelteKit SvelteKit Superforms(Form
Actions) +page.server
Copyright© M&A Laravel(PHP) SvelteKit Laravel(PHP) adapter-node Node.js SvelteKit SvelteKit Superforms
Laravel HTTP API
Copyright© M&A Laravel(PHP) SvelteKit Laravel(PHP) adapter-node Node.js SvelteKit SvelteKit Laravel
Node.js SvelteKit Laravel HTTP API
Copyright© M&A Laravel(PHP) SvelteKit Laravel(PHP) adapter-node Node.js SvelteKit SvelteKit Node.js
zod 一
Copyright© M&A
Copyright© M&A Zod Superforms 自 zod
Copyright© M&A Required If 目 ⾒ 目 目 refine 用
Copyright© M&A Enum enum required ⾒ 方 (enum noempty )
Copyright© M&A 見 nullable() null nullish() null | undefined optional()
undefined
Copyright© M&A parse zod parse 行 data API 一 ⾒
行 parse
Copyright© M&A perse satisfies 言 行
Copyright© M&A
Copyright© M&A SvelteKit Form Actions Superforms 言 言 一 zod
Superforms v 2 https://blog.encodeart.dev/superforms-v 2 -supporting-all-validation-libraries
Copyright© M&A thanks watching