Domains
Forms
Mechanism
Breaks down how the skill works and what it produces, so you can quickly judge whether it fits your scenario and value.
When upgrading React apps to newer versions, migrating class components to hooks, or adopting React 18+ concurrent features (Suspense, transitions, automatic batching).
details.md for extended pattern libraryA modernized React codebase using functional components, hooks, and concurrent features with improved performance and maintainability.
Use Cases
A team maintains a React 16 class-component-heavy SPA and plans to upgrade to React 18 for better performance. Using this skill, they follow the version path guide, apply class-to-hooks migration patterns, and adopt the new root API and concurrent features. The skill reduces upgrade risk and delivers a modernized, faster application.
A developer needs to convert a large class-based component with lifecycle methods and HOCs into functional components with hooks. The skill provides side-by-side before/after examples for state, effects, context, and HOCs, enabling a systematic, low-error refactor that improves readability and testability.
Skill Relationships
Dependency relationships read as "the upper tier points to the lower tier." The current Skill sits in the middle tier — above are Skills that depend on it, below are Skills it depends on.
Tier 1 · These Skills Use Me
Tier 2 · Current Skill
Tier 3 · I Use These Skills
Browse this skill's relationships within its skillset. Click a node to switch the side panel; use the search box to jump to any skill.
Skill File