Uber Clone - Typescript, NodeJS, GraphQL, React, Apollo
22h 41m 56s
English
Paid
April 9, 2024
We will do a Uber clone (backend + frontend + deployment). From head to toe using JavaScript! This time full stack, full JavaScript stack!
More
Uber Clone Typescript NodeJS GraphQL React Apollo
Before you take the course, you need to …
- An average understanding of JS is required. If you are a beginner, please start with the class below!
- An intermediate or better understanding of TYPESCRIPT!
- An intermediate or higher understanding of React is required.
- Medium or high level GRAPHQL, understanding of APOLLO is required.
- Implementation Features and Concepts for Learning
You will experience the creation of a global hot service, Uber, from the backend to the frontend.
Fully reproduced Uber-clone spelling. Users can download Google Maps data, send and receive local vehicle information, and also chat in real time between the driver and the client.
Backend Uber: Graphql Yoga, Express, TypeORM, Bcrypt, Mailgun, JWT, Twilio, Postgresql, Cloudinary, Heroku
Frontend Uber: React, Typescript, Styled Components, Popmotion, Google Maps Javascript SDK
Watch Online Uber Clone - Typescript, NodeJS, GraphQL, React, Apollo
Join premium to watch
Go to premium
| # | Title | Duration |
|---|---|---|
| 1 | #0.1 Requirements | 01:52 |
| 2 | #0.2 What are we building | 07:26 |
| 3 | #0.3 What are we using | 02:14 |
| 4 | #1.1 Project Setup- Git & Installation | 06:52 |
| 5 | #1.2 Project Setup. Typescript and NodeJS | 02:37 |
| 6 | #1.3 A word on @types | 04:48 |
| 7 | #1.4 GraphQL Yoga and Express part One | 08:28 |
| 8 | #1.5 GraphQL Yoga and Express part Two | 05:56 |
| 9 | #1.6 API and Schema Structue part One | 06:30 |
| 10 | #1.7 API and Schema Structue part Two | 07:14 |
| 11 | #1.8 Graphql To Typescript | 10:16 |
| 12 | #1.9 Typechecking Graphql Arguments | 04:27 |
| 13 | #1.10 Configuring TypeORM | 09:31 |
| 14 | #1.11 Creating a Virtual Environment on NodeJS | 05:26 |
| 15 | #1.12 User Entity GraphQL Type | 07:31 |
| 16 | #1.13 User Entity part One | 09:45 |
| 17 | #1.14 User Entity part Two | 07:13 |
| 18 | #1.15 Hashing and Encrypting User Passwords | 07:57 |
| 19 | #1.16 Verifying User Password | 03:52 |
| 20 | #1.17 Verification Entity part One | 07:17 |
| 21 | #1.18 Using Types on the Entities | 04:19 |
| 22 | #1.19 Creating the Verification Key | 07:03 |
| 23 | #1.20 Place Entity | 04:51 |
| 24 | #1.21 Ride Entity | 06:46 |
| 25 | #1.22 Chat and Message Entities part One | 08:27 |
| 26 | #1.23 Chat and Message Entities part Two | 05:26 |
| 27 | #1.24 Model Relationships like a Boss | 06:40 |
| 28 | #1.25 Resolver Types | 03:23 |
| 29 | #1.26 Planning the Resolvers part One | 07:40 |
| 30 | #1.27 Planning the Resolvers part Two | 06:10 |
| 31 | #1.28 FacebookConnect Resolver part One | 04:14 |
| 32 | #1.29 FacebookConnect Resolver part Two | 08:24 |
| 33 | #1.30 FacebookConnect Resolver part Three | 05:44 |
| 34 | #1.31 Testing the FacebookConnect Resolver | 05:47 |
| 35 | #1.32 EmailSignIn Resolver part One | 06:04 |
| 36 | #1.33 EmailSignIn Resolver part Two | 02:53 |
| 37 | #1.34 Introduction to Twilio | 03:10 |
| 38 | #1.35 StartPhoneVerification Resolver part One | 08:49 |
| 39 | #1.36 StartPhoneVerification Resolver part Two | 07:20 |
| 40 | #1.37 StartPhoneVerification Resolver part Three: Sending SMS | 05:21 |
| 41 | #1.38 CompletePhoneVerification part One | 03:44 |
| 42 | #1.39 CompletePhoneVerification part Two | 07:49 |
| 43 | #1.40 EmailSignUp Resolver | 08:06 |
| 44 | #1.41 Creating Custom JWT | 05:19 |
| 45 | #1.42 Authenticating Users with Custom JWT | 04:29 |
| 46 | #1.43 Testing Authentication Resolvers | 05:13 |
| 47 | #1.44 Custom Auth Middleware on Express part One | 03:38 |
| 48 | #1.45 Custom Auth Middleware on Express part Two | 09:03 |
| 49 | #1.46 Using Resolver Context for Authentication | 07:30 |
| 50 | #1.47 GetMyProfile Resolver | 06:03 |
| 51 | #1.48 Protecting Resolvers with Middlewares | 12:37 |
| 52 | #1.49 Sending Confirmation Email part One | 05:02 |
| 53 | #1.50 Sending Confirmation Email part Two | 07:50 |
| 54 | #1.51 Sending Confirmation Email part Three | 03:50 |
| 55 | #1.52 Testing Email Sending | 03:20 |
| 56 | #1.53 RequestEmailVerification Resolver | 06:56 |
| 57 | #1.54 CompleteEmailVerification Resolver | 06:03 |
| 58 | #1.55 Testing Email Verification Resolvers | 02:26 |
| 59 | #1.56 UpdateMyProfile Resolver part One | 05:33 |
| 60 | #1.57 UpdateMyProfile Resolver part Two | 06:47 |
| 61 | #1.57.1 UpdateMyProfile Resolver Bug Fixing | 03:36 |
| 62 | #1.58 ToggleDrivingMode Resolver | 05:13 |
| 63 | #1.59 ReportMovement Resolver | 06:23 |
| 64 | #1.60 AddPlace Resolver | 06:24 |
| 65 | #1.61 EditPlace Resolver | 09:01 |
| 66 | #1.62 DeletePlace Resolver | 05:02 |
| 67 | #1.63 GetMyPlaces Resolver and Testing | 07:18 |
| 68 | #1.64 GetNearbyDrivers Resolver part One | 07:32 |
| 69 | #1.65 GetNearbyDrivers Resolver part Two | 04:38 |
| 70 | #1.66 DriversSubscription part One | 09:45 |
| 71 | #1.67 DriversSubscription part Two | 06:05 |
| 72 | #1.68 Authenticating WebSocket Subscriptions part One | 08:38 |
| 73 | #1.69 Authenticating WebSocket Subscriptions part Two | 05:23 |
| 74 | #1.70 Filtering Subscription Messages | 10:53 |
| 75 | #1.71 Filtering Subscription Messages part Two | 10:22 |
| 76 | #1.72 RequestRide Resolver | 06:26 |
| 77 | #1.73 GetNearbyRides Resolver | 07:02 |
| 78 | #1.74 NearbyRideSubscription | 08:28 |
| 79 | #1.75 Testing the NearbyRideSubscription | 03:42 |
| 80 | #1.76 UpdateRideStatus Resolver part One | 08:08 |
| 81 | #1.77 UpdateRideStatus Resolver part Two | 07:11 |
| 82 | #1.78 GetRide Resolver | 11:18 |
| 83 | #1.79 RideStatusSubscription | 06:12 |
| 84 | #1.80 Testing the RideStatusSubscription | 04:06 |
| 85 | #1.81 Creating a ChatRoom | 05:07 |
| 86 | #1.82 GetChat Resolver | 09:55 |
| 87 | #1.83 BugFixing | 09:52 |
| 88 | #1.84 Testing GetChat Resolver | 04:41 |
| 89 | #1.85 SendChatMessage Resolver | 08:04 |
| 90 | #1.86 MessageSubscription | 07:30 |
| 91 | #1.87 Backend Conclusions | 01:10 |
| 92 | #2.0 Create React App with Typescript | 06:02 |
| 93 | #2.1 Apollo Setup part One | 05:04 |
| 94 | #2.2 Apollo Setup part Two | 03:35 |
| 95 | #2.3 Apollo Setup part Three | 06:51 |
| 96 | #2.4 Apollo Setup Recap | 04:03 |
| 97 | #2.5 Connecting Local State to Components | 07:08 |
| 98 | #2.6 Typescript and React Components | 05:09 |
| 99 | #2.7 Typescript and Styled Components part One | 04:00 |
| 100 | #2.8 Typescript and Styled Components part Two | 04:04 |
| 101 | #2.9 Global Styles Set Up | 04:59 |
| 102 | #2.10 Planning the Routes | 06:46 |
| 103 | #2.11 Router and Routes | 09:25 |
| 104 | #2.12 OutHome Component | 06:52 |
| 105 | #2.13 Login Component and React Helmet | 04:40 |
| 106 | #2.14 Route Components Review | 06:18 |
| 107 | #2.15 Inputs and Typescript part One | 09:19 |
| 108 | #2.16 Inputs and Typescript part Two | 11:38 |
| 109 | #2.17 Notifications with React Toastify | 07:26 |
| 110 | #2.18 PhoneLogin Mutation part One | 12:26 |
| 111 | #2.19 Magic with Apollo Codegen | 09:00 |
| 112 | #2.20 PhoneLogin Mutation part Two | 07:23 |
| 113 | #2.21 PhoneLogin Mutation part Three | 06:51 |
| 114 | #2.22 VerifyPhone Screen | 09:44 |
| 115 | #2.23 Testing the PhoneLogin Screen and Redirecting | 03:45 |
| 116 | #2.24 VerifyPhone Mutation part One | 12:37 |
| 117 | #2.25 VerifyPhone Mutation part Two | 09:41 |
| 118 | #2.26 Updating Local State | 14:47 |
| 119 | #2.27 SocialLogin with Apollo part One | 10:39 |
| 120 | #2.28 SocialLogin with Apollo part Two | 07:10 |
| 121 | #2.29 SocialLogin with Apollo part Three | 11:02 |
| 122 | #2.30 SocialLogin with Apollo part Four | 05:11 |
| 123 | #2.31 Home Sidebar Component | 07:18 |
| 124 | #2.32 Home Sidebar Query | 11:02 |
| 125 | #2.33 Home Sidebar Query part Two | 11:38 |
| 126 | #2.34 Updating Driver Mode part One | 09:29 |
| 127 | #2.35 Updating Driver Mode part Two | 09:06 |
| 128 | #2.36 EditProfile Screen part One | 09:13 |
| 129 | #2.37 EditProfile Screen part Two | 09:46 |
| 130 | #2.38 EditProfile Screen part Three | 04:45 |
| 131 | #2.39 Uploading Profile Photo to Cloudinary part One (1) | 09:02 |
| 132 | #2.39 Uploading Profile Photo to Cloudinary part One(2) | 08:49 |
| 133 | #2.40 Uploading Profile Photo to Cloudinary part Two | 03:09 |
| 134 | #2.41 Settings Screen part One | 11:24 |
| 135 | #2.42 Settings Screen part Two | 08:23 |
| 136 | #2.43 Places + AddPlace Components | 06:25 |
| 137 | #2.44 AddPlace Mutation | 11:33 |
| 138 | #2.45 Edit Place Mutation | 07:10 |
| 139 | #2.46 Google Maps and React part One | 14:36 |
| 140 | #2.47 Google Maps and Geolocation | 10:47 |
| 141 | #2.48 Google Map Events | 05:58 |
| 142 | #2.49 Reverse Geocoding part One | 08:34 |
| 143 | #2.50 Reverse Geocoding part Two | 05:28 |
| 144 | #2.51 Geocoding part One | 07:11 |
| 145 | #2.52 Geocoding part Two | 09:04 |
| 146 | #2.53 Refactoring AddPlace | 07:35 |
| 147 | #2.54 HomeScreen User Marker | 09:19 |
| 148 | #2.55 HomeScreen Moving with the User | 07:00 |
| 149 | #2.56 HomeScreen Creating Route Markers | 07:08 |
| 150 | #2.57 HomeScreen Getting Directions part One | 09:07 |
| 151 | #2.58 HomeScreen Getting Directions part Two | 11:26 |
| 152 | #2.59 Calculating the Price | 12:56 |
| 153 | #2.60 Report Location with HOC | 12:37 |
| 154 | #2.61 NearbyDrivers Query | 09:52 |
| 155 | #2.62 NearbyDrivers Query part Two | 11:15 |
| 156 | #2.63 Drawing Nearby Drivers part One | 13:32 |
| 157 | #2.64 Drawing Nearby Drivers part Two | 05:49 |
| 158 | #2.65 Drawing Nearby Drivers part Three | 08:06 |
| 159 | #2.66 Ejecting from Apollo Boost | 07:22 |
| 160 | #2.67 RequestRide Mutation | 14:07 |
| 161 | #2.68 Getting Nearby Rides part One | 14:55 |
| 162 | #2.69 Getting Nearby Rides part Two | 15:57 |
| 163 | #2.70 Apollo Subscriptions part One | 06:57 |
| 164 | #2.71 Apollo Subscriptions part Two | 09:59 |
| 165 | #2.72 Ride Screen part One | 12:03 |
| 166 | #2.73 Get Ride Query part One | 06:16 |
| 167 | #2.74 Get Ride Query part Two | 14:41 |
| 168 | #2.75 Ride Status Subscription | 07:51 |
| 169 | #2.76 Ride Status Subscription part Two | 05:06 |
| 170 | #2.77 Chat Screen Query | 11:31 |
| 171 | #2.78 Chat Screen Mutation | 13:20 |
| 172 | #2.79 Chat Screen Subscription | 10:24 |
| 173 | #2.80 Chat Screen Subscription part Two | 03:34 |
| 174 | #2.81 Frontend Conclusions | 04:04 |
| 175 | #3.1 Deploying to Now part One | 09:31 |
| 176 | #3.2 Deploying to Now part Two | 08:54 |
| 177 | #3.3 Bugfix and conclusions | 14:05 |
| 178 | #4.0 Introduction | 05:12 |
| 179 | #4.1 Building for production part One | 02:35 |
| 180 | #4.2 Heroku | 10:17 |
| 181 | #4.3 Heroku and Databases | 08:17 |
| 182 | #4.4 Finishing Up | 03:45 |
Similar courses to Uber Clone - Typescript, NodeJS, GraphQL, React, Apollo
MERN React Node Next.js Multi User SEO Blogging Platform
Duration 20 hours 25 minutes 13 seconds
Course
Next.js - The Full Course
Duration 1 hour 14 minutes 14 seconds
Course
Node.js, Express, MongoDB & More The Complete Bootcamp 2023
Duration 42 hours 14 minutes 59 seconds
Course
Full Stack Advanced React + GraphQL
Duration 15 hours 43 minutes 10 seconds
Course
Node with React: Fullstack Web Development
Duration 25 hours 36 minutes 19 seconds
Course
Next.js and Apollo - Portfolio App (w/ React, GraphQL, Node)
Duration 28 hours 38 minutes 19 seconds
Course
Testing React Apps with React Testing Library
Duration 6 hours 48 minutes 20 seconds
Course
The Modern GraphQL Bootcamp (with Node.js and Apollo)
Duration 23 hours 26 minutes 42 seconds
Course