attr() Is My New Favorite CSS Function

How I Built My Own Shadcn Library

NEW Next.js TypeScript Features

This Font Feature Is A Must Use In Your Dev Tools

Shadcn’s new Field component replaces the old Form component, but it is quite a bit different. In this video I will show you how all the new Field components work and more importantly I will show you how to create a clean reusable set of form components using React Hook Form and TanStack Form.


📚 Materials/References:

GitHub Code: https://github.com/WebDevSimplified/shadcn-field-component


🌎 Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00 - Introduction
00:50 - Starting Code
01:30 - Basic React hook form implementation
11:30 - Adding descriptions to form fields
13:51 - Select form fields
17:30 - Advanced field components and checkboxes
22:51 - Handling field arrays
30:23 - Advanced React hook form implementation
48:17 - Basic Tanstack form implementation
54:15 - Advanced Tanstack form impementation


#Shadcn #WDS #ShadcnField

I Will Never Use Shadcn Form Components Again

attr() Is My New Favorite CSS Function

How I Built My Own Shadcn Library

NEW Next.js TypeScript Features

This Font Feature Is A Must Use In Your Dev Tools