Is TypeScript migration included in this skill?

Yes, the skill includes patterns and checklists for converting JavaScript React components to TypeScript with proper interface definitions and generic component support.

How does it handle breaking changes between React versions?

The skill provides a detailed version upgrade path covering breaking changes in event delegation, JSX transforms, and Strict Mode behavior for versions 16, 17, and 18.

Does it support React 18 concurrent features?

Absolutely. It provides implementation patterns for React 18's new root API, automatic batching, Transitions, and Suspense for data fetching.

Can I use custom codemods with this skill?

Yes, it includes examples and scripts for using jscodeshift to apply both standard React codemods and custom transformation logic to your codebase.

Can this skill automate the migration from class components to hooks?

Yes, it includes guidance and codemod configurations to help automate the conversion of state and lifecycle methods to functional hooks using jscodeshift.

React Modernization

Name: React Modernization
Author: HermeticOrmus

byHermeticOrmus

개발자 도구

Upgrades React applications to the latest versions, migrates class components to functional hooks, and implements modern concurrent features.

소개

This skill facilitates the seamless modernization of React codebases by providing automated and guided transitions from legacy class-based architectures to modern functional components with hooks. It covers essential upgrade paths for React 17 and 18, helps implement performance-enhancing concurrent features like Suspense and Transitions, and utilizes codemods to automate repetitive refactoring tasks. Whether you are addressing technical debt, improving performance with automatic batching, or migrating a JavaScript project to TypeScript, this skill offers the patterns, checklists, and scripts necessary for a robust architectural evolution.

주요 기능

Integration with jscodeshift for automated codemod execution
0 GitHub stars
Step-by-step React 17 and 18 version upgrade paths
Implementation of React 18 concurrent features and Suspense
TypeScript migration patterns and performance optimization guides
Automated class-to-hooks component migration patterns

사용 사례

Migrating a vanilla JavaScript React project to a type-safe TypeScript architecture
Upgrading a legacy React 16 application to React 18 for performance gains
Converting a large codebase from class components to modern functional hooks

소개

주요 기능

Integration with jscodeshift for automated codemod execution
0 GitHub stars
Step-by-step React 17 and 18 version upgrade paths
Implementation of React 18 concurrent features and Suspense
TypeScript migration patterns and performance optimization guides
Automated class-to-hooks component migration patterns

사용 사례

Migrating a vanilla JavaScript React project to a type-safe TypeScript architecture
Upgrading a legacy React 16 application to React 18 for performance gains
Converting a large codebase from class components to modern functional hooks