React Native for beginners - How To Build the AIRBNB map with React Native and Expo | DEVember Day 5

Day 5 of #DEVember and today is all about exploring the power of maps in mobile apps, by building an interactive map feature similar to what you've seen on AIRBNB using React Native and Expo. We'll cover everything from integrating React Native Maps, displaying points of interest, to creating a scrollable carousel for detailed views! 🌟DEVember Day 5: https://www.notjust.dev/projects/devember/day5 If you have ideas of features, topics or apps you would like me to cover during #DEVember, you can submit them on our 💡Idea Board: https://github.com/notJust-dev/DEVember/discussions/categories/ideas 📚 Today's Agenda: - Introduction to React Native Maps - Setting Up Map Views in Expo - Adding Points of Interest to the Map - Creating a Scrollable Carousel for POIs - Synchronizing the Carousel with the Map - Styling Map Components - Handling User Interaction with Map and List - Recap and Q&A ❗Try our FREE 4-day Masterclass on notJust.Academy: https://assets.notjust.dev/masterclass/?utm_source=youtube&utm_medium=livestream&utm_content=DEVember 📚 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_source=youtube&utm_medium=livestream&utm_content=DEVember 💬 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 Introduction to Building Airbnb Maps with React Native and Expo 0:33 Overview of the Map Feature in Airbnb Clone 0:50 Introduction to DEVember and Past Projects 3:07 Reviewing Previous Days' Work and Setting Up Day 5 Project 5:11 Creating the Day 5 Folder and Setting Up Airbnb Screen 6:46 Installing and Integrating React Native Maps in Expo 8:47 Displaying Map View and Adding Markers 13:22 Rendering Dynamic List of Markers on the Map 15:21 Implementing Custom Markers with Prices 23:27 Customizing Marker View and Styling 28:35 Extracting Marker Component for Cleaner Code 31:00 Adding Keys to Marker Components for Optimization 32:23 Creating Overlay Components on the Map 34:11 Designing and Implementing Selected Apartment Display 40:51 Styling and Positioning the Selected Apartment Component 49:20 Implementing State Management for Selected Apartment 53:37 Adding Bottom Sheet for List View of Apartments 56:11 Installing and Integrating Bottom Sheet Component 1:00:45 Creating Flat List in Bottom Sheet 1:08:26 Adjusting Snap Points and Styling of Bottom Sheet 1:13:05 Experimenting with Bottom Sheet Interactivity 1:16:22 Discussing Potential Improvements and Features 1:22:47 Attempting to Sync Bottom Sheet with Map Zoom 1:35:20 Concluding the Tutorial and Previewing Tomorrow's Session 1:42:29 Closing Remarks and 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 #ReactNative