Next.js Server Actions (revalidatePath, useFormStatus & useOptimistic)

👉 NEW React & Next.js Course: https://bytegrad.com/courses/professional-react-nextjs
Hi, I’m Wesley. I’m a brand ambassador for Kinde (paid sponsorship).
👉 Add auth to your app FAST: https://bit.ly/3QOe1Bh

👉 NEW React & Next.js Course: https://bytegrad.com/courses/professional-react-nextjs
👉 Professional JavaScript Course: https://bytegrad.com/courses/professional-javascript
👉 Professional CSS Course: https://bytegrad.com/courses/professional-css

👉 Discord: all my courses have a private Discord where I actively participate
🔔 Email newsletter (BIG update soon): https://email.bytegrad.com

⏱️ Timestamps:
0:00 Fetching data in server components
0:58 Traditional data mutations
2:54 Server actions for mutations
6:37 Revalidating data
8:08 Under the hood
9:28 2 Other Benefits
10:31 Server Action in client component
13:20 Reset form
15:44 Downside of client components
16:06 useFormStatus (pending state)
18:20 Error handling
19:55 useOptimistic (optimistic UI)
26:29 formAction
27:10 Server Actions outside form

#webdevelopment #programming #coding

Note that my videos may contain mistakes. Always verify yourself that your code is safe and does what you want it to do for your specific situation. You agree by watching the videos that you are solely responsible for any mistakes in your code.

This channel and all its content is owned & operated by ByteGrad Sp. z o.o. with Tax ID: PL6762676561