Reorder Columns with react-beautiful-dnd

In this lesson, we will be applying a collection of learned techniques to enable reordering of the columns in our application.

To achieve this, you will wrap the Columns in a single <Droppable /> component, ordered on the horizontal plane, and enhance the Columns to become draggable. You’ll see that wiring up Columns for re-ordering is very similar to what you experienced with tasks. We will be using nested <Draggable /> and <Droppable /> components and the Droppable type prop to achieve column reordering.