The easiest way to skyrocket your YouTube subscribers
Get Free YouTube Subscribers, Views and Likes

Trello Clone with React Native: Drag u0026 Drop Sorting Animations

Follow
notJust․dev

This is the second part of our Trello Clone series, and in this video we're focusing on adding advanced features to our app, like Drag & Drop, animations and sorting. We'll go step by step into implementing dynamic animations using Reanimated and Gesture Handler that will make our local first app feel smooth and responsive, just like the real Trello! Let’s get to building

1⃣ Watch the first part here: https://youtube.com/live/WiXs0JbA3_k

✅ Project Page: https://www.notjust.dev/projects/trello
Source Code: https://github.com/notJustdev/Trello...

❗Try our FREE 2day Masterclass on notJust.Academy: https://assets.notjust.dev/masterclas...

This video includes a lot of tools and technologies, providing an excellent opportunity to learn about:
Enhancing UI/UX with Animations
Animations using Reanimated and Gesture Handler
Implementing Drag & Drop Functionality for Boards and Cards
Sorting data in a Flatlist
Integrating Advanced Features with Realm
Debugging Common Issues with Interactive Elements
Future Updates and Feature Additions

Enroll NOW in The FullStack Mobile Developer course and don’t miss out on your chance to become a 6figure dev! Check out what our successful students are saying about their experience:
https://academy.notjust.dev/?utm_sour...

Have an idea for a future tutorial? Share it on our Idea Board: https://github.com/orgs/notJustdev/d...

Join the notJust Development gang and let's build together:
Twitter:   / vadimnotjustdev  
Instagram:   / vadimnotjustdev  
Facebook:   / notjustdev  
LinkedIn:   / vadimsavin  
Discord:   / discord  

Timecodes:
0:00 Intro and Project Overview
3:14 Starting the Expo Project
4:29 Updating the Schema; Position field and Sorting
22:14 Implementing a Basic Drag & Drop function
1:04:31 Selecting the dragging item
1:25:25 Debugging the Animation, Setting Initial Drag Position
1:42:41 Moving items around when Draging
2:20:21 Reordering Items on Drag
3:16:04 Fixing Jumps on Item Drag
3:31:18 Implementing a Scrollable List
3:45:23 Outro

Disclaimer: This build is for educational purposes only. All views, opinions, and technology choices expressed in this video are my own and do not represent the views, opinions, or technology choices of any entity I have been, am now, or will be affiliated with.
#notjustdev #trello #reactnative

posted by Tsitselisgo