React DnD - Drag and Drop

Übersicht und Architektur

• Warum ist Drag & Drop so komplex im Browser? 
• Die verschiedenen Drag und Drop Bibliotheken im Vergleich
• Dragular vs React DnD
• Die verschiedenen Backends (HTML5 vs JavaScript)

React DnD

• Installation von React DnD und des HTML5 Backends
• DnDProvider verwenden
• useDrag hook, ein Element draggable machen
• Collector Funktionen
• ItemTypes (was kann wohin gedroppt werden)
• Monitoring und CSS Manipulation von gedraggten Elementen und Vorschau Bilder (DragPreviewImage)
• useDrop hook, ein Element als Drop-Zone nutzen
• Komplexe Drag und Drop über mehrere Ebenen und mit mehreren verschiedenen Typen
• Handling und Speichern von Änderungen im React State und in Redux
• Testing mit ReactDnD
• Tipps und Tricks