Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Trello Clone with React Native: Drag & Drop, Sorting, Animations
Play lesson

React Native for beginners - Trello Clone with React Native: Drag & Drop, Sorting, Animations

5.0 (4)
42 learners

What you'll learn

This course includes

  • 537.5 hours of video
  • Certificate of completion
  • Access on mobile and TV

Summary

Keywords

Full Transcript

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/notJust-dev/TrelloClone ⚛️ React Native Mastery is the ONLY course you need to master mobile development with React Native & Expo 🚀 Enroll here: https://www.notjust.dev/react-native-mastery 📚 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 💡 Have an idea for a future tutorial? Share it on our Idea Board: https://github.com/orgs/notJust-dev/discussions *💬 Join the notJust Development gang and let's build together:* Twitter: https://twitter.com/VadimNotJustDev Instagram: https://www.instagram.com/VadimNotJustDev Facebook: https://www.facebook.com/notjustdev LinkedIn: https://www.linkedin.com/in/vadimsavin Discord: https://discord.gg/VpURUN2 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

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

FAQs

Course Hive
Download CourseHive
Keep learning anywhere