This example below uses the react-beautiful-dnd
module which allows vertical or horizontal lists to be reordered by dragging and dropping. It also allows multiple columns to be reordered. This example sends a dummy post of the ID's to /api/hello
to demonstrate how to send data to an API. It also saves and loads the state with localStorage
Verdict: This module is good, but it doesn't support grid layouts. A major stumbling block in my opinion, so next up we are going to look at dnd-kit
This example below uses the dnd-kit
module, as in the previous example I cam also saving the state to localStorage, as well as passing the ID's over to the dummy API end point. This module supports responsive grid layouts.
Verdict: For my use cases I prefer this module, most of my lists I want to create will be grids, and I also prefer the syntax used to create the lists. It also has a lot of other features that I haven't explored yet, but I will be using this module in the future.