🔴 Build the Uber clone in React Native (Tutorial for Beginners) [2]
Vložit
- čas přidán 24. 05. 2024
- Let's learn React Native by building the Uber clone from scratch even if you are a beginner.
📚 Enroll NOW for "The Full-stack Mobile Developer" and save 30%
academy.notjust.dev/
Download the Asset Bundle (Images, Dummy data, PDF presentation):
assets.notjust.dev/uber
Join the notJust Development gang and let's build together: / discord
Source code: github.com/Savinvadim1312/Ube...
If you are a beginner that wants to learn javascript and react-native or an advanced javascript developer that wants to get into mobile development using react native then this Livestream is for you. This is a perfect opportunity to follow along and build this application together with us, and add it to your portfolio as it will help you land your next job. If you finish the app, tag me on social media and I will give you feedback.
We will start building the Uber clone from scratch, starting from setting up a React Native project and finishing with connecting the application with a GraphQL backend using AWS Amplify. We will walk through designing the UI layout of the app, structuring everything in components, and putting everything together. We will also implement navigation between screens, header bars, and tab bars for the Uber app menu using React Navigation.
Learn how to work with Google maps in react native, to draw routes on the maps, and to implement an autocomplete feature for the location input.
For the backend, we will be using AWS Amplify, which is an amazing combination of tools and services from AWS, that helps us build mobile and web applications faster. It offers pre-made authentication components and flows, database, API (REST and GraphQL), storage, and much more.
Doing the react-native Uber clone yourself is a great opportunity to practice React Native, modern Javascript, Typescript, AWS Amplify. We are always trying to use the latest technologies and best practices, so that's another opportunity to learn something new, being it functional components, hooks, state, navigations, or AWS and Amplify.
Tag me on social media when you finish this build, and I will give you feedback on your code.
LinkedIn: / vadimsavin
IG: / vadimsavin0
Twitter: / savinvadim_
Timecodes:
00:00 Intro
01:06 What we are going to build?
02:29 What are you going to learn?
04:00 Prerequisites
07:20 Demo starting point
15:43 Map Marker Rotation
25:56 Places Autocomplete
01:03:32 Geolocation
01:37:48 React Navigation
01:51:42 Navigating Between Screens
02:03:10 Send data when navigating
02:11:53 Drawer Navigation (Hamburger Menu)
#VadimSavin #notjust.dev #notJustDevelopment - Věda a technologie
![🔴 Build the Uber Driver App in React Native & AWS Amplify (Tutorial for Beginners) Part [5]](http://i.ytimg.com/vi/E95VMb6nzKc/mqdefault.jpg)
![🔴 Build the Uber Driver App in React Native & AWS Amplify (Tutorial for Beginners) Part [5]](/img/tr.png)
![[Vowel]물고기는 물에서 살아야 해🐟🤣Fish have to live in the water #funny](http://i.ytimg.com/vi/3G9MH063Cx4/mqdefault.jpg)
Insane amount of knowledge bombarded thanks man 👌👌👍👍 For this tutorial i had a fyp. really saved the research time for stack.
I've finished this entire tutorial but I'm always coming back to these uber clone videos because of the exaggerated amount of insane knowledge in this uber tutorial
🚀 Download the Asset Bundle: assets.notjust.dev/uber
📚 Enroll in "The Full-stack Mobile Developer" and become a 6-figure dev in 2021: academy.notjust.dev/
Sir you are great and patient. Jesus will reward you.
I spent 5hr on the first video for the client side, am glad to continue i hv learn alot thank you so much, now i can call my self an "App developer"
I am so happy for you :3
Love the content keep it up. Thanks for free education.
Awesome Video :) Really Helpful. Bro When 3rd part is coming?
Thank you for giving back to society. Please I’m humbly suggesting, if you could teach us a complete e-commerce app. Thank you once again
Thanks for appreciating my work. E-com will come in future
Awesome 👍 and easy to understand
I've learned how to walk thanks to Vadim!
Did those mushrooms help?
Loving this project 😊😊
Thanks
Just found your videos, thanks for the great tutorials
Glad you like them!
Till now, I have Learned a lot and enjoyed it as well. Little bit more on database connectivity with the app is missing.
You are the best! Thank You!
I have been to Kishinev, capital of Moldova, Moldova
I lived in Odessa and traveled to Kishinev to look for merchandise. It is a Beautiful Place!
Now I live in Miami, USA , but I was living in Tenerife too. Seven years! I know Santa Cruz very well!
Are you there?
Thank you for the video
This build is amazing bro
Thanks
I spent 8h on your videos and i learned lot lot from you.
I am glad you found it valuable
Bro learning a lot ... Itz all natural coding and debugging .... Not any scripted ... Love ur content ... Idk why I am want to guess ur age 🤣 😅 ... But I think u will be around 33 ...Thanks bro for the great content ... Lots of love ❤️
You are the best💕
awesome!
Hi there.... First for all i love your videos very much and appreciate it.... I want to know is there any way we can use mobile biometrics like fingerprint with React Native because i think i have done a lot research and used many libraries but it didn't come our successful....
Did u make an admin panel and database for this clone?? I mean backend and all that..coz i cant see those in your videos..thanks your videos are amazing
Hey Vadim , I am having an issue with this google auto complete and all this map thing, i even tried your api key but i didnt show any auto suggestion on auto complete and it is not showing map as well. It shows a blank portion and google is written on it. What do I need to do?
Hi Vadim When will you make production-ready apps??
Can we do a clone with node and express as the backend please... with authentication also, it would be a huge help, thanks in advance, love your channel and love your clones...
Thanks for suggestion. We might do it in near future
@@notjustdev Does this application have no backend? Rog 007 did you make all the videos? And is the application complete?
@@andersonbtr2008 it has both front end and back end
@@notjustdev Please do that, so interested!
Hey, can you make a video on Morph Transaction with SVG in react-native.
Hi, just coming across this tutorial.. I miss the first part, can someone kindly share a link to the first part?
Thanks
hello teacher Vadim. We have 2 textinput and in state stores Origin and Destination. How to do this so that when I click on textInput1, the map component is redirected to the map and select a location on the map, or by default there was a location. And on 2textinput, also select on the map. I made this component select on the map. And it works like this: there is a marker in the center and you can change any location. And this data is now stored in the state const[region, setRegion]=useState ({region: longitude:56.97778, latitude:33.87784}). Help help please. Without using googleautomplete.
Dear Vadim i cannot get assets bundle from the link , you have other link pls?
Here is Yoseph from DC. Am looking for the first part to start watching your video, but couldn't find part one. Can I start from part 2 without missing a lot?
Please 🙏🙏 make your next video on this to use fingerprint or face recognition with React Native
hi all, in my project when i enter my location and then where to (2:03 in video) it dont automatically go to next page to choose which uber car i want, is it because my billing account not enable???? please, any help?
also my current location on map doesn't appears, it it because i don't enable billing account?
Hi, I have an issue where my current location is not working, I constantly get a TypeError: null is not an object (evaluating RNFusedLocation.getCurrentPosition
can anyone help?
Hi, I have an issue with MapViewDirections - Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. Any help ?
just downgrade react native map version
Anyone please help me , i have an issue with destination
const destinationLoc = {
latitude: destination.details.geometry.location.lat,
longitude: destination.details.geometry.location.lng,
};
There is no geometry object in JSON while debugging.. how to resolve my issue?
Thank very much for the video. Unfortunately int the last part I have an error of null object on Destination.details.geometry.location.lat, while debugging it seems that details has no geometry property. I might be doing something wrong. Please anybody could help me?
FetchDetails is missing in DestinationSearch. 😉
Hey @Vadim Savin,
Can you build Reddit app please??
Thank you
How can I use my Android phone to run react native I don't want to uee emulator
i have issue displaying showsUserLocation on the map.
Can u add more functionalities?
I Almost cried 🤩🤩 tnks
How do you get the color picker on the side of the line number?
a extenstion
AWS Services not working GraphQlAPi Error code not found
When the 3rd part is coming ?
Vadim, we didnt do price calculations
Doesn't navigate to RouteMap. In your case it's just a delay, in my case doesnt work at all :/
to me its giving an error
Invariant Violation: Tried to register two views with the same name AIRMap
Which is better? React native or Flutter?
I am biased. React Native
how do i reinstalled all things
God damnit with react native and all the dependencies and updates.. only a few months later and i have TOOONS of issues following the tutorial..
HOLA,, PUEDES VENDERME TU CODIGO DE UBER CHOFER CLIENTE Y ADMIN, Y CUANTO PARA QUE TU ME LO SUBAS A GOOGLE STORE, Y APPLE STORE.??
Let's try fintech next!
Joss
2:53:36 Android emulators takes up ~5GB of your RAM
Check internet connection on android emulator
HAVING ERROR WHILE INSTALLING NAVIGATION
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: GasUp@0.0.1
npm ERR! Found: react@17.0.1
npm ERR! node_modules/react
npm ERR! react@"17.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.0" from @react-native-community/masked-view@0.1.10
npm ERR! node_modules/@react-native-community/masked-view
npm ERR! @react-native-community/masked-view@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\imbil\AppData\Local
pm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\imbil\AppData\Local
pm-cache\_logs\2021-03-19T13_23_15_116Z-debug.log
ok
next part?
Hey it would be a great favour if you share API key aswell. i am coding along with you and its my day 3 and I am glad you are offering these services for free. Currently I dont have any card which deals with international transactions that why I am unable to see maps. :(
Are you interested in helping me on my new project? I'd like to have some discussion and dialogue with you and think you could fast track my plan something I would be willing to make it worth your time within my means. Thank you.
Hey, thanks for reaching out. Unfortunately, at the moment I am tight on time, so I cannot help you personally, but I will try my best to help you through my videos.
Hi Robert, feel free to reach out to me on your project. Thanks for the tutorial Vadim
best at 1.5x speed
can you tell me, how to make phone screen lock app in react native. Thats my college project. plz help me
Wov again super .... I have almost finished. However I have faced some issue , when I Have set "origin.details.geomerty.location.lat" and "...lng" whenever I have select place which is given from autocomplate (provided by google ) generally it has no information under details as geometry , thats why always i have render error like "cannot read properties of undefined(reading"lolaciton")" how coul ı passed it? best regards.
He's definitely a good engineer, but there is no pros for watching this on stream. He bumps too much.
Please, no more "SO"
Stuck in an error 😭 undefined is not an object (evaluating 'route.params.originPlace') in searchresult.js.
it is fugging LAUGHABLE that you would list this as for beginners