Let's Build Uber in 90 minutes (Vue JS, Tailwind CSS, Node JS, Google Maps, PWA, Vue 3) Uber Clone
John Weeks Dev
Join me in this tutorial series where we'll be building a fully functional Uber clone in just 90 minutes! Using Vue JS, Tailwind CSS, Node JS, Google Maps API, PWA, and Vue 3, we'll be creating a powerful web application that looks and functions just like the real Uber.
We'll start by setting up our project with Vue 3 and Vue CLI, then move on to creating the UI with Tailwind CSS. Next, we'll add Google Maps API to implement the mapping feature and PWA to make our application offline accessible. Finally, we'll finish up by integrating Node JS for server-side functionality and deployment.
This tutorial series is perfect for beginners and experienced developers alike. Whether you're new to web development or a seasoned pro, you'll gain valuable skills and knowledge by building this Uber clone. By the end of the series, you'll be able to create your own clone apps, and you'll be able to use the skills you've learned to build other projects.
Don't miss out on this opportunity to learn the latest web development technologies and build a powerful web application. Make sure to subscribe to our channel for more amazing tutorials and to be notified when the next episode is released.
LIKE!!! SUBSCRIBE!!! SMASH THE NOTIFICATION BELL!!!
And I'll see you in the video!
Buy me a coffee - https://www.buymeacoffee.com/johnweeksdev
Let's Build Spotify in 90 minutes - https://www.youtube.com/watch?v=ZzuqwqP1wAQ Let's Build Twitter in 90 minutes - https://www.youtube.com/watch?v=RWJF0xSSaps Let's Build Amazon in 2 hours - https://www.youtube.com/watch?v=SAUKvG6ILSs Let's Build WhatsApp in 90 minutes -https://www.youtube.com/watch?v=E-cg6Bqaxm0 Let's Build YouTube in 90 minutes - https://www.youtube.com/watch?v=o-hIuejQzAA Let's Build Gmail in 2 hours - https://www.youtube.com/watch?v=KE5sQiHRZQg
GitHub Repo: https://github.com/John-Weeks-Dev/uber-clone
00:00 - App demonstration 02:56 - Setup | What you need 03:18 - Create the project with Vue CLI 04:18 - Installing all the NPM packages 06:58 - Preparing the project 08:25 - HomeView styles with Tailwind CSS 26:27 - DirectionsView styles with Tailwind CSS 37:39 - MapPage | Google Maps setup and styling with Tailwind CSS 50:04 - Node JS backend 57:32 - DirectionsView | Google Places API 1:04:11 - Pinia installation 1:06:11 - DirectionsView | Google Places API 1:10:07 - MapView | Google Directions Matrix 1:22:21 - Final cleanup | Navigation routes 1:24:03 - Vue page transitions 1:25:20 - Vue config modify for PWA mode 1:26:22 - Generate assets 1:27:17 - Launch project in PWA mode 1:29:16 - Finished | Thanks for watching
Vue Vue js Vue 3 Vue CLI Tailwind Tailwind CSS Pinia Pinia Vue Vue Pinia Node Node JS NodeJS Google Maps GoogleMaps Places API Auto Complete Distance Matrix Distance Matrix API PWA Progressive Web App Progressive Web Apps Javascript Tutorials Gmail Uber WhatsApp Gmail Clone Uber Clone WhatsApp Clone
#uberclone
#vuejs
#tailwindcss
#nodejs
#googlemapsapi
#pwa
#vue3
#webdevelopment
#cloneapps
#javascript
#css
#html
#vue
#vuejs
#vue3
#pinia
#googlemaps
#googlemapsplatform
#googlemapsapikey
#nodejs
#node
#javascript
#javascript_tutorial
#pwa
#progressivewebapps
#uber
#gmail
#whatsapp
#uberclone
#whatsappclone
#gmailclone
...
https://www.youtube.com/watch?v=zXpr8zaK2eA
305076070 Bytes