What is react-beautiful-dnd?
There are a lot of libraries out there that allow for drag and drop interactions within React. Most notable of these is the amazing react-dnd. It does an incredible job at providing a great set of drag and drop primitives which work especially well with the wildly inconsistent html5 drag and drop feature. react-beautiful-dnd is a higher level abstraction specifically built for vertical and horizontal lists. Within that subset of functionality react-beautiful-dnd offers a powerful, natural and beautiful drag and drop experience. However, it does not provide the breadth of functionality offered by react-dnd.
react-beautiful-dnd is a tool in the JavaScript Framework Components category of a tech stack.
react-beautiful-dnd is an open source tool with 32.2K GitHub stars and 2.5K GitHub forks. Hereโs a link to react-beautiful-dnd's open source repository on GitHub
Who uses react-beautiful-dnd?
Companies
10 companies reportedly use react-beautiful-dnd in their tech stacks, including Captiv8 Javascript, Tech Stack, and Motu Client.
Developers
77 developers on StackShare have stated that they use react-beautiful-dnd.
react-beautiful-dnd Integrations
react-beautiful-dnd's Features
- Beautiful, natural movement of items
- Clean and powerful api which is simple to get started with
- Plays extremely well with standard browser interactions
- Unopinionated styling
- No creation of additional wrapper dom nodes - flexbox and focus management friendly!
- Accessible โฟ๏ธ๐
react-beautiful-dnd Alternatives & Comparisons
What are some alternatives to react-beautiful-dnd?
React Router
React Router is a complete routing solution designed specifically for React.js. It painlessly synchronizes the components of your application with the URL, with first-class support for nesting, transitions, and server side rendering.
styled-components
Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress ๐
Storybook
It is an open source tool for developing UI components in isolation for React, Vue, and Angular. It makes building stunning UIs organized and efficient.
Ant Design
An enterprise-class UI design language and React-based implementation. Graceful UI components out of the box, base on React Component. A npm + webpack + babel + dora + dva development framework.
Angular CLI
A command-line interface tool that you use to initialize, develop, scaffold, and maintain Angular applications. You can use the tool directly in a command shell, or indirectly through an interactive UI such as Angular Console.
