dnd-kit
The modern, lightweight, performant, accessible and extensible drag & drop toolkit for React. (by clauderic)
react-beautiful-dnd
Beautiful and accessible drag and drop for lists with React (by atlassian)
Our great sponsors
| dnd-kit | react-beautiful-dnd | |
|---|---|---|
| 41 | 69 | |
| 11,281 | 32,363 | |
| - | 1.1% | |
| 4.9 | 0.6 | |
| 23 days ago | 3 days ago | |
| TypeScript | JavaScript | |
| MIT License | GNU General Public License v3.0 or later |
The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
dnd-kit
Posts with mentions or reviews of dnd-kit.
We have used some of these posts to build our list of alternatives
and similar projects. The last one was on 2024-04-10.
-
Best Next.js Libraries and Tools in 2024
Link: https://dndkit.com/
-
Curious case of Drag and Drop
dnd-kit is one of the newest ones, it is modern, light-weight, and performant.
-
React Ecosystem in 2024
Website: DND Kit
-
Show HN: An open source visual editor for React
Yup that's the one. Also recommend checking out [dnd-kit](https://dndkit.com), which we may migrate to at a later date.
- 🎲 Dice Merge - ReactJS
-
Technology behind figma/godaddy/google site
You can drag and drop things in pure assembly by using native browsers APIs or using a library like https://dndkit.com/.
-
🎉Top React Libraries for Developers
DND Kit is a React library for building complex drag-and-drop web applications. It provides a set of APIs for handling drag-and-drop interactions, making it easier to build custom drag-and-drop.
-
React Beginner with question!
you can check https://dndkit.com for the drag and drop.
-
Libraries for nested drag and drop
Dnd kit: https://dndkit.com/
- How do you implement drag-select using React-DnD?
react-beautiful-dnd
Posts with mentions or reviews of react-beautiful-dnd.
We have used some of these posts to build our list of alternatives
and similar projects. The last one was on 2024-04-04.
-
Use React.js with Laravel. Build a Tasklist app
For this full-stack single-page app, you'll use Vite.js as your frontend build tool and the react-beautiful-dnd package for draggable items.
-
The 5 Most Important Features on phived.com
A huge win for the user experience using react-beautiful-dnd.
-
Curious case of Drag and Drop
react-beautiful-dnd stands out as the most commonly used, it provides a clean and high-level API with a lot of abstraction. It was developed by Atlassian.
- How can we create drag and drop like bento.me in react js ?
-
Free tools for frontend
Drag-and-drop library for React with beautiful animations. Website - GitHub
-
Is there a react library that allows you to do this? I made the one in the video but I dont know if it's any good
This library is very cool and pretty simple to use : https://github.com/atlassian/react-beautiful-dnd
-
I made a website builder that works like Notion
Not sure if OP used these but here are few suggestions: For drag drop: https://www.npmjs.com/package/react-beautiful-dnd For resizing with handles: https://www.npmjs.com/package/react-resizable
-
Trying to create drag and drop functionality with React from plain JS code
https://github.com/react-dnd/react-dnd https://github.com/atlassian/react-beautiful-dnd
-
How do you implement drag-select using React-DnD?
You can try react-beautiful-dnd, it's amazingly simple, I actually switched from react-dnd a couple months ago to react-beautiful-dnd, and it was easy af.
-
How to Drag and Drop in React
Building a good D&D library, especially one that is accessible, is difficult. Keep that in mind if you decide to roll your own D&D or any other UI component for that matter.
What are some alternatives?
When comparing dnd-kit and react-beautiful-dnd you can also consider the following projects:
react-dnd - Drag and Drop for React
framer/motion - Open source, production-ready animation and gesture library for React
react-dropzone - Simple HTML5 drag-drop zone with React.js.
react-sortable-hoc - A set of higher-order components to turn any list into an animated, accessible and touch-friendly sortable list✌️
react-grid-layout - A draggable and resizable grid layout with responsive breakpoints, for React.
react-smooth-dnd - react wrapper components for smooth-dnd
nested-dnd - Proof of concept for doing a nested drag and drop in React
svelte-dnd-action - An action based drag and drop container for Svelte
react-draggable - React draggable component
react-sortablejs - React bindings for SortableJS
dnd-kit vs react-dnd
react-beautiful-dnd vs react-dnd
dnd-kit vs framer/motion
react-beautiful-dnd vs react-dropzone
dnd-kit vs react-sortable-hoc
react-beautiful-dnd vs react-grid-layout
dnd-kit vs react-smooth-dnd
react-beautiful-dnd vs nested-dnd
dnd-kit vs svelte-dnd-action
react-beautiful-dnd vs react-draggable
dnd-kit vs react-sortablejs
react-beautiful-dnd vs framer/motion