diff --git a/shows/806 - The King of Drag and Drop Alex Reardon.md b/shows/806 - The King of Drag and Drop Alex Reardon.md new file mode 100644 index 000000000..842c53710 --- /dev/null +++ b/shows/806 - The King of Drag and Drop Alex Reardon.md @@ -0,0 +1,63 @@ +--- +number: 806 +title: "The King of Drag and Drop: Alex Reardon" +date: 1723183200000 +url: https://traffic.libsyn.com/syntax/Syntax_806_final.mp3 +youtube_url: https://www.youtube.com/watch?v=CjGn0HahbDE +guest: + name: Alex Reardon + github: alexreardon + twitter: alexandereardon + of: Atlassian + url: https://www.atlassian.com + # A single social Link: + social: https://www.linkedin.com/in/alexreardon +--- + +Scott and Wes talk with Alex Reardon from Atlassian about developing drag-and-drop libraries, specifically the challenges with creating efficient and accessible drag-and-drop functionalities for the web. They also explore what it takes to build and implement a system that works seamlessly across various frameworks. + +### Show Notes + +* **[00:00](#t=00:00)** Welcome to Syntax! +* **[01:18](#t=01:18)** Brought to you by [Sentry.io](https://sentry.io/syntax). +* **[01:51](#t=01:51)** What Alex does at [Atlassian](https://www.atlassian.com/) + * [react-beautiful-dnd](https://github.com/atlassian/react-beautiful-dnd) + * [Pragmatic drag and drop](https://atlassian.design/components/pragmatic-drag-and-drop/core-package/) +* **[04:38](#t=04:38)** What makes drag and drop tricky. +* **[06:38](#t=06:38)** Use-cases. +* **[10:54](#t=10:54)** What security is in place? +* **[12:30](#t=12:30)** How to make it feel native. +* **[19:20](#t=19:20)** Is the drag and drop spec ongoing? +* **[20:03](#t=20:03)** How do you build this headless? +* **[21:33](#t=21:33)** How does drag and drop work with frameworks? +* **[23:48](#t=23:48)** Making drag and drop feel the same across mobile and desktop. +* **[26:09](#t=26:09)** What's the key to really good drag performance? +* **[29:58](#t=29:58)** How do you make drag and drop accessible? +* **[34:57](#t=34:57)** Pragmatic drag and drop code vs application code. + * [Shoelace](https://shoelace.style/) + * [shadcn](https://shadcn.com/) +* **[40:00](#t=40:00)** How does testing work? + * [Playwright](https://playwright.dev/) + * [Cypress](https://www.cypress.io/) +* **[43:15](#t=00:00)** Internal adoption at Atlassian. +* **[44:27](#t=00:00)** Working on high-impact projects. +* **[49:15](#t=00:00)** Versioning and internal adoption at Atlassian. +* **[51:29](#t=00:00)** Sick Picks + Shameless Plugs. + +### Sick Picks + +- Alex: Coffee, [James Hoffmann YouTube Channel](https://www.youtube.com/@jameshoffmann). + +### Shameless Plugs + +- Alex: [Dom Events](https://domevents.dev/). + +### Hit us up on Socials! + +Syntax: [X](https://twitter.com/syntaxfm) [Instagram](https://www.instagram.com/syntax_fm/) [Tiktok](https://www.tiktok.com/@syntaxfm) [LinkedIn](https://www.linkedin.com/company/96077407/admin/feed/posts/) [Threads](https://www.threads.net/@syntax_fm) + +Wes: [X](https://twitter.com/wesbos) [Instagram](https://www.instagram.com/wesbos/) [Tiktok](https://www.tiktok.com/@wesbos) [LinkedIn](https://www.linkedin.com/in/wesbos/) [Threads](https://www.threads.net/@wesbos) + +Scott: [X](https://twitter.com/stolinski) [Instagram](https://www.instagram.com/stolinski/) [Tiktok](https://www.tiktok.com/@stolinski) [LinkedIn](https://www.linkedin.com/in/stolinski/) [Threads](https://www.threads.net/@stolinski) + +Randy: [X](https://twitter.com/randyrektor) [Instagram](https://www.instagram.com/randyrektor/) [YouTube](https://www.youtube.com/@randyrektor) [Threads](https://www.threads.net/@randyrektor)