skills.rest
jjmendezrodriguez
jjmendezrodriguezCOMMUNITY
Explore all skills by this author →
GitHub

code-errors

Convert TypeScript/React/Supabase failures into typed AppError-based error handling.

Updated Apr 16, 2026
Search Tags:#security#error handling#supabase#typed errors#zod validation#react error boundary#api error response
One-click install
npx skills add https://github.com/jjmendezrodriguez/jm-claude-plugin --skill code-errors
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: code-errors
Source: https://github.com/jjmendezrodriguez/jm-claude-plugin/tree/main/skills/code-errors
Command: npx skills add https://github.com/jjmendezrodriguez/jm-claude-plugin --skill code-errors

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Prevents confusing, unsafe failure states by turning unpredictable runtime errors into consistent, user-safe responses with complete logs for developers.

Core Features & Use Cases

  • First-class error handling: catch specific errors, never swallow them, and avoid exposing stack traces, internal paths, or secrets.
  • Typed custom error hierarchy: use AppError plus domain-specific errors (e.g., ValidationError, NotFoundError, AuthError) with predictable code and statusCode.
  • Boundary validation with Zod: validate external inputs using safeParse, fail fast, and infer types from schemas for correctness.
  • Supabase failure mapping: check .error before using .data and translate common Supabase error codes into the right error types.
  • React route-level error boundaries: implement ErrorBoundary to show friendly UI while logging detailed component stacks.
  • Consistent API error responses: return a stable { type, message, errors? } shape without leaking sensitive details.

Quick Start

Ask the AI: implement typed Zod boundary validation, map Supabase .error codes to custom AppError subclasses, and wire a React ErrorBoundary with a consistent API error response format.

Frequently Asked Questions about code-errors

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle Supabase query errors in TypeScript without exposing internal details?▼

To handle Supabase query errors safely, check the `.error` property before using `.data`, then translate common Supabase error codes into custom `AppError` subclasses with appropriate status codes to prevent leaking stack traces or secrets.

What is the best way to validate API inputs with Zod and return consistent error responses?▼

Zod boundary validation uses `safeParse` to validate external inputs and fail fast, inferring types from schemas for correctness, while a stable API error response schema returns `{ type, message, errors? }` without leaking sensitive details.

How do I set up a React error boundary to catch route-level rendering failures?▼

React route-level error boundaries use an `ErrorBoundary` component to catch rendering failures, displaying friendly UI to users while logging detailed component stacks for developers to debug safely.

Do I need custom error types to manage TypeScript and React failure states consistently?▼

Custom error types like `AppError` plus domain-specific subclasses such as `ValidationError` or `NotFoundError` provide predictable `code` and `statusCode` properties, ensuring typed, consistent error handling across server and UI boundaries.

Can I use this error handling approach for both server-side try/catch flows and React UI failures?▼

Yes, this approach converts unpredictable TypeScript, React, and Supabase runtime failures into safe, typed, consistent error handling across server try/catch flows and UI boundaries, applying Zod validation and React ErrorBoundary logging.

Related Skills

Explore More Software Engineering Skills→
sanchezx1sanchezx1

zod-schema-validator

Validate incoming data with Zod schemas in services and API routes.

Community
Intermediate
ColdstartLabs-caColdstartLabs-ca

error-handling

Standardize error handling across API routes, React components, webhooks, and Baselime monitoring.

Official
Advanced
DayoptDayopt

error-handling

Centralize error normalization, logging, and user notifications in Next.js/React applications.

Official
Advanced
JunjieChen0JunjieChen0
4

cangjie-error-handle

Implement robust error handling in Cangjie with exception hierarchies and control flow patterns.

Community
Advanced