Рет қаралды 74,321
Learn how to fetch, cache, and revalidate data using the Next.js App Router.
0:00 - Introduction
0:24 - Demo
1:20 - Caching overview
2:06 - Foundations
6:10 - Static: fetch()
7:03 - Dynamic: fetch() without caching
7:37 - Static: unstable_cache()
9:37 - Dynamic: Direct database calls
10:07 - Revalidating static data
12:32 - Revalidating from external sources (webhooks)
14:12 - Revalidating static data with ISR
15:28 - React cache()
16:40 - App Router and Pages Router differences
17:52 - Example: Forms with useFormState & useFormStatus
19:33 - Using forms without JavaScript
19:59 - Exploring the network tab for a Server Action
20:49 - Example: Optimistic UI
21:45 - Preventing navigations with pending mutations
22:34 - Progressive enhancement
23:39 - Partial Prerendering
24:56 - Conclusion
◆ Forms example: github.com/vercel/next.js/tre...
◆ Optimistic UI example: github.com/vercel/next.js/tre...
◆ Docs: nextjs.org/docs/app/building-...
◆ Deep dive: github.com/vercel/next.js/dis...
◆ Partial Prerendering: vercel.com/blog/partial-prere...
#nextjs #react