Use the Google Maps API to build a custom map with markers

🔥 Learn how to build a responsive website from a Figma design with HTML, SCSS, JS ➡️ https://coder-coder.com/responsive/

😎 Join the Coder Coder Club and get sneak peeks of videos: https://courses.coder-coder.com/p/club

👕 Get my hoodie here: https://coder-coder.com/merch

____________________

In this video we'll be building a custom styled Google map with multiple custom markers, using the Google Maps JavaScript API.

🔥 Find coding projects and get feedback from DevProjects: https://codemntr.io/devprojects
💻 Get the source code for my custom Google Maps project: https://codemntr.io/coder

0:00 - Intro
0:55 - Create a new Google Cloud project
1:46 - Create a custom map
2:18 - Create the Mario themed map style
6:28 - Get Google Maps API key
7:59 - Building the basic map in the website
13:57 - Customize the map lat/lng and zoom level
15:02 - Adding custom map markers
18:05 - Animating the map marker
18:35 - Adding a pop-up Info Window to marker
20:27 - Loading multiple markers with a for loop
23:18 - Checking out the final map!

____________________

💻 Become a full-stack web dev with Zero to Mastery: https://academy.zerotomastery.io/a/af...

🎨 Get my VS Code theme: https://marketplace.visualstudio.com/...

🔽 FOLLOW CODER CODER
Twitter --   / thecodercoder  
Instagram --   / thecodercoder  


#css #javascript #html