Data Fetching: Data Fetching Patterns and Best Practices | Next.js
There are a few recommended patterns and best practices for fetching data in React and Next.js. This page will go over some of the most common patterns and how to use them. Whenever possible, we recommend fetching data on the server with Server Components. This allows you to: Then, you can mutate or update data with Server Actions. If you need to use the same data (e.g. current user) in multiple components in a tree, you do not have to fetch data globally, nor forward props between components. Instead, you can use fetch or React cache in the component that needs the data without worrying about the performance implications of making multiple requests for the same data. This is possible because fetch requests are automatically memoized. Learn more about request memoization Good to know: This also applies to layouts, since it's not possible to pass data between a parent layout and its children. Streaming and Suspense are React features that allow you to progressively render and increment
This page is also available as Markdown at /docs/app/getting-started/fetching-data.md . For an index of Next.js documentation , see /docs/llms.txt . Copy page Fetching Data Last updated July 22, 2026 This page will walk you through how you can fetch data in Server and Client Components, and how to stream components that depend on uncached data. Fetching data Server Components You can fetch data in Server Components using any asynchronous I/O, such as: The fetch API An ORM or database With the fetch API To fetch data with the fetch API, turn your component into an asynchronous function, and awa
Explore this link on the map →related reading
- Getting Started: Fetching Data | Next.jsnextjs.org
- Getting Started: Fetching Data | Next.jsnextjs.org
- Getting Started: Fetching Data | Next.jsnextjs.org
- How to fetch data in React [2024] - Robin Wieruchrobinwieruch.de
- App Router: Streaming | Next.jsnextjs.org
- App Router: Fetching Data | Next.jsnextjs.org
- Getting Started: Server and Client Components | Next.jsnextjs.org
- Usage with Next.js – SWRswr.vercel.app
- File-system conventions: loading.js | Next.jsnextjs.org
- Making Sense of React Server Components • Josh W. Comeaujoshwcomeau.com
- Getting Started: Caching | Next.jsnextjs.org
- React Foundations: Server and Client Components | Next.jsnextjs.org