Anissa  Barrows

Anissa Barrows

1625050440

How to drag and drop a div in react using hooks? (react-use-gesture + react-spring)

Live demo: https://bitesizeacademy.github.io/
The source code for this video: https://github.com/bitesizeacademy/react-drag-and-drop

In this video we look at how to drag and drop in react using the react-use-gesture and react-spring libraries. We take the introduction screen of create-react-app and add dragging to its components. We then add an overlay which can be dragged up and down to expose a background image behind it. We use the hooks: useDrag (from react-use-gesture) and useSpring (from react-spring).

My previous video about react-spring: How to animate mount and unmount of a react component using react-spring https://www.youtube.com/watch?v=kT6yYSwK1oA

https://react-spring.io/
https://use-gesture.netlify.app/
Background image by Adam Vradenburg @vradenburg https://unsplash.com/photos/_gu7E90QChU

#react #animate #javascript

#div #react

How to drag and drop a div in react using hooks? (react-use-gesture + react-spring)