Build Full Stack NextJs 13 Uber Clone Web App : NextJs, React.js, Tailwindcss, Google Map, Stripe

🔥 In this step-by-step video series, you'll learn how to create a powerful and feature-rich ride-sharing application that replicates the functionality of the Uber platform. Whether you're a seasoned developer looking to enhance your skills or a beginner eager to dive into the world of web development, this tutorial is for you!

👉 Here's what you'll find in this video series:

Setting Up Your Development Environment: We'll start by setting up the necessary tools and environments, ensuring you're ready to begin coding.

Styling with Tailwind CSS: Discover how to make your app visually appealing and user-friendly using the popular Tailwind CSS framework.

Integrating Google Maps: Implement real-time location tracking and mapping features with Google Maps API, enabling users to see the location of their drivers in real time.

Adding Payment Processing with Stripe: Learn how to handle secure payments using Stripe, allowing users to pay for their rides seamlessly.

Deployment and Scaling: Learn how to deploy your Uber Clone Web App to a production server and ensure it can handle real-world traffic.

👍 If you're excited to embark on this coding journey with us, don't forget to subscribe and hit the notification bell so you don't miss any of the upcoming episodes. Let's build an incredible Uber Clone Web App together!

Join this channel to get access to perks:

#react #reactjs #nextjs #nextjs13 #uberclone #tailwindcss #webdevelopment
---------- Course Chapter-------------
00:00:00 Introduction
00:03:36 Technology
00:05:40 Create NextJs React App
00:09:53 Run App & Folder-File Explain
00:13:02 Social Authentication using Clear
00:25:55 Header
00:34:34 App Layout Update
00:37:42 Search Section (UI)
00:47:52 Search Place Autocomplete
00:59:21 Get Source/Destination Latitude & Longitude
01:15:32 Google Custom Style Map
01:18:55 Integrate Google Map
01:24:55 Add Source Destination Marker
01:37:05 Add Label to Marker
01:40:50 Draw route on Map
01:49:42 Car list with Amount
02:10:44 Stripe Payment Getway Integration
02:41:10 Deploy app on Vercel

[ABMan]

How sir i have installed node js now when i put nmp run dev
Node js popup comes and ask for allow node js java script run time

[sarthak]

there is no any source code in the whatapp channel please provide the source code link that i matched with my code which has some mistake

[AjitYadav-qgd]

1:55:45 here instead of setting the destination you have set the distance after the error found in console and you didn't show us that ?

[Dark-nthh]

50:14 i searched places api in library and when i tried to enable it asked me to create a google maps payment account. Its been 3 days since i tried to confirm my identity even though i gave correct id proofs to verification iam being rejected. Can you help me out?

[suryanshrajput]

places api not loading any place name in nextjs site.. help pls

[ApurvaKashyap-kjqz]

Error: Clerk: Clock skew detected. This usually means that your system clock is inaccurate. Clerk will continuously try to issue new tokens, as the existing ones will be treated as "expired" due to clock skew.

To resolve this issue, make sure your system's clock is set to the correct time (e.g. turn off and on automatic time synchronization).

---

JWT cannot be used prior to not before date claim (nbf). Not before date: Thu, 19 Oct 2023 06:43:38 GMT; Current date: Thu, 19 Oct 2023 06:43:29 GMT; (reason=token-not-active-yet, token-carrier=cookie)

this is the consent error keeps coming even after deployment ... how can I fix this ???

[fullerwebdev]

First of all I want to express my gratitude to you for posting this video, I have learned a lot. I have run into an issue however that I think is more of a problem with the package than it is with the code. What I am seeing is that the state does not get updated when you click on the clear button within the select. This can be verified by configuring a useEffect and monitoring the state change via console log. Is there another option that needs to be configured to update the state when the entry is cleared from either of the input boxes?

[themonk]

you also have this error at 2:40:18 please help to resolve it soon as possible

[utkarshkrishna.youtube]

I have finished this project till 47 minutes, But I didn't understand the place API part, you passed through that topic way too fast on how to set up Google Cloud, set and configure API. Can you help?

[guhaprasaanthnandagopal]

I had provided my Google Maps API key but when I type in an address, it just keeps on loading and I do not get any suggestions or see any activity on the network tab, what/where should I check?

[rockbelleh]

thanks alot n keep touching lives u d best

[subrotomukherjee]

Stripe in india can only be used via request only. How should we proceed ? Or suggest some good alternative having same functions like stripe.

[LucasCarvalhoCavalheri]

Why you use pure JavaScript and write your components in

[saikrishnamuntha]

Hi bro how to set the initial page to be login like localhost:3000/login to be the first actually in pages folder we can set in the index.tsx but in the app router how to do

[kilianhaas]

Hey, the google autocompleter is somehow just loading and does not show any results. What could be the problem?

[I_Aditigupta]

sir i am still getting error of "Error: Google script not loaded" after adding apiKey ....what to do i cant figure it out... pls help me!!!!

[etaigabbai]

I created a components folder with Header.js in it. I import with @/components/Header but it gives me an error for some reason. I have looked through all the files, I don't know what the issue is :(
Help!

[SahajJain-dt]

Please let me know how did you called the same item with different values "Pickup" and "Dropoff"

[Shubuislive]

bro i got an issue to getting google cloud api . there i am not showing free plan access

[mariocesena]

Great video! I have just one quick question: Is there a way to configure the autocomplete component to restrict it to the free tier of the Places API? I've been trying to find a method to retrieve only the place name, which, as I understand, incurs no charges. Thanks