react-modernization

Migrating React class components to functional components with hooks involves converting state management, lifecycle methods, and context or HOC patterns into hook equivalents. This Skill provides clear before-and-after examples to guide the refactoring process.

Upgrading legacy React applications to React 18 requires navigating breaking changes and adopting new APIs. This Skill guides version upgrades from React 16 and 17, facilitating automated refactoring using codemods to ensure a smooth transition.

React 18 automatic batching groups multiple state updates into a single re-render, while Suspense handles data fetching by pausing component rendering until data resolves. This Skill explains and demonstrates these concurrent features.

Yes, you can automate refactoring during your React migration using codemods. This Skill offers commands to run jscodeshift, enabling automated application of codemods to efficiently upgrade versions and convert class components.

Adding TypeScript types to existing React components and props involves defining interfaces for component inputs and state. This Skill supports TypeScript migration to improve type safety across your modernized functional components.

Use useMemo and useCallback for React performance optimization to prevent unnecessary re-renders and expensive recalculations. This Skill details these hooks alongside code splitting to enhance application performance.