react

Develop, debug, and optimize React applications with TypeScript.

Updated Feb 13, 2026
One-click install
npx skills add https://github.com/aubrian-halili/ai-experience --skill react-aubrian-halili
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react
Source: https://github.com/aubrian-halili/ai-experience/tree/main/.claude/skills/react
Command: npx skills add https://github.com/aubrian-halili/ai-experience --skill react-aubrian-halili

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps developers build, debug, and optimize React applications by providing guidance on components, hooks, state management, and testing.

Core Features & Use Cases

  • Component Scaffolding: Create new React components, hooks, and Redux slices with best practices.
  • Code Analysis: Analyze existing React code for patterns, types, and test coverage.
  • Debugging: Diagnose and fix common React issues like infinite re-renders or state update problems.
  • Pattern Implementation: Apply established React patterns for composition, state management, and data fetching.
  • Testing Guidance: Provides best practices for testing React components and hooks using React Testing Library.

Quick Start

Use the react skill to create a new UserProfile component with associated test file.

Frequently Asked Questions about react

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

FAQPage Schema
How do I fix infinite re-renders in my React application?

To fix infinite re-renders in React, diagnose state update problems and hook dependency arrays. Analyze component logic to identify unpredictable rendering loops and apply established composition and colocation patterns to stabilize state updates.

What is the best way to manage state in React with Redux Toolkit?

The best way to manage state in React with Redux Toolkit is creating RTK slices using best practices. Apply established patterns for predictable state management and leverage RTK Query for efficient data fetching and caching within your TypeScript components.

How do I test React components using React Testing Library?

To test React components with React Testing Library, follow best practices for scaffolding test files. Analyze code for test coverage and implement strategies validating hook implementation and predictable rendering behavior.

Can I use TypeScript to build and debug React hooks?

Yes, you can use TypeScript to build and debug React hooks. Assisted component scaffolding and hook implementation ensure proper type coverage and help diagnose common state update or rendering issues during development.

Why does my React component have unpredictable rendering behavior?

Unpredictable rendering behavior in React components stems from improper state management or hook dependencies. Analyze code for pattern violations, implement colocation, and use Redux Toolkit to ensure predictable state updates.