Skip to content
Back to skills

2296 Complex Refactoring 1e1eda78

ASecurity

``` "Refactor all class components to functional components:

  • 9 stars
  • 0 votes
  • 0 copies
  • 0 views
  • Added October 11, 2026
developmenttypescriptrefactoringapi

Works with

  • cli
  • api

Security analysis

A100/100

Scanned October 11, 2026

npx -y skills add tools-only/X-Skills --skill 2296-complex-refactoring_1e1eda78 --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of 2296 Complex Refactoring 1e1eda78?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for 2296 Complex Refactoring 1e1eda78
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/tools-only-2296-complex-refactoring-1e1eda78/badge)](https://www.skillsdirectory.com/skills/tools-only-2296-complex-refactoring-1e1eda78)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

SKILL.md
# Complex Refactoring

## Complex Refactoring

### Pattern Transformation
```
"Refactor all class components to functional components:

For each file matching components/*.tsx:
1. Convert class to function
2. Convert this.state to useState
3. Convert lifecycle methods to useEffect
4. Convert methods to functions/hooks
5. Update prop types
6. Add proper TypeScript types

Start with @components/Dashboard.tsx as example"
```

### Architecture Migration
```
"Migrate from Redux to Zustand:

Phase 1 - Create new stores:
- stores/useUserStore.ts (from redux/userSlice.ts)
- stores/useCartStore.ts (from redux/cartSlice.ts)
- stores/useSettingsStore.ts (from redux/settingsSlice.ts)

Phase 2 - Update consumers:
- Replace useSelector with store hooks
- Replace useDispatch with store actions
- Update all components using Redux

Phase 3 - Cleanup:
- Remove Redux dependencies
- Delete old slice files
- Update package.json"
```

### API Version Migration
```
"Migrate from REST to tRPC:

1. Create tRPC router:
   - server/trpc/routers/user.ts
   - server/trpc/routers/product.ts
   - server/trpc/routers/order.ts

2. Combine in server/trpc/root.ts

3. Create tRPC client:
   - lib/trpc.ts
   - Update next.config.js for tRPC

4. Migrate each API consumer:
   - hooks/useUsers.ts → use tRPC
   - hooks/useProducts.ts → use tRPC

5. Remove old:
   - api/users/route.ts → delete
   - lib/api-client.ts → deprecate"
```

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…

Newsletter

Get the weekly list of safe new skills, and the ones we pulled.