Using Forms in Next.js (Server Actions, Revalidating Data)

Publié le: 25 septembre 2023
sur la chaîne: leerob
211,597
4k

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...


Sur cette page du site, vous pouvez voir la vidéo en ligne Using Forms in Next.js (Server Actions, Revalidating Data) durée heure minute seconde en bonne qualité , qui a été Téléchargé par l'utilisateur leerob 25 septembre 2023, Partagez le lien avec vos amis et connaissances, sur youtube cette vidéo a déjà été regardée 211,597 fois et il a aimé 4 mille téléspectateurs. Bon visionnage!