skills.rest
rileyhilliard
rileyhilliardCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

refactoring-code

Refactor React/TypeScript code incrementally with behavior-driven tests.

127|19|Updated Oct 23, 2025
Search Tags:#typescript#react#quality#refactor#pattern#code#tests
One-click install
npx skills add https://github.com/rileyhilliard/claude-essentials --skill refactoring-code-rileyhilliard
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: refactoring-code
Source: https://github.com/rileyhilliard/claude-essentials/tree/main/plugins/ce/skills/refactoring-code
Command: npx skills add https://github.com/rileyhilliard/claude-essentials --skill refactoring-code-rileyhilliard

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Refactoring often risks changing behavior or introducing regressions. This Skill guides you to restructure code while preserving functionality, backed by behavior-driven tests and incremental steps.

Core Features & Use Cases

  • Safe, incremental refactoring with tests that verify behavior rather than implementation details.
  • Guidance to identify issues (duplication, complexity, poor naming) and plan targeted improvements.
  • Use Case: Clean up a large module with duplicated logic and unclear responsibilities, then verify no behavioral changes.

Quick Start

Start by understanding current behavior and ensure behavior-driven tests exist before beginning refactoring.

Frequently Asked Questions about refactoring-code

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I refactor TypeScript and React code without changing behavior?▼

Refactor TypeScript and React code safely by using incremental, behavior-driven changes guided by clear tests. This approach restructures code while preserving external interfaces and preventing regressions, following documented React and TypeScript refactoring patterns.

Do I need behavior-driven tests before refactoring a module?▼

Yes, behavior-driven tests are required before refactoring a module. You must understand current behavior and ensure tests verify functionality rather than implementation details to safely reduce duplication and complexity without introducing regressions.

What is the best way to reduce code duplication in a large module?▼

The best way to reduce code duplication in a large module is through phased refactoring with incremental changes. Identify issues like duplication and poor naming, plan targeted improvements, and verify no behavioral changes occur using existing behavioral tests.

Can I restructure React components without breaking external interfaces?▼

Yes, you can restructure React components without breaking external interfaces. This approach preserves external APIs while internal logic is refactored incrementally, ensuring the component's behavior and contract remain unchanged throughout the process.

What patterns should I follow when refactoring TypeScript code?▼

Follow React and TypeScript refactoring patterns documented in the skill's references. These patterns guide incremental changes, complexity reduction, and behavior preservation to ensure safe code restructuring without altering functionality.

Related Skills

Explore More Software Engineering Skills→
Intense-VisionsIntense-Visions
18

harness-refactoring

Refactor code with constraint verification and harness checks at each step.

Official
Advanced
SebastienDegodezSebastienDegodez
8

test-refactoring-catalog

Refactor Python test code while preserving behavioral coverage.

Community
Advanced
timmo001timmo001
5

fallow

Detects dead code, duplication, and complexity issues in JavaScript and TypeScript projects.

Community
Advanced
jikimejikime
5

jikime-migration-ast-grep

Search and rewrite code using AST patterns for legacy migrations.

Community
Advanced