How does this skill handle JavaScript to TypeScript conversion?

The skill uses a multi-step process: renaming files to .ts, then utilizing AI to analyze the code and generate proper interfaces, types, and return signatures while maintaining original functionality.

Can I use this for large-scale renaming across a project?

Yes, it combines ripgrep for previewing, AI for planning the order of changes, and jscodeshift for AST-safe execution to ensure renames don't break the codebase.

Is the refactoring process safe for production code?

The skill follows a 'Safe Refactoring Workflow' that prioritizes test coverage, small incremental changes, and verification steps to ensure behavior remains consistent.

What tools are required to use this skill?

It relies on Gemini for AI analysis, and standard developer tools like jscodeshift, typescript, and ripgrep for execution and analysis.

Does it support modern React patterns?

Specifically, yes. It includes tailored logic for converting Class-based components into Functional components, including state-to-useState and lifecycle-to-useEffect mapping.

AI Code Refactor & Modernization

Name: AI Code Refactor & Modernization
Author: johnlindquist

byjohnlindquist

•

開発者ツール

Automates code modernization, type conversions, and architectural refactoring using AI and AST-based tools.

This skill provides a systematic framework for improving code quality and reducing technical debt without altering external behavior. It leverages AI models alongside AST-safe tools like jscodeshift to handle complex migrations, such as converting JavaScript to TypeScript, transitioning React Class components to Hooks, and identifying deep-seated code smells. By integrating safety-first workflows—including test coverage verification and incremental commits—it allows developers to modernize legacy codebases with confidence and precision.

主な機能

01Migration of legacy React Class components to modern Functional components and Hooks

02Automated JavaScript to TypeScript conversion with intelligent type inference

03Step-by-step safe refactoring workflows with rollback strategies

04AI-driven complexity analysis to identify duplication and nesting issues

0518 GitHub stars

06AST-safe systematic renaming and structural code transformations

ユースケース

01Modernizing a React codebase by converting complex classes to functional components

02Migrating a legacy JavaScript project to a type-safe TypeScript environment

03Identifying and simplifying overly complex functions to improve maintainability

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add johnlindquist/claude refactor

For use in Claude.ai and ChatGPT

Download Skill