Fix Vercel 404 After Deploy with Next.js App Router

A Next.js App Router 404 is often a route file location, dynamic segment, or static export mismatch. Verify the app directory structure before changing hosting settings.

Book $50 Deploy Rescue Generate a checklist

Common symptoms

Home page works but nested routes return 404.
Dynamic routes work locally but not on Vercel.
The project uses app router and custom rewrites.

What to check first

Platform: Vercel + Next.js
Error: 404 after deploy

A Next.js App Router 404 is often a route file location, dynamic segment, or static export mismatch. Verify the app directory structure before changing hosting settings.

Step-by-step fix

Confirm each route has app/.../page.tsx or page.jsx.
Check dynamic segment names and generateStaticParams if using static export.
Remove stale rewrites that point to missing pages.
Run next build locally and inspect route output.

app/
  page.tsx
  dashboard/
    page.tsx
  blog/
    [slug]/
      page.tsx

Common mistake to avoid

Do not mix pages router assumptions with app router file structure.

Still stuck?

Send the deploy log, repository link, target platform, and expected URL. ShipFast Deploy Rescue is a fixed-price debugging service for indie projects and MVPs.

Get Deploy Rescue Email project details