pages/404.js作るだけ。

// pages/404.js
export default function Custom404() {
  return <h1>404 - Page Not Found</h1>
}

500エラーもpages/500.jsを作ればカスタムできる。

// pages/500.js
export default function Custom500() {
  return <h1>500 - Server-side error occurred</h1>
}

サーバーに依存したエラーを扱いたい場合など、デフォルトの Error コンポーネントをオーバーライドする場合は、pages/_error.jsを作る。

function Error({ statusCode }) {
  return (
    <p>
      {statusCode
        ? `An error ${statusCode} occurred on server`
        : 'An error occurred on client'}
    </p>
  )
}

Error.getInitialProps = ({ res, err }) => {
  const statusCode = res ? res.statusCode : err ? err.statusCode : 404
  return { statusCode }
}

export default Error

参考

https://nextjs.org/docs/advanced-features/custom-error-page