In this tutorial, we will learn how to make a re-orderable drag and drop list in React using react-beautiful-dnd. react-beautiful-dnd is a React library for creating drag and drop lists, built by Atlassian.
react-beautiful-dnd is a React library for creating drag and drop lists, built by Atlassian. This library has many great characteristics:
Another popular React drag and drop library is react-dnd.
react-beautiful-dnd is much simpler than
react-dnd, however has some limitations and is primarily designed for drag and drop with vertical and horizontal lists.
In this blog, we are going to focus on
react-beautiful-dnd — how to set it up, some details about the API, and finally how to implement a re-orderable list.