jsschools

notFound()

Renders the nearest not-found UI and returns a 404 status.

Since Next 13 (App Router) Spec ↗

Syntax

import { notFound } from 'next/navigation'; notFound()

Returns

never — Throws to render not-found.js and send a 404.

Examples

import { notFound } from 'next/navigation'

export default async function Page({ params }) {
  const { id } = await params
  const post = await db.posts.find(id)
  if (!post) notFound()
  return <Article post={post} />
}

// app/blog/[slug]/not-found.tsx
export default function NotFound() {
  return <h1>Post not found</h1>
}

Notes

Throws a control-flow error, so code after it does not run and it must not be swallowed by try/catch. It renders the closest `not-found.js` boundary and sets the HTTP status to 404. In Next 15, `params` is async, so `await` it before use.

See also