Strangler Migration Slice

Ship a new data grid behind a feature flag while legacy UI keeps running.

Architecture drill

A Vue 2 admin table must be replaced with React incrementally. Leadership wants zero big-bang release.

Where do you draw the migration boundary first?

~/playground — 05-strangler-migration · edit LegacyShell.jsx

Live

editing useFeatureFlag.js⌘↵ run tests

import { useState, useEffect } from 'react'

export function useFeatureFlag(key) {
  // TODO: implement flag lookup
  return false
}

Preview goal: Click Enable new grid — list shows Alpha/Beta rows; disable shows legacy table.