Тёмный

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

notJust․dev
Подписаться 109 тыс.
Просмотров 14 тыс.
50% 1

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: ru-vid.comWiXs0JbA3_k
✅ Project Page: www.notjust.dev/projects/trello
💻 Source Code: github.com/notJust-dev/Trello...
❗Try our FREE 2-day Masterclass on notJust.Academy: 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 Full-Stack Mobile Developer course and don’t miss out on your chance to become a 6-figure dev! Check out what our successful students are saying about their experience:
academy.notjust.dev/?...
💡 Have an idea for a future tutorial? Share it on our Idea Board: github.com/orgs/notJust-dev/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

Наука

Опубликовано:

 

6 май 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 6   
@joshbleijenberg4000
@joshbleijenberg4000 23 дня назад
amazing video!
@notjustdev
@notjustdev 22 дня назад
Thank you!
@user-yk2sp7sx8u
@user-yk2sp7sx8u 19 дней назад
brother, you haven't implemented feature like user can drag card from list and drop card into different list. Which we can be seen on trello application.
@user-ku3xo9pj1s
@user-ku3xo9pj1s 19 дней назад
Great video, can you also make a video on deep linking
@edge0601
@edge0601 17 дней назад
Thanks there are very few realm tutorials and i suck at following documentations
@notjustdev
@notjustdev 16 дней назад
I'm glad you found it helpful!
Далее
Build a Local-First Finance app with Expo & WatermelonDB
3:58:46
That One Racoon Be Like:
00:12
Просмотров 3,3 млн
The New React Native Architecture
25:59
Просмотров 117 тыс.
Why I Use Golang In 2024
9:21
Просмотров 215 тыс.
Why flat earthers scare me
8:05
Просмотров 249 тыс.
I Made 200 Python Projects...Here Are My 5 FAVORITES
11:23
How Neuralink Works 🧠
0:28
Просмотров 23 млн
🤯Самая КРУТАЯ Функция #shorts
0:58
Эволюция телефонов!
0:30
Просмотров 4,2 млн