πŸ”΄ Let’s build a Uber Clone with REACT NATIVE! (Navigation, Redux, Tailwind CSS, Google Autocomplete)

Sonny Sangha

🚨 Join the world’s BEST developer community & course Zero to Full Stack Hero: https://www.papareact.com/course

πŸ«‚ Join my Community, “University of Code” for FREE: https://www.universityofcode.com

πŸ”΄ LOOKING FOR THE CODE? πŸ› οΈ
https://links.papareact.com/github

πŸ“© Want coding problems (with solutions!) delivered to your inbox daily? https://www.papareact.com/dailycodingchallenges

The much-anticipated build is FINALLY HERE!
Join me as I build the UBER CLONE with REACT NATIVE (yes we’re building for iOS & Android!), you’ll learn how to do the following in this build:

πŸ‘‰ Use Tailwind CSS with RN for awesome styling!
πŸ‘‰ Use the Google Distance Matrix API to calculate Travel time and Distance (+ Cost!)
πŸ‘‰ Use the Directions Google API for real navigation!
πŸ‘‰ Use Google Places API for real navigation!
πŸ‘‰ Use apple & google maps for iOS & Android
πŸ‘‰ Use React Native Navigation to navigate between screens!
πŸ‘‰ Use React Native Elements to elevate your app design!
+ SO MUCH MORE!

πŸŽ™οΈ PODCAST
https://links.papareact.com/podcast

🌍 SOCIALS:
Instagram: https://links.papareact.com/instagram
Facebook: https://links.papareact.com/facebook
LinkedIn: https://links.papareact.com/linkedin
Twitter: https://links.papareact.com/twitter
Discord: https://links.papareact.com/discord
Newsletter: https://links.papareact.com/newsletter

❀️ SUPPORT
PAPAFAM Merch: https://links.papareact.com/merch
Donate: https://links.papareact.com/donate

πŸ• TIMESTAMPS:
00:00 Introduction
01:00 Build Showcase
03:26 Build Explanation
08:59 Setting up Expo
14:57 Initialising the Build
23:33 Setting up and Implementing Redux
44:01 Building the HomeScreen Component
55:41 Building the NavOptions Component
1:14:44 Implementing React Native Navigation
1:27:13 Implementing Google Autocomplete Library
2:00:34 Building the MapScreen Component
2:04:27 Building the Map Component
2:17:04 Building the RideOptionsCard Component (1/2)
2:18:33 Building the NavigateCard Component (1/2)
2:29:06 Implementing the Directions API
2:38:06 Building the NavFavourites Component
2:46:25 Implementing Keyboard Avoiding View
2:50:34 Building the NavigateCard Component (2/2)
2:57:12 Building the RideOptionsCard Component (2/2)
3:17:38 Implementing the Travel Time Calculation
3:26:13 Implementing the Price Calculation
3:32:58 Building the Menu Button
3:35:32 Bug Fixing
3:36:42 Final Build Demo
3:40:45 Outro

DISCLAIMER: This Video is made for informational and educational purposes only. We do not own or affiliate with Uber and its subsidiaries in any form. Copyright Disclaimer Under section 107 of the Copyright Act 1976, allowance is made for β€œfair use” of this video for educational purposes.

#reactjs #reactnative #redux #tailwindcss #tailwind