0Pricing
React Academy · Lesson

Error Boundary Components (Class-Based Wrapper)

Build a class-based ErrorBoundary that catches render/lifecycle errors in descendants and shows a friendly fallback.

Why error boundaries

Goal: Prevent a single crashing widget from breaking the whole app.

  • Wrap risky areas with an ErrorBoundary
  • Show a friendly fallback
  • Log details for developers

Catch vs not catch

  • Catches: render, lifecycle, constructor errors in descendants
  • Not: event handler errors, async (setTimeout), server errors by default
  • Use try/catch for events; handle async in promises

All lessons in this course

  1. Error Boundary Components (Class-Based Wrapper)
  2. Recovering UI & Reporting Strategies
  3. Guarding Effects & Cleanup
← Back to React Academy