🔧 Error Fixes

Mar 16, 2026 · 1 min read

Next.js: getServerSideProps Error — How to Fix It

Error: `getServerSideProps` is not supported in app/ directory

You’re mixing Pages Router and App Router patterns.

Fix 1: App Router — use server components instead

// ❌ Pages Router pattern in app/ directory
export async function getServerSideProps() { ... }

// ✅ App Router — just fetch in the component
export default async function Page() {
  const data = await fetch('https://api.example.com/data');
  const json = await data.json();
  return <div>{json.title}</div>;
}

Fix 2: If using Pages Router

Make sure the file is in pages/, not app/:

pages/index.tsx  ← getServerSideProps works here
app/page.tsx     ← use server components here