App Router

acme.com
/flagged/eyJhbGciOiJIUzI1NiJ9._QI.gt9UCgWKdNIHvA8QglqDiH22QM6MZYhvbFQjAbPhxHY/

Examples

Layouts
Nested Layouts
Create UI that is shared across routes
Grouped Layouts
Organize routes without affecting URL paths
Parallel Routes
Render multiple pages in the same layout
File Conventions
Loading
Create meaningful Loading UI for specific parts of an app
Error
Create Error UI for specific parts of an app
Not Found
Create Not Found UI for specific parts of an app
Data Fetching
Streaming with Suspense
Streaming data fetching from the server with React Suspense
Static Data
Generate static pages
Dynamic Data
Server-render pages
Incremental Static Regeneration
Get the best of both worlds between static & dynamic
Revalidate Path | Tag
Revalidate path + Vercel cache invalidation
ISR Cache STALE
Cache Staling on time-based ISR revalidation
Preview (Draft) Mode
Testing CDN + Tag Cache (draft)
Static page with Query vars
Loads static page and uses query params to interact dinamically with the content
Components
Client Context
Pass context between Client Components that cross Server/Client Component boundary
Responsive Image
Handle multiple images for different viewports and sizes
Misc
Client Component Hooks
Preview the routing hooks available in Client Components
CSS and CSS-in-JS
Preview the supported styling solutions
Code Snippets
A collection of useful App Router code snippets
Legacy (Pages Router)
Revalidate Path (pages-router)
Revalidate path + Vercel cache stale
ISR Cache STALE (pages-router)
Cache Staling on time-based ISR revalidation
By
View code or deploy your own