skills.rest
lyq-lin
lyq-linCOMMUNITY
Explore all skills by this author →
GitHub

react

Build React 18+ components with TypeScript, hooks, and state management.

Updated Oct 26, 2025
Search Tags:#typescript#react#hooks#debug#component-patterns
One-click install
npx skills add https://github.com/lyq-lin/YCode.CLI --skill react-lyq-lin
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react
Source: https://github.com/lyq-lin/YCode.CLI/tree/main/YCode.CLI/skills/react
Command: npx skills add https://github.com/lyq-lin/YCode.CLI --skill react-lyq-lin

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill consolidates modern React 18+ patterns with TypeScript, hooks, state management, and performance optimization to help you build, debug, and review React components faster, while reducing boilerplate and cognitive load.

Core Features & Use Cases

  • Component Patterns: Functional components, props destructuring, and composition over props drilling to keep code modular and maintainable.
  • Hooks Best Practices: Effective use of useState, useEffect, useMemo, useCallback, and custom hooks for clearer, more predictable components.
  • Architecture Guidance: State management strategies, TS typing practices, and reusable UI patterns to accelerate frontend work.

Quick Start

Create a small React component in TypeScript that uses functional components, destructures props, and memoizes an expensive calculation.