Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Felteで作る簡単フォームバリデーション

kubotak
December 15, 2022
Programming
1
160

 Felteで作る簡単フォームバリデーション

Nextbeat Tech Bar：広がるSvelteの輪！忘年LT会

kubotak

December 15, 2022
Tweet

More Decks by kubotak

See All by kubotak
SvelteKitを本番投入してみて
kubotak
0
550
PlaywrightによるSvelteコンポーネントテスト
kubotak
0
1.2k
AWS CDKでまるっと インフラ環境をIaCしたぞ！
kubotak
0
80
FeatureToggle戦略と運用方法
kubotak
3
800
SvelteKitでストアのハイドレーションを考えてみた
kubotak
2
100
PHPコードを消すライブラリを作った
kubotak
0
1.1k
なぜLaravel9はLTSではないのか
kubotak
0
950
Nuxt v2からv3へのマイグレーション
kubotak
0
540
カンファレンスで登壇すること
kubotak
0
61

Other Decks in Programming

See All in Programming
Next.js 13 Layout / Streaming SSR 仕組み解説
sumiren
0
150
量子コンピュータ時代のプログラミングセミナー / 20221222_Amplify_seminar _route_optimization
fixstars
0
250
Remote SSHで行うVS Codeリモートホスト開発とトラブルシューティング
smt7174
1
520
An Advanced Introduction to R
nicetak
0
1.8k
LIFFで動く割り勘アプリTATEKAをリリースしてみた話
inoue2002
0
260
Cloudflare WorkersでGoを動かすライブラリを作っている話
syumai
1
330
Gradle build: The time is now
nonews
1
500
Step Functions Distributed Map を使ってみた
codemountains
0
120
Hono v3 - Do Everything, Run Anywhere, But Small, And Faster
yusukebe
4
140
Form実装基本を学び直してみた
hyugatsukui
0
250
ipa-medit: Memory search and patch tool for IPA without Jailbreaking/ipa-medit-bh2022-europe
tkmru
0
130
Micro Frontends with Module Federation @MicroFrontend Summit 2023
manfredsteyer
PRO
0
630

Featured

See All Featured
Why You Should Never Use an ORM
jnunemaker
PRO
49
7.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
6
850
Building an army of robots
kneath
301
40k
How GitHub Uses GitHub to Build GitHub
holman
465
280k
StorybookのUI Testing Handbookを読んだ
zakiyama
8
3.2k
Documentation Writing (for coders)
carmenintech
51
2.9k
Fireside Chat
paigeccino
16
1.9k
How GitHub (no longer) Works
holman
298
140k
The Brand Is Dead. Long Live the Brand.
mthomps
48
2.9k
How To Stay Up To Date on Web Technology
chriscoyier
779
250k
Fontdeck: Realign not Redesign
paulrobertlloyd
74
4.3k
VelocityConf: Rendering Performance Case Studies
addyosmani
317
22k

Transcript

  1. Copyright© M&A Felte Nextbeat Tech Bar Svelte LT Kenjiro Kubota

  2. Copyright© M&A Profile kubotak-is kubotak_public kenjiro.kubota M&A TypeScript PHP https://kubotak.page

    Web Laravel ( )

  3. Copyright© M&A

  4. Copyright© M&A UI

  5. Copyright© M&A GitHub https://github.com/kubotak-is/felte-form-sample ⾒ GitHub SvelteKit 1 . 0

    . 0

  6. Copyright© M&A Form Svelte src/lib/components/login-form.svelte

  7. Copyright© M&A Form src/lib/components/form/input-label.svelte

  8. Copyright© M&A Form src/lib/components/form/input-text.svelte

  9. Copyright© M&A Form src/lib/components/form/submit-button.svelte

  10. Copyright© M&A Felte A form library for Svelte, Solid and

    React HTML 5 name https://github.com/pablo-abc/felte

  11. Copyright© M&A Felte Form Actions

  12. Copyright© M&A

  13. Copyright© M&A Felte Felte

  14. Copyright© M&A yup yup

  15. Copyright© M&A

  16. Copyright© M&A email

  17. Copyright© M&A 6 255

  18. Copyright© M&A yup schema felte

  19. Copyright© M&A

  20. Copyright© M&A Form input name scheme

  21. Copyright© M&A Form input name scheme

  22. Copyright© M&A

  23. Copyright© M&A

  24. Copyright© M&A yup-locale-ja yup

  25. Copyright© M&A 🎉

  26. Copyright© M&A suggestive descriptive

  27. Copyright© M&A

  28. Copyright© M&A matches

  29. Copyright© M&A yup-password

  30. Copyright© M&A ⾒ Submit

  31. Copyright© M&A Felte errors

  32. Copyright© M&A ⾒

  33. Copyright© M&A ⾒ ⾒

  34. Copyright© M&A ⾒ $touched

  35. Copyright© M&A Felte email

  36. Copyright© M&A Required If

  37. Copyright© M&A Yes ⾒

  38. Copyright© M&A Svelte src/lib/components/required-if-form.svelte

  39. Copyright© M&A Form src/lib/components/form/input-radio.svelte

  40. Copyright© M&A Form src/lib/components/form/input-text.svelte

  41. Copyright© M&A

  42. Copyright© M&A

  43. Copyright© M&A when

  44. Copyright© M&A has_secret 1 secret

  45. Copyright© M&A has_secret 1 secret

  46. Copyright© M&A Yes ⾒ Yes ⾒ No ⾒

  47. Copyright© M&A React Simple Vue.js Easy Svelte Felte Svelte Simple

    Easy HTML name yup React Hook Form yup Svelte Felte + yup

  48. Copyright© M&A () => `Thanks for watching this :)`