$
copilot --idea "Refactoring Marathon"
→
Tackle tech debt methodically — extract, rename, restructure, and modernise with confidence
The Problem
The codebase has a 500-line function called `processData`. Three nested callbacks that everyone is afraid to touch. A `utils.js` file with 47 unrelated functions. Class components in a React app that moved to hooks two years ago. The tech debt is real, and nobody wants to start because it feels overwhelming.
What You'll Build
A systematic refactoring workflow that:
- Identifies the highest-impact refactoring opportunities
- Executes changes safely with test verification at every step
- Modernises patterns incrementally without breaking anything
- Produces cleaner, faster, more maintainable code
Step-by-Step Walkthrough
Phase 1: Assess the Damage
$
"Analyse this codebase for technical debt:
- Functions longer than 50 lines
- Files with more than 10 imports
- Deeply nested code (> 4 levels)
- Duplicated code blocks
- Inconsistent naming conventions
- Deprecated API usage
Rank by impact: what would improve the codebase most if fixed?"
Phase 2: Extract & Simplify
Take the worst offender and break it apart:
$
"Refactor this 500-line processData function:
1. Extract each logical step into its own well-named function
2. Replace nested callbacks with async/await
3. Add JSDoc comments to each extracted function
4. Ensure all existing tests still pass after each change"
Run tests after EVERY extraction:
$
"Run the test suite. Did we break anything?"
Phase 3: Modernise Patterns
$
"Convert all class-based React components in src/components/ to functional components with hooks.
Preserve all behaviour exactly.
Replace componentDidMount with useEffect.
Replace this.state with useState.
Replace HOCs with custom hooks where possible.
Test each component after conversion."
$
"Replace all callback-style async code with async/await.
Update error handling from .catch() callbacks to try/catch blocks.
Ensure all promise rejections are handled."
Phase 4: Clean Up
$
"Break up utils.js into focused modules:
- string-utils.js for text manipulation
- date-utils.js for date/time helpers
- validation-utils.js for input validation
- format-utils.js for display formatting
Update all imports across the codebase.
Delete utils.js when everything is migrated."
Phase 5: Verify & Measure
$
"Run the full test suite and show the results.
Compare the code metrics before and after:
- Average function length
- Maximum nesting depth
- Number of files > 300 lines
- Duplicated code percentage
Generate a refactoring summary report."
Pro Tips
• NEVER refactor without tests. If there aren't tests, write them first (see Test Suite Generator)
• Run tests after every single change — not at the end
• Use the task agent for test runs — it keeps your context clean
• Commit after each successful refactoring step — you want to be able to roll back
• Small, atomic refactors are safer than big-bang rewrites
What You'll Learn
• Refactoring patterns (Extract Function, Replace Conditional, Introduce Parameter Object)
• Modern JavaScript/TypeScript patterns
• Safe refactoring with test verification
• Measuring and tracking code quality improvements