Data Fetching

Fetching data

Server-side fetch

async function getCourses() {\n  const res = await fetch("https://api.example.com/courses", {\n    cache: "force-cache",   // static (default)\n  });\n  if (!res.ok) throw new Error("Failed to fetch");\n  return res.json();\n}

Revalidate (ISR)

const res = await fetch(url, {\n  next: { revalidate: 60 }, // refresh every 60s\n});

Dynamic data

export const dynamic = "force-dynamic";\n// or omit caching → always fresh

Loading states

// app/courses/loading.js\n\nexport default function Loading() {\n  return <p>Loading courses…</p>;\n}

A practical pattern

• Marketing/static pages → cached (default)
• Course list → revalidate every minute
• User dashboard → dynamic

Tip: Fetch as close to the server as you can — fewer round trips, better performance, simpler code.