error.js

An error file defines an error boundary for a route segment.

Error boundaries must be Client Components.

app/feed/error.tsx
'use client';

// 'use client' marks this page as a Client Component
// https://beta.nextjs.org/docs/rendering/server-and-client-components

import { useEffect } from 'react';

export default function Error({ error, reset }: {
  error: Error;
  reset: () => void;
}) {
  useEffect(() => {
    // Log the error to an error reporting service
    console.error(error);
  }, [error]);

  return (
    <div>
      <p>Something went wrong!</p>
      <button onClick={() => reset()}>Reset error boundary</button>
    </div>
  );
}
  • error: An instance of an Error object. This error can happen on the server or the client.
  • reset(): A function to reset the error boundary, which does not return a response.

Next Steps