OpenTube

Build a Full Stack React Native App with Payments | PostgreSQL, TypeScript, Stripe, Tailwind

JavaScript Mastery

751,917 views

Build a full-stack Uber Clone Application with Expo’s latest features and lightning-fast edge-ready Postgres database in React Native.

⭐ Join JS Mastery Pro: https://jsm.dev/uber-jsmpro
💎 Become a Top 1% Next.js Developer: https://jsm.dev/uber-nextjs

📁 Free Video Kit (Code, Design, Repo, Guide): https://jsm.dev/uber-kit

Clerk: https://jsm.dev/uber-clerk
NeonDB: https://jsm.dev/uber-neondb
WebStorm: https://jsm.dev/uber-webstorm

Rate us on TrustPilot: https://jsm.dev/trustpilot

Discord: discord Twitter: jsmasterypro Instagram: javascriptmastery LinkedIn: javascriptmastery

Business Inquiries: contact@jsmastery.pro

Time Stamps 👇
00:00:00 — Intro
00:06:04 — IDE Setup
00:09:02 — Project Setup
00:25:43 — WebStorm Customization
00:28:38 — File & Folder Structure and Router Setup
00:47:50 — Onboarding Screens
01:11:28 — Auth Screens
01:30:46 — Clerk Email Authentication
02:01:30 — Bottom Tab Bar
02:10:10 — NeonDB Implementation & API routes
02:26:21 — HomePage UI
02:57:25 — Map Functionality
03:05:28 — Zustand State Management
03:25:50 — Location Autocomplete Feature
03:28:22 — Find Ride Screen
03:55:55 — Confirm Ride Screen
04:01:41 — Book Ride Screen
04:07:07 — Stripe Payment Implementation
04:48:00 — Map Path Direction & Completing the Main Flow
05:07:39 — Implementing Real Dynamic Data
05:10:44 — Implementing oAuth Authentication
05:19:32 — Rides History Screen
05:22:00 — oAuth Redirection Issue and Other Fixes
05:27:31 — Profile and Message Screens

20 Comments

@javascriptmastery Creator 2 years ago (edited) Pinned

📦 Looking for Code, Figma & Assets?
• Check the video description and click the "VideoKit" link.
• Everything you need is there, and it's 100% FREE.

Many Pro Courses launching soon! Join the waitlists to get notified! 🔥🔥
👉 React Native Pro Course Waitlist: https://jsmastery.com/waitlist/react-native-course
👉 Backend Pro Course Waitlist: https://jsmastery.com/waitlist/ultimate-backend-course
👉 React.js Pro Course Waitlist: https://jsmastery.com/waitlist/react-course
👉 Tailwind Pro Course Waitlist: https://jsmastery.com/waitlist/tailwindcss-course
👉 AI Development Pro Course Waitlist: https://jsmastery.com/waitlist/ai-course

→ I switched to Webstorm, what about you? ⭐https://jb.gg/GetWebStormFree

@felixmilome 10 months ago

If one of us ends up building something and becoming a billionaire, lets donate at least a million to this guy.

@FaisalMohammed244 2 years ago

This is unreal. You’ve outdone yourself with this one Adrian, thank you

@mysterious6057 2 years ago

1:11 Pune. Currently i am living in pune 😃❤

@-mohammadalakedy5417 2 years ago

Bro How I Can Building And Deploy on App Store ?

@DoubleCoverageOnly 2 years ago

Bro is making tutorials faster than i can learn them

@studiofrank2496 2 years ago

I love how the tech space is shifting from hard stack technologies to "simpler but gets work done solutions" this is great 😃

@tshiamotodd3644 2 years ago

I'm here I've completed the main flow. Adrian I've got to Hand it to you... You are a legend within the YouTube tutorial space and I truly enjoy your content I'll follow your teachings to the end Bro thank you so much 🎉

@Jonee15 2 years ago

Bro just casually recreates Uber, insane.

@joyustcian222 2 years ago

2H ago, I was visiting your channel expecting a new RN Project. Luckily go it after 2h. Thank you so much for sharing such highly professional projects.

@TsillALevi 2 years ago

Best tutorial for JavaScript on YouTube ever and always up to date.

@eshansingh7130 2 years ago

Bro is not a chef but always cooks 💪🏻🗿 . Thank you Adrian

@0xbobbyboy 2 years ago

For anyone wondering why KeyboardAvoidingView doesnt work at 1:20:00, it has to wrap components that it can move, so ideally use it in the SignUp Component wrapping the entire thing and not individually in the InputField Component.
The whole tutorial is probably by far the best on youtube, amazing work!

@steelhabourstudios 2 years ago

Welcome back. I have been waiting for all THIS While

@joyak2912 5 months ago

🔥 This video is a game-changer! 🙌 Combining React Native, TypeScript, PostgreSQL, and Stripe with Tailwind for styling is exactly the full stack solution I was looking for! The way you broke down each step made everything so easy to follow. 💡 Major props for making payments integration so accessible! 💳 Can't wait to apply this in my next project. 🙏 Keep the content coming! 🚀🔥

@happyboi4015 2 years ago

YOOOOO!!! This is literally THE BEST Coding channel on youtube. LOVE UR VIDEOS ❤❤
I watch ur videos to build the apps that you teach and i then add more features and make it better and publish them . Love you mate 😊 Brilliant teacher

@krzysztoflenarczyk9 2 years ago

This man is going to be the pillar of app dev. Keep up the amazing work💪

@victorzakkashallangwa4218 2 years ago

This is great Adrian, Finally trying out SQL

@pratishjoshi 1 year ago

Thank you so much for creating this. You are legendary, bro! ❤

@Golden-uk7tp 2 years ago

I have finally finished this project, my very first react native app.
Thank you so much,
I have been here for more than a year learning javascript, react, fullstacks and now react native, I cannot tell you how much I appreciate your channel. Thank you.