How to use the Maps JavaScript API with React hooks

Published: 27 October 2022
on channel: Google Maps Platform

16,866

169

In this Geocast, Leigh Halliday shows you the in’s and out’s of using the Maps JavaScript API with React hooks. We’ll show you how to render a map in Google Maps Platform using built-in and custom hooks from the @ubilabs/google-maps-react-hooks package. Watch now!

Resources:
Check out this episodes source code → https://goo.gle/3UgNCLL
Check out these Google Maps React Hooks → https://goo.gle/3gJv9sJ Learn How to load Maps JavaScript API in React with this Geocast → https://goo.gle/3TB9q4H
Learn how to add Place Autocomplete input to a map in React with this Geocast → https://goo.gle/3zga5jJ

Chapters:
0:00 - Intro
0:08 - Rendering the Map
1:07 - Setting up your map options
1:39 - Using the useState hook
3:28 - Adding lat/lng inputs
6:06 - Using the useEffect hook
6:45 - Adding a marker to the map
6:59 - Using the useGoogleMaps hook
7:15 - Using the useRef hook
8:50 - Updating the marker position with useEffect
10:46 - Recap

Watch more episodes of Geocasts → https://goo.gle/Geocasts
Subscribe to Google Maps Platform → http://goo.gle/GMapsPlatform
#Geocasts