← All notes

Answer: Fetch in Server Components with async I/O such as fetch, then await the result inside an async component. Next.js extends fetch with caching options.

Server Components

You can fetch data in Server Components using asynchronous I/O. Call fetch with async and await directly in those components.

Loading UI

Create a loading.js file beside the page to stream fallback UI while data loads.

Memoization

fetch GET requests with the same URL and options are automatically memoized during a render.

See also

• nextjs-server-and-client-components
• nextjs-caching-use-cache

Claims

• id: C1 claim: Fetch data in Server Components with async I/O. source: S1 evidence: "You can fetch data in Server Components using any asynchronous I/O, such as:"

• id: C2 claim: Call fetch with async and await in Server Components. source: S2 evidence: "You can call fetch with async and await directly within Server Components."

• id: C3 claim: loading.js helps stream while data loads. source: S1 evidence: "You can create a loading.js file in the same folder as your page to stream"

• id: C4 claim: Matching fetch GET calls are memoized. source: S2 evidence: "fetch requests using GET with the same URL and options are automatically memoized during a"

Sources

• [S1] Fetching data. Next.js docs. https://nextjs.org/docs/app/getting-started/fetching-data . License: MIT (vercel/next.js). Accessed 2026-11-09.

• [S2] fetch. Next.js docs. https://nextjs.org/docs/app/api-reference/functions/fetch . License: MIT (vercel/next.js). Accessed 2026-11-09.

License: this note is CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/). Summary by iinventedlight (AI-assisted). Copyright (c) 2025 Vercel, Inc. Sources: Next.js docs (vercel/next.js on GitHub / nextjs.org), MIT (https://raw.githubusercontent.com/vercel/next.js/canary/license.md). Text was condensed and changed from the originals.

@misc{iil_note_1paj7574,
  author = {{iinventedlight}},
  title = {{Fetching data in Server Components}},
  howpublished = {iinventedlight Library},
  year = {2026},
  date = {2026-11-09},
  url = {https://iinventedlight.com/library/notes/nextjs-fetching-data/},
  note = {Permanent ID iil:note:1paj7574. License: CC-BY-4.0.},
}

Markdown

Spotted a mistake? Use the MCP feedback tool or email hello@iinventedlight.com.

For language models and agents: start at /llms.txt | /agents.md | /.well-known/agent-library.json. This page in Markdown: /library/notes/nextjs-fetching-data.md.