Error Handling

Custom Error Classes (TypeScript)

class AppError extends Error { constructor( message: string, public readonly statusCode: number = 500, public readonly code: string = 'INTERNAL_ERROR', public readonly details?: unknown, ) { super(message); this.name = this.constructor.name; } }

class NotFoundError extends AppError { constructor(resource: string, id: string) { super(${resource} ${id} not found, 404, 'NOT_FOUND'); } }

class ValidationError extends AppError { constructor(errors: { field: string; message: string }[]) { super('Validation failed', 400, 'VALIDATION_ERROR', errors); } }

Global Error Handler (Express)

// Must have 4 parameters for Express to recognize as error middleware app.use((err: Error, req: Request, res: Response, next: NextFunction) => { if (err instanceof AppError) { return res.status(err.statusCode).json({ type: https://api.example.com/errors/${err.code}, title: err.message, status: err.statusCode, detail: err.details, instance: req.originalUrl, }); }

// Unexpected errors logger.error('Unhandled error', { error: err, path: req.originalUrl }); res.status(500).json({ type: 'https://api.example.com/errors/INTERNAL_ERROR', title: 'Internal server error', status: 500, }); });

Problem Details (RFC 9457)

{ "type": "https://api.example.com/errors/INSUFFICIENT_FUNDS", "title": "Insufficient funds", "status": 422, "detail": "Account balance is $10.00, but transfer requires $25.00", "instance": "/transfers/abc123" }

React Error Boundaries

import { Component, ErrorInfo, ReactNode } from 'react';

class ErrorBoundary extends Component< { fallback: ReactNode; children: ReactNode }, { hasError: boolean }

{ state = { hasError: false };

static getDerivedStateFromError() { return { hasError: true }; }

componentDidCatch(error: Error, info: ErrorInfo) { reportError(error, info.componentStack); }

render() { return this.state.hasError ? this.props.fallback : this.props.children; } }

// Usage <ErrorBoundary fallback={<ErrorPage />}> <App /> </ErrorBoundary>

Spring Boot (@ControllerAdvice)

@RestControllerAdvice public class GlobalExceptionHandler {

@ExceptionHandler(ResourceNotFoundException.class)
public ProblemDetail handleNotFound(ResourceNotFoundException ex) {
    ProblemDetail pd = ProblemDetail.forStatusAndDetail(HttpStatus.NOT_FOUND, ex.getMessage());
    pd.setType(URI.create("https://api.example.com/errors/NOT_FOUND"));
    pd.setTitle("Resource not found");
    return pd;
}

@ExceptionHandler(MethodArgumentNotValidException.class)
public ProblemDetail handleValidation(MethodArgumentNotValidException ex) {
    ProblemDetail pd = ProblemDetail.forStatus(HttpStatus.BAD_REQUEST);
    pd.setTitle("Validation failed");
    Map<String, String> errors = new HashMap<>();
    ex.getFieldErrors().forEach(e -> errors.put(e.getField(), e.getDefaultMessage()));
    pd.setProperty("errors", errors);
    return pd;
}

}

FastAPI Exception Handlers

from fastapi import FastAPI, HTTPException, Request from fastapi.responses import JSONResponse

@app.exception_handler(AppError) async def app_error_handler(request: Request, exc: AppError): return JSONResponse(status_code=exc.status_code, content={ "type": f"https://api.example.com/errors/{exc.code}", "title": exc.message, "status": exc.status_code, })

Anti-Patterns

Anti-Pattern Fix

Catching all exceptions silently Log and re-throw or return structured error

Exposing stack traces to clients Return generic message, log details server-side

String-based error checking Use typed error classes or error codes

No global error handler Add framework-level catch-all middleware

Inconsistent error response format Use Problem Details (RFC 9457) everywhere

Production Checklist

• Custom error classes with status codes

• Global error handler catches all unhandled errors

• Problem Details format for API errors

• Stack traces never exposed to clients

• React Error Boundaries around route-level components

• Errors logged with context (request ID, user, path)