Skip to main content

πŸ”§ Refactor Mode

Available anytime during your journey

Your code works, but it's getting messy. Refactor mode helps you clean up and improve your existing code without changing what it doesβ€”just how it's organized.

Purpose​

In Refactor mode, OneMillion Code acts as a code reviewer. It will:

  • Identify code that could be cleaner
  • Suggest better names for variables and functions
  • Extract repeated code into reusable functions or components
  • Improve readability without changing behavior

When to Use This Mode​

Use Refactor mode when:

  • Your code works but feels messy
  • You're copy-pasting the same code in multiple places
  • Variable names don't make sense anymore
  • A file is getting too long
  • You want to clean up before moving to the next step

Available Tools​

ToolPurpose
readReview code to find improvement opportunities
editReorganize and clean up code
commandRun tests to verify nothing broke

Example Prompts​

General Cleanup​

Review my src/components folder. What could be cleaner?

Naming Improvements​

Some of my variable names are confusing.
Help me rename things to be more descriptive.

Extracting Components​

My Home page component is 300 lines long.
Help me break it into smaller components.

Removing Duplication​

I'm using the same fetch logic in three different files.
Help me extract it into a shared utility.

Improving Readability​

This function works but I can't tell what it does
from reading it. Help me make it clearer.

What Refactoring Is (and Isn't)​

Refactoring IS:​

  • Making code easier to read
  • Reducing duplication
  • Improving names
  • Organizing files better
  • Breaking large functions into smaller ones

Refactoring IS NOT:​

  • Adding new features
  • Fixing bugs (use Debug mode)
  • Changing what the code does
  • Rewriting from scratch

The Refactoring Process​

1. Identify the Mess​

Ask OneMillion Code to review your code:

Look at my project and tell me what's messy.
What would you clean up first?

2. Make One Change at a Time​

Don't refactor everything at once. Pick one improvement:

Let's start by extracting the shared fetch logic
into a utility function.

3. Verify It Still Works​

After each change, make sure nothing broke:

Run the app and test the features we changed.
Does everything still work?

4. Repeat​

Pick the next improvement and repeat.

Common Refactoring Patterns​

Extract Component​

Before: One giant component with 200+ lines. After: Several small components, each doing one thing.

Extract Function​

Before: The same 10 lines repeated in 3 places. After: One function called from 3 places.

Rename for Clarity​

Before: const d = new Date(); and const x = getData(); After: const createdAt = new Date(); and const userProfile = getUserProfile();

Organize Files​

Before: All 20 components in one folder. After: Grouped by feature: components/auth/, components/dashboard/, etc.

When to Move On​

Return to your previous mode when:

  • The code is cleaner and easier to understand
  • You've removed obvious duplication
  • Files are a reasonable size
  • Names make sense

Don't aim for perfection. Aim for "better than before."

Switching to Refactor Mode​

When your code needs cleanup:

Slash command: /refactor

Or say: "This code is getting messy. Help me clean it up."



Video Coming Soon

A walkthrough video for Refactor mode is in production. Check back soon or join our Discord for updates.