React DnD Example Simplified

Apr 13, 2015

I recently started playing around with React DnD to implement some drag and drop sorting on an app I’m working on. The examples provided are built using a lot of the new syntax in ES6, as well as having a good deal of what might be considered more proper structuring for a React app, so it was challenging for me to parse out the critical bits for React DnD to function. To further my own understanding, I stripped out all of the ES6 syntax and some of the non-essential code in order to get the most basic drag and drop implementation up and running. Check it out below, as well as the original example for reference. This was built in the context of a rails app with react-rails and rails-assets-react-dnd, though I think the code should work readily outside of the rails context.