Error boundaries:
1class ErrorBoundary extends React.Component {2 state = { error: null };3 static getDerivedStateFromError(error) { return { error }; }4 render() {5 if (this.state.error) return <ErrorFallback error={this.state.error} />;6 return this.props.children;7 }8}
Async error handling:
1function DataLoader() {2 const [error, setError] = useState(null);3 const [data, setData] = useState(null);4 useEffect(() => { fetchData().then(setData).catch(setError); }, []);5 if (error) return <ErrorMessage error={error} />;6 if (!data) return <Spinner />;7 return <DataView data={data} />;8}
Best practices: Wrap pages in error boundaries, show fallback UI, log to monitoring service.