react-best-practices

Name: react-best-practices
Availability: InStock
Author: Vercel

Identify React best-practices issues in TSX/JSX components.

246|42|Updated Mar 4, 2026

Search Tags:#typescript #accessibility #react #best-practices #code-review #tsx

Ready to run

npx skills add https://github.com/vercel/vercel-plugin --skill react-best-practices-vercel

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: react-best-practices
Source: https://github.com/vercel/vercel-plugin/tree/main/skills/react-best-practices
Command: npx skills add https://github.com/vercel/vercel-plugin --skill react-best-practices-vercel

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

After editing multiple TSX/JSX components, teams gain a condensed, automated check that enforces React best-practices and surfaces quality gaps before merge.

Core Features & Use Cases

Consolidated review trigger: Run a condensed checklist after edits across multiple TSX components to surface issues early.
Multi-axis quality checks: Covers component structure, hooks usage, accessibility, performance, and TypeScript patterns.
Actionable feedback: Flags violations and provides concrete guidance to fix problems quickly.

Quick Start

Trigger the React best-practices reviewer after editing TSX components to receive a concise quality checklist.

Frequently Asked Questions about react-best-practices

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

FAQPage Schema

How do I check my React components for best practices in TypeScript?▼

To check React components for best practices in TypeScript, trigger a consolidated quality checklist after editing TSX files to surface issues across structure, hooks, and TypeScript patterns.

What does a React best practices code review cover?▼

A React best practices code review covers component structure, hooks usage, accessibility, performance, and TypeScript patterns, flagging violations and providing concrete guidance to fix problems quickly.

When should I run a React TSX quality check?▼

You should run a React TSX quality check after editing multiple TSX or JSX components to gain a condensed, automated review that surfaces quality gaps and best-practices issues before merging.

How do I fix accessibility issues in React TSX components?▼

To fix accessibility issues in React TSX components, run a best-practices review that flags violations and returns structured guidance to guide immediate improvements within your current project context.

Can I use this to review React hooks usage and performance patterns?▼

Yes, you can use this to review React hooks usage and performance patterns because the multi-axis quality checks specifically evaluate hooks implementation and performance optimizations alongside TypeScript patterns.