Next Js And Google Maps Api – Location-Based Ride Requests

Free Download Next Js And Google Maps Api – Location-Based Ride Requests
Published 11/2023
MP4 | Video: h264, 1920×1080 | Audio: AAC, 44.1 KHz
Language: English | Size: 3.25 GB | Duration: 4h 12m
Unlock the World: Geo-Enabled App Development with Next.js and Google Maps API with Supabase in the backend

What you’ll learn
Understand Next JS Fundamentals: key concepts and features of Next JS, including server-side rendering and the overall structure of Next JS projects
Master Google Maps API Integration: gain proficiency in integrating Google Maps API into Next JS applications
Implement Location-Based Services: Develop to ability to implement location-based services in web applications
Utilize Supabase Geo-Queries: Explore and implement Supabase’s powerful geoqueries to enhance location-based functionalities
Requirements
Javascript
React JS
Description
Welcome to: Mastering Google Maps API in Next.JS: Building a Simplified Ride Request App. Learn and practice Next.JS by creating a location-based ride request app with the the Google Maps API. This hands-on project-based course is designed for developers eager to elevate their skills in Next.js and seamlessly integrate Google Maps API for powerful geo-enabled applications. Discover the art of building a ride request app without the complexities of real-time features, connecting users to static drivers for a streamlined learning experience. Throughout the course, we leverage the robust tech stack of Next.js, Google Maps API, and Supabase for a seamless development process. The curriculum is crafted with clarity in mind, making it accessible for developers with basic knowledge of React JS. Guided by expert instruction, you’ll gain a deep understanding of the intricacies of Next.js and Google Maps API integration, providing a solid foundation for future projects. Upon completion, you’ll not only possess a fully functional ride request app but also the skills to create diverse geo-enabled applications. From ride-sharing platforms and delivery apps to location-based social networks and interactive map-driven e-commerce platforms, the possibilities are limitless. Enroll now to unlock the world of geo-enabled app development and take your coding skills to new heights.I will be using:WindowsNext.JS 14React.JS 18Node V20.9Javascript, instead of TypescriptNOTES: I haven’t done the user authentication yet. It will do if requested by students.
Overview
Section 1: Introduction
Lecture 1 Introduction / Welcome to the course
Lecture 2 Creating a Next JS app
Lecture 3 What’s inside a Next JS app
Lecture 4 Routing and Navigation
Lecture 5 Components in Next JS
Lecture 6 Another way of navigating (introducing client side components)-Part 1
Lecture 7 Another way of navigating (introducing client side components)-Part 2
Section 2: Next Js and Google Maps API
Lecture 8 Getting started with the Google Maps API
Lecture 9 Next JS/Google Maps API – Integration – Part 1
Lecture 10 Next JS/Google Maps API – Integration – Part 2
Lecture 11 Next JS/Google Maps API – Integration – Part 2
Lecture 12 Next JS/Google Maps API – Integration – Part 3
Lecture 13 Using Markers
Lecture 14 Using Markers – Part 2 : Custom icons
Lecture 15 Using Markers – Part 3 : Marker options
Lecture 16 Using Markers – Part 4: Marker events
Lecture 17 Using Markers – Part 5 : The InfoWindow component
Section 3: Getting started with our app
Lecture 18 Getting started with ou app
Lecture 19 Making a trip request
Lecture 20 Enabling the Google Places API
Lecture 21 Using the Google Places Search Results (origin)
Lecture 22 Using the Map Object / Applying restrictions on Plcaes Search
Lecture 23 Using the Google Places Search Results (destination)
Lecture 24 Using the Directions API query result
Section 4: Getting started with Supabase for the backend
Lecture 25 Introducing Supabase
Lecture 26 Creating a project in Supabase
Lecture 27 Fetching data with Supabase
Lecture 28 Fetching data from the server
Lecture 29 Creating a Geo-Enabled table in Supabase
Lecture 30 Inserting data in the "requests" table
Section 5: Finalizing the app
Lecture 31 Building the request detail page – part 1
Lecture 32 Building the request detail page – part 2
Lecture 33 Using the request data – part 1
Lecture 34 Using the request data – part 2
Lecture 35 Creating the drivers table / Adding drivers
Lecture 36 Fetching the drivers table
Lecture 37 Filtering the drivers by distance – part 1
Lecture 38 Filtering the drivers by distance – part 2
Lecture 39 Drivers’ InfoWindow
Lecture 40 Directions/Route between drivers and the request origin
Lecture 41 Deploying the app to vercel
Lecture 42 Getting a domain name / Updating Google Maps Keys and Credentials
Map Lovers,Anyone Interested in Location-Based App Development,React Developers,Supabase learners

Homepage

www.udemy.com/course/next-js-and-google-maps-api-location-based-ride-requests/