Fetching and Caching data in Next.js Async Server Components
🚀 UPDATED VERSION: • Cookie-based Auth and the Next.js App... 🚀
Next.js now supports Async Server Components in the brand new `/app` directory! In this video, Jon Meyers demonstrates how to suspend the rendering of a server component, while fetching data, and only render something once there is something to render.
😵💫 No more loading spinners! 😵💫
Additionally, he shows how to implement the three most common caching strategies:
1. Static Site Generation (SSG or getStaticProps)
2. Incremental Static Regeneration (ISR or the revalidate prop)
3. Server-Side Rendering (SSR or getServerSideProps)
00:00 Introduction
00:41 Creating a Supabase project
01:12 Creating a Next.js app
02:12 Building a schema with the Table Editor
04:00 Installing supabase-js
05:24 Async data fetching
06:53 RLS policy to enable read access
08:57 Caching at build-time
12:24 Building static pages with generateStaticParams
14:58 Caching data every 60 seconds
17:30 Making dynamic requests by disabling cache
18:37 Outro
👮♀️ Common RLS policies: • Implement Authorization using Row Lev... 👮♀️
🚀 Automatically revalidate data on demand: • Automatically rebuild stale SSG pages... 🚀
👇 Learn more about Supabase 👇
🕸 Website: https://supabase.com/
🏁 Get started: https://app.supabase.com/
📄 Docs: https://supabase.com/docs
🐙 Github: https://github.com/supabase
💬 Discord: https://discord.supabase.com/
🐦 Twitter: / supabase
