typescript-refactoring
TypeScript Refactoring
What This Skill Does
Use this skill to make code easier to understand, test, and change while preserving behavior unless the user explicitly asks for behavior changes.
This skill is especially helpful when the user says things like:
- "clean this up"
- "this component is doing too much"
- "this file is too big"
- "please untangle this"
- "reduce complexity without changing behavior"
- "make this easier to test"
- "how should I restructure this?"
Quick Start
- Identify the dominant smell before changing structure.
More from iamkhan21/skills
frontend-init
Standardizes an already-scaffolded frontend TypeScript web app with baseline tooling, structure, and conventions. Use when setting up or aligning pnpm + TypeScript strict + path aliases, Vitest, Oxc (oxlint/oxfmt), and a progressive FSD-style folder layout, or when the user asks about initial project rules and UI library choices.
9react-testing
Testing React components, hooks, and interactions with React Testing Library. Use when writing new tests, debugging failing tests, refactoring test code, setting up test infrastructure, mocking APIs in React tests, or when the user mentions Jest/Vitest with React, `render`, `screen`, `userEvent`, `waitFor`, `findBy`, MSW, or testing patterns. Also use when the user asks how to test a specific React component or hook, even if they don't mention "testing library" explicitly.
8refactoring
Apply systematic code refactoring with small steps, clear boundaries, and proven techniques. Use when improving existing code, reducing technical debt, cleaning up legacy code, or when user mentions refactoring, code cleanup, or code improvement.
5modern-ui-page
Creates modern full-page UI with strong visual direction while preserving accessibility and UX fundamentals. Use when the user asks for a landing page, marketing page, dashboard page, homepage, redesign, or to make a page feel more polished, modern, or premium.
1