Перейти к содержимому

SvelteKit Form Validation with Zod

Huntabyte

0:00 / 0:00

SvelteKit Form Validation with Zod

22 952 просмотра · 3 года назад
Huntabyte
26,2 тыс. подписчиков
22 952 просмотра · 3 года назад
If you find my content useful and want to support the channel, consider contributing a coffee ☕: https://hbyt.us/coffee SvelteKit is a framework for building modern, high-performance, browser-based applications. It was developed by the team behind the popular Svelte framework and is powered by Svelte. Unlike other JavaScript frameworks, it doesn't use a virtual DOM or deliver a bloated and slow application. Zod is a TypeScript-first schema declaration and validation library which enables us to define a schema for our form data and then check user input against that schema. In this SvelteKit tutorial, I demonstrate how to implement Form Validation within SvelteKit, which ensures we are validating user input prior to anything else. I also demonstrate how to display useful UI error messages and indicators to provide the user with the information they need to successfully submit their form. ⭐Starter Code https://github.com/huntabyte/svelteki... 📂 Final Code https://github.com/huntabyte/svelteki... 💽 Form Actions in SvelteKit    • Form Actions Made Simple   ⏪ Previous Video (Authentication with SvelteKit & PocketBase)    • SvelteKit Authentication with PocketBase   📚 Resources Mentioned In This Video Zod Docs: https://zod.dev Zod Error Handling: https://zod.dev/ERROR_HANDLING DaisyUI: https://daisyui.com/ TailwindCSS: https://tailwindcss.com/ 🚀 Become a channel member: https://hbyt.us/join 💬 Discord: https://hbyt.us/discord 🐦 Twitter: https://hbyt.us/twitter 🖥️ Setup Stuff: https://hbyt.us/gear 🔖 Chapters: 00:00 - Introduction 00:28 - What is Zod 01:35 - Defining Our Schema 06:11 - User-Friendly Error Messages 11:18 - UI Validation Messages 16:45 - Custom Validation (Password & Confirm Password) 📃 Topics Covered: How to validate forms in SvelteKit How to validate user input SvelteKit What is Zod? How to use Zod with SvelteKit How to validate passwords with Zod SvelteKit and Zod What is SvelteKit? __________________________________________ (Affiliate links may be included in this description. If you choose to purchase a product from one of those links, I may receive a small commission at no cost to you. Thank you for supporting the channel!)