Building an Apple Wallet Clone with React Native Reanimated

Описание к видео Building an Apple Wallet Clone with React Native Reanimated

Let's build Apple Wallet using React Native, React Native Reanimated and Gesture Handler

This video is sponsored by App.js Conf - the best React Native conference.
Grab a ticket and let's meet in Poland, on 22-24th May: https://ti.to/appjs/2024/discount/not...
🏷️ Use notjustdevs10 for 10% off

✅ Project Page: https://www.notjust.dev/projects/appl...
✨ Asset Bundle: https://assets.notjust.dev/apple-wallet
💻 Source Code: https://github.com/notJust-dev/AppleW...

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

📚 We'll design the User Interface from scratch, implement swipe gestures and add animations to our app using Reanimated. This video provides you with an excellent opportunity to learn about:
- Setting up your React Native environment
- Introduction to React Native Reanimated
- Designing the card interface
- Implementing swipe gestures
- Adding animation to card transitions
- Managing state with React hooks
- Testing and debugging

📚 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:
https://academy.notjust.dev/?utm_sour...

💡 Have an idea for a future tutorial? Share it on our Idea Board: https://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
3:39 Setting Up a New Expo Project
12:11 Building the UI: Cards List Component
20:38 Rendering a List of Card Images
23:14 Implementing Scroll with Reanimated & Gesture Handler
30:18 Detecting Pan Gestures
37:40 Tracking Scroll Position
1:12:58 Stacking Cards on Scroll
1:24:10 Selecting Cards Animation
1:59:04 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 #applewallet #reactnative

Комментарии

Информация по комментариям в разработке