Server Actions in Next.js (useFormStatus, useFormState, Error Handling)

Server Actions lets us mutate data without having to create an additional endpoint and it can also provide the new UI in 1 network roundtrip. In this video, we will build together an application that lets you submit data in the PostGres SQL database, perform validations using Zod and learn server actions in depth including revalidatePath, useFormState and more.

#nextjs #react #nextjs14 #javascript #typescript

⭐️ Sign up for the Premium Next.js Course Waitlist:
https://bit.ly/nextjscourse

👉 FREE Next.js Best Practices Course:
https://bit.ly/nextjshottips

⏰ Timeline
00:00 - Intro
1:10 - Demo walkthrough of the code
4:05 - Before Server Actions - Code walkthrough
6:24 - Let's create our first Server Action
8:48 - PostGres Database in a Server Action
13:02 - Zod Form TypeScript Validations
20:37 - Database Error Handling
22:35 - Frontend Error Handling
28:07 - Routing in Server Actions
32:15 - Loading states in Server Actions

🔗 RESOURCES
→ Book a 1:1 coaching session with me: https://bit.ly/30mins-coaching-with-a...

→ Frontend Newsletter: 💌 Frontend Snacks 🍿 https://bit.ly/fesnacks
Wanna learn visually about a snippet of JavaScript code each week, the latest frontend gossip, news, and behind-the-scenes exclusive updates that I don't share anywhere else? then Subscribe to my newsletter

→ FREE Goodies: https://kulkarniankita.com/goodies