Beautiful and Accessible Drag and Drop with react-beautiful-dnd

reactReact
^16.0.0
ClockIcon63m
Alex Reardon
By

Alex Reardon

A JavaScript enthusiast and perpetual tinkerer (that is a word right?). I am a principal front-end engineer at Atlassian and the author of react-beautiful-dnd. I am super keen on making software that is a delight to use and develop on

About the Course

Drag and drop (dnd) experiences are often built to sort lists of content vertically and horizontally.

react-beautiful-dnd is an excellent tool for these use cases. It utilizes the render props pattern to build accessible dnd functionality into lists that look and behave as you would expect—and you’ll even get keyboard-accessible dnd, straight out of the box, with no extra work required. It’s actually easy to start using, and this course is a great place to start.

We will create a highly interactive task management application from scratch using the building blocks of react-beautiful-dnd. Over 14 lessons, you will get practice in:

  • building droppable containers to sort draggable items horizontally and vertically
  • moving items between columns
  • and even moving the columns themselves

Following the course, you’ll be ready to build powerful dnd experiences into your own projects.