Error Boundaries in Remix

Error Boundary in Remix is defined within the page route and it has to be exported from it, so that Remix knows what to use. It can be used to handle route errors as well as server errors.

Example:

export function ErrorBoundary() {  
	const error = useRouteError()  
  
	return (  
		<div className="ontainer mx-auto flex h-full w-full items-center justify-center bg-destructive p-20 text-h2 text-destructive-foreground">  
			<h1>Oh no!</h1>  
			<p>Something bad happend!!!!!</p>  
		</div>  
	)  
}