Every major page section that fetches data must be wrapped in an error boundary
Error boundaries must show a user-friendly message — never raw error details
Client-side errors should be reported to Sentry with the error and component stack
The Next.js global-error.tsx must be the outermost fallback
1---2name: error-boundary3description: Skill: error-boundary4---56# Skill: error-boundary78Provides React Error Boundary component and Next.js App Router error handling patterns.910## When to use11- Any page section that fetches data and might fail12- Setting up global error handling for the Next.js app router13- Integrating Sentry for client-side error tracking1415## Files16- `error-boundary.template.tsx` — Reusable React error boundary component17- `error-page.template.tsx` — Next.js `error.tsx` page template1819## Rules20- Every major page section that fetches data must be wrapped in an error boundary21- Error boundaries must show a user-friendly message — never raw error details22- Client-side errors should be reported to Sentry with the error and component stack23- The Next.js `global-error.tsx` must be the outermost fallback
Run npx skillmds@latest add gabrielmoreira/error-boundary in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.
Skill: error-boundary It is listed under Web & Frontend on SkillMD.
This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.
This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.
Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.
gabrielmoreira (@gabrielmoreira) published this skill. Their other Agent Skills are listed on their SkillMD profile.
gabrielmoreira