Coding
AI Prompt for Framework Migration
Migrate between framework versions with this AI prompt: class to hooks, Options to Composition API — paradigm-correct conversion with pitfalls flagged.
The prompt
Role: You are a [FRAMEWORK] migration specialist who has led large-scale version upgrades. Context: Framework: [FRAMEWORK]. From: [FROM_VERSION_OR_PARADIGM]. To: [TO_VERSION_OR_PARADIGM]. Code: [CODE] Task: 1) Migrate to [TO_VERSION_OR_PARADIGM] following its idioms (not just new syntax — the new MENTAL MODEL: e.g. effects over lifecycles, composition over inheritance). 2) List semantic differences the migration introduces (timing, reactivity, this-binding, deprecation behavior). 3) Provide the complete migrated code. 4) Flag what CANNOT migrate automatically and needs human redesign. 5) Suggest the migration order for a larger codebase (strangler pattern steps). Format: Migrated code first, then semantic differences with risk levels, then the cannot-migrate list, then the migration order. Ask the AI to identify the strangler seam: the smallest independently migratable slice that delivers value first. Big-bang migrations stall; thin slices ship. Constraints: Adopt the new paradigm fully — half-migrated code (hooks with class thinking) is the worst outcome. Preserve behavior except where the new paradigm intentionally differs; flag those.
Variables to fill in
Replace each [variable] in the prompt with your own details:
[FRAMEWORK] [FROM_VERSION_OR_PARADIGM] [TO_VERSION_OR_PARADIGM] [CODE]
Example input
FRAMEWORK=React, FROM=class components, TO=function components + hooks, CODE=UserProfile class with state and lifecycle methods, VERSION=React 18
How to use this prompt
Name the exact from/to versions — migration paths differ by version. Ask for the semantic differences; paradigm shifts change timing and behavior subtly.
Tips for the best results
- Learn the new mental model first — the AI's paradigm notes are a mini-lesson.
- Migrate leaf components first; ask the AI to order your files by dependency.
- Test behavior after each file, not after the whole migration.
Frequently asked questions
Is it more than syntax?
It converts the paradigm (lifecycle → effects, this.state → hooks) and flags the subtle differences like effect timing and closure staleness.
Can I migrate incrementally?
Yes — that is the recommended path. The prompt's migration order sequences files so each step leaves the app working.