Premium

Transfer List (Move Selected Items Between Two Lists)

By FrontendAtlas Team · Updated Jan 30, 2026

This UI should keep item order stable, clear selection after transfer, and avoid no-op actions when nothing is selected. Concepts: vue, components, reactivity, derived state, event handlers, lists, inputs. Vue focus: manage selection with reactive arrays and computed helpers. Framework focus: Vue SFC patterns, ref/reactive…

  • Render two lists: Top and Bottom.
  • Each row must have a checkbox to select the item.

Challenge preview

Transfer List (Move Selected Items Between Two Lists): This UI should keep item order stable, clear selection after transfer, and avoid no-op actions when nothing is selected. Concepts: vue, components, reactivity, derived…. Expect vue and components decisions under intermediate level constraints.

Premium unlocks

  • Full editor workflow with starter files, tests, and solution context.
  • Edge cases, common mistakes, and complexity notes for the interview discussion.
  • Progress tracking once you unlock and complete the challenge.

Free warm-up options

Upgrade to FrontendAtlas Premium to unlock this challenge. Already upgraded? Sign in to continue.