Agent skill · software engineering · wshobson
react-modernization
Upgrade React applications to latest versions, migrate from class components to hooks, and adopt concurrent features. Use when modernizing React codebases, migrating to React Hooks, or upgrading to latest React versions.
Why this skill is useful
Provides specific codemods and patterns for migrating React applications to modern practices that the AI wouldn't reliably generate on its own.
What it needs
About 3k tokens when loaded. Last updated 2026-08-05. 38,570 stars on the source repository.
What this skill does
React Modernization Master React version upgrades, class to hooks migration, concurrent features adoption, and codemods for automated transformation. When to Use This Skill Upgrading React applications to latest versions Migrating class components to functional components with hooks Adopting concurrent React features (Suspense, transitions) Applying codemods for automated refactoring Modernizing state management patterns Updating to TypeScript Improving performance with React 18+ features Version Upgrade Path React 16 → 17 → 18 Breaking Changes by Version: React 17: Event delegation changes No event pooling Effect cleanup timing JSX transform (no React import needed) React 18: Automatic batching Concurrent rendering Strict Mode changes (double invocation) New root API Suspense on server Class to Hooks Migration State Management Lifecycle Methods to Hooks Context and HOCs to Hooks React 18 Concurrent Features New Root API Automatic Batching Transitions Suspense for Data Fetching Additional patterns and templates More detailed templates and worked examples live in references/details.md. Read that file for the full pattern library.
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills wshobson/react-modernization