Summary
Keywords
Full Transcript
In this video, I will show you how to build a full-stack location-based app with Next.js 13, Google Maps, Google Places API, React, Tailwind CSS, and NextAuth.js. We will start by creating a new Next.js app and installing the necessary dependencies. Then, we will use NextAuth.js to add authentication to our app so that users can sign in and sign out. Then, we will use the Google Maps API to create a map and add markers to the map. We will also use the Google Places API to search for places near the user's current location. Finally, we will use NextAuth.js to add authentication to our app so that users can sign in and sign out. By the end of this video, you will have learned how to build a full-stack location-based app with Next.js 13, Google Maps, Google Places API, React, Tailwind CSS, and NextAuth.js. 🔗 GitHub Repository: https://github.com/rrs301/restaurant-finder-nextjs 👉Hostinger Hosting Service: https://hostinger.com?REFERRALCODE=1GAME84 👉Complete React Native Course: https://www.udemy.com/course/learn-and-build-react-native-app-from-scratch-for-beginners 👉Full Stack Blog Website using React Js, Tailwind Css, Vite | React Js beginner tutorial : https://youtu.be/l_moN1w-vWY 👉Build Full Stack Next Js 13 app : Next Js, React, Tailwind Css, Firebase, NextAuth : https://youtu.be/Ai7HJH2I08s 👉Learn React Native By Building an Educational App (Complete PlayList): https://www.youtube.com/playlist?list=PLaBeGKL1tOU0FuOxkLHFy_zOlIqOWUcNc 👉Full Stack AI Chatbot : React Native, Next.js 13, Google Bard API, Expo : https://youtu.be/LhKguWePLp0 🔴Follow us on Instagram: https://www.instagram.com/tubeguruji/ 🔴Telegram Channel: https://t.me/tubeguruji 🔴Buy Me a Coffee: https://www.buymeacoffee.com/tubegurujiw #NextJS #ReactJS #TailwindCSS #googlemap #NextAuth #googleplace#FullStackDevelopment #webapplication =========Course Content Chapter========== 00:00:00 Introduction 00:03:09 Technology 00:05:06 Create NextJs/React App 00:07:13 Files & Folder Explain 00:11:04 NextAuth.js Authentication 00:28:44 Header/NavBar 00:39:54 Add Google Font 00:41:15 Update App Layout 00:43:24 Category/Food Type List 00:54:09 Radius & Rating Selection 01:06:45 Integrate Google Map 01:13:42 Custom Google Map Styling 01:18:30 Display User Location on Map 01:27:15 Google Place API 01:33:03 Make Google Place API Call 01:44:48 Display Place List 02:04:28 Business Marker on Map 02:19:05 Distance & Direction 02:29:13 Final
