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.
81
71%
Does it follow best practices?
Impact
97%
1.03xAverage score across 3 eval scenarios
Advisory
Suggest reviewing before use
Optimize this skill with Tessl
npx tessl skill review --optimize ./plugins/framework-migration/skills/react-modernization/SKILL.mdClass to hooks migration with lifecycle cleanup and custom hooks
useState for state
100%
100%
useEffect for lifecycle
100%
100%
useEffect cleanup function
100%
100%
useEffect dependency array
100%
100%
useContext replaces HOC
100%
100%
Custom hook replaces HOC
100%
100%
useMemo for expensive calc
100%
100%
useCallback for handler
0%
100%
React.memo on list component
0%
0%
No class components
100%
100%
ActivityFeed cleanup
100%
100%
React 18 upgrade with createRoot, useTransition, and lazy Suspense
createRoot import
100%
100%
createRoot usage
100%
100%
No ReactDOM.render
100%
100%
useTransition import
100%
100%
startTransition for results
100%
100%
isPending indicator
100%
100%
lazy() for route components
100%
100%
Suspense wrapper
100%
100%
No eager admin imports
100%
100%
Migration notes accuracy
100%
100%
StrictMode preserved
100%
100%
Codemod automation with jscodeshift for React migration
jscodeshift used
100%
100%
rename-unsafe-lifecycles transform
100%
100%
update-react-imports transform
100%
100%
TypeScript parser flag
100%
100%
Dry run step
100%
100%
Dry run before apply
100%
100%
src/ directory targeted
100%
100%
Script comments
100%
100%
No manual edits
100%
100%
91fe43e
Table of Contents
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.