Using Forms in Next.js (Server Actions, Revalidating Data)
Learn how to create forms and handle data mutations in the Next.js App Router. This tutorial walks through using Server Actions, creating loading and error states with useFormStatus and useFormState, as well as accessibility best practices.
0:00 – Introduction
0:06 – Demo
0:21 – Forms with Pages Router
1:05 – create-next-app
1:30 – Server Component (Data Fetching)
1:58 – Forms and action prop
3:05 – Server Actions (and useFormState)
4:32 – Progressive enhancement
5:03 – Loading states (useFormStatus)
7:13 – Revalidating data and caching
8:12 – Accessibility and error states
9:58 – Conclusion
◆ Docs: https://nextjs.org/docs/pages/buildin...
◆ Example: https://github.com/vercel/next.js/tre...
◆ React Canary Example: https://codesandbox.io/s/vigorous-cur...
◆ Server Actions: https://nextjs.org/docs/app/api-refer...
◆ "use server" : https://react.dev/reference/react/use...
On this page of the site you can watch the video online Using Forms in Next.js (Server Actions, Revalidating Data) with a duration of hours minute second in good quality, which was uploaded by the user leerob 25 September 2023, share the link with friends and acquaintances, this video has already been watched 211,597 times on youtube and it was liked by 4 thousand viewers. Enjoy your viewing!
