React Drag And Drop (dnd-kit) | Beginners Tutorial

Veröffentlicht am: 18 Januar 2024
auf dem Kanal: Code Complete

45,083

1.2k

This tutorial is designed for beginners looking to integrate drag-and-drop functionality into a React project using dnd-kit. The focus is on creating a practical to-do list application, where users can add tasks and easily reorder them through drag-and-drop actions. The step-by-step guide covers the implementation of drag-and-drop interactions in a straightforward manner, with a specific emphasis on touch screen support to ensure compatibility across various devices. By following this tutorial, you'll gain a practical understanding of incorporating these features into your React applications.

Discord - / discord
Subscribe - / @code_complete
☕ Donate to support the channel! - https://www.buymeacoffee.com/CodeComp...

-- 🌟 Useful Tools and Software 🌟 --
🌐 10% off domains at Domain.com (use code DOMAIN10) - https://domain.mno8.net/CodeComplete
☁️ FREE $100 for server hosting on Linode - https://linode.gvw92c.net/CodeComplete
📚 30% off annual Skillshare membership (use code annual30aff) - https://skillshare.eqcm.net/CodeComplete

-- 🔗 Links 🔗 --
💻 Code - https://github.com/CodeCompleteYT/rea...

DISCLAIMER: Some of the links in the description are affiliate links. The channel will receive a small commission from any sales from these links, but there is no extra charge to you. Thanks for supporting the channel so I can keep making these free tutorials!

Chapters:
00:00 Introduction
00:16 Libraries comparison
01:05 dnd-kit setup
03:24 Column component (droppable area)
06:08 Task component (draggable item)
09:46 Position calculation function
12:31 Touch + Keyboard controls
14:00 Input + Add Task
16:55 Conclusion

Auf dieser Seite können Sie das Online-Video React Drag And Drop (dnd-kit) | Beginners Tutorial mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Code Complete 18 Januar 2024 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 45,083 Mal angesehen und es wurde von 1.2 tausend den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!