Summary
Keywords
Full Transcript
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/notjustdevs10 🏷️ Use *notjustdevs10* for 10% off *✅ Project Page:* https://www.notjust.dev/projects/apple-wallet *✨ Asset Bundle:* https://assets.notjust.dev/apple-wallet *💻 Source Code:* https://github.com/notJust-dev/AppleWallet ⚛️ 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 📚 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 💡 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 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
