skills.rest
esneiderbravo
esneiderbravoCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

react-best-practices

Review TSX files for React best practices and generate prioritized refactoring reports.

1|Updated Apr 17, 2026
Search Tags:#typescript#performance#accessibility#react#best-practices#code-review#tsx
One-click install
npx skills add https://github.com/esneiderbravo/hackaton --skill react-best-practices-esneiderbravo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react-best-practices
Source: https://github.com/esneiderbravo/hackaton/tree/main/.github/skills/react-best-practices
Command: npx skills add https://github.com/esneiderbravo/hackaton --skill react-best-practices-esneiderbravo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a centralized reviewer for TSX code to surface React best-practices, performance, accessibility, and TypeScript pattern improvements after edits.

Core Features & Use Cases

  • Scans TSX files across common component directories to detect hooks usage, accessibility issues, performance patterns, and TS pattern deviations.
  • Produces a condensed quality checklist with concrete recommendations and refactoring tips for developers.
  • Generates an actionable report suitable for code reviews and automated checks.

Quick Start

Run the reviewer against your TSX files or repository path to generate a concise React best-practices report.

Frequently Asked Questions about react-best-practices

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

FAQPage Schema
How do I review TSX code for React best practices and accessibility?▼

To review TSX code for React best practices, you can scan component directories to surface actionable guidance on hooks usage, accessibility, performance, and TypeScript patterns, generating a structured report with prioritized refactoring suggestions.

What is the best way to automate React TypeScript code review for performance?▼

Automating React TypeScript code review involves running a reviewer against TSX files to detect performance patterns and TS deviations, producing a condensed quality checklist with concrete recommendations suitable for automated checks.

Does this React code reviewer work with standard src/components directories?▼

Yes, the React code reviewer works with standard TSX file directories including src/app/components, src/components, and app/components, scanning these paths to apply internal quality guardrails and generate actionable reports.

Can I get concrete refactoring suggestions for React hooks usage in TSX files?▼

Yes, you can get concrete refactoring suggestions for React hooks usage by scanning TSX files, which checks hooks patterns and produces a prioritized report aligning with internal quality guardrails to improve code quality.

How do I check React TSX files for TypeScript pattern deviations?▼

To check React TSX files for TypeScript pattern deviations, run a reviewer across common component directories to identify TS deviations and produce a structured report with prioritized recommendations and refactoring tips.

Related Skills

Explore More Software Engineering Skills→
okgoogle13okgoogle13
1

react-component-scaffolder

Generate a React component directory with TypeScript files and MUI Box.

Community
Basic
xlelibertyxleliberty

review

Analyze Playwright test files for anti-patterns, coverage gaps, and performance bottlenecks.

Community
Intermediate
rsnormanrsnorman

quality-check

Run ESLint, Prettier, and TypeScript type checks on code.

Community
Intermediate
rajyeole6rajyeole6

agency-api-tester

Automate API functional, security, and performance tests with Playwright or k6.

Community
Advanced