00:00 Let me show you how to do forms the right way on the Next.js App Writer. I'll show you a fast and easy way to validate fields on both the client and the server, and I'll walk you through not one, not two, but four different ways to send form data to the server for processing.

00:17 And you'll have all the code to be able to decide for yourself which is the best method for your particular project. Oh, and you'll want to check out the section on field validations on the server. It's mind-blowing. So for this tutorial, we're going to use ShadCN on top of Tailwind to give us some really good looking UI elements.

00:37 Now you can use whatever you like, but obviously you'll need to adjust the code for that. So my recommendation, first time through, is just to use ShadCN the way that I'm showing it to you. We'll use React Hook Form to manage the form, the data, and the client-side validation.

00:52 Then we'll use a schema validation library called Zod, yeah, like the character from Superman, to validate data on both the client and on the server. And I can't stress enough how important it is to validate data from the form on both the client and the server.

01:09 I've seen countless projects where folks validate only on the client. The client can't be trusted. You have to validate on both the client and the server, and I'll show you how to do that using exactly the same validation in both places so it's super easy. Alright, enough of my intro, let's get into setting up our application.

01:27 First thing we're going to do is create our application and initialize the ShadCN UI library. The commands you need are in the instructions. Give it a go, and then I'll show you how I did it. Oh, and one more thing, and this is important, make sure that you select the app router as

01:43 your router, as well as Tailwind and TypeScript as you're creating your Next.js application.