What is error.tsx in Next.js App Router?

The error.tsx file defines a React Error Boundary for a route segment — it catches errors thrown during rendering and displays a fallback UI instead of crashing the entire application. Creating an error boundary: "use client"; // error.tsx must be a Client Component import { useEffect } from "react"; export default function Error({ error, reset }: { error: Error & { digest?: string }; reset: () => void }) { useEffect(() => { console.error(error); }, [error]); return ( <div> <h2>Something went wrong!</h2> <p>{error.message}</p> <button onClick={reset}>Try again</button> </div> ); }. Must be a Client Component — error boundaries in React must be class components or use the "use client" directive (Next.js handles the class component part). Props: error — the Error object with a digest (server-side error ID for cross-referencing logs without exposing details to the client); reset — a function to re-attempt rendering the error boundary segment. Error scope: errors are caught by the nearest error.tsx up the route tree. An error in app/dashboard/page.tsx is caught by app/dashboard/error.tsx if it exists, otherwise app/error.tsx. The layout is NOT caught — use global-error.tsx to catch layout errors. not-found.tsx: special error UI for 404s — shown when notFound() is called.