Build and Deploy a Google Maps Travel Companion Application | React.js

5,600 рд╡рд┐рдЪрд╛рд░реЛрдВ
Educational and infotainment Hub

Geolocation, Google Maps API & Google Places API, fetching API data based on the location, data filtering are just some features that make this Travel Advisor App the best Maps Application that you can currently find on YouTube ЁЯФе

ЁЯТ╗JS Mastery Pro - https://jsmastery.pro?discount=youtube
тЬЕ A special YOUTUBE discount code is automatically applied!

тнР RapidAPI - https://rapidapi.com/hub?utm_source=youtube.com/JavaScriptMastery&utm_medium=DevRel&utm_campaign=DevRel
тнР Travel Advisor API - https://rapidapi.com/apidojo/api/travel-advisor?utm_source=youtube.com/JavaScriptMastery&utm_medium=DevRel&utm_campaign=DevRel
тнР Open Weather Map API - https://rapidapi.com/community/api/open-weather-map?utm_source=youtube.com/JavaScriptMastery&utm_medium=DevRel&utm_campaign=DevRel

If you get: "This page can't load Google Maps correctly." and "For development purposes only." that means that you have to enter your billing details. Google requires that to verify your identity and distinguish actual people from robots. You'll be getting free $200 worth of API requests indefinitely and you will NOT be charged.

ЁЯУЪ Materials/References:
GitHub Code (give it a star тнР): https://github.com/adrianhajdi....n/project_travel_adv
Styles & Other Code: https://gist.github.com/adrian....hajdin/ede527249054b

ЁЯУз Join our JavaScript Mastery's Newsletter on Web Development, JavaScript & React to get exclusive programming guides, tips & tricks, and entire e-books: https://resource.jsmasterypro.com/newsletter ЁЯФе

тнРHostinger is my personal recommendation for hosting - https://www.hostinger.com/javascriptmastery
Use the code JAVASCRIPTMASTERY to save up to 91% on all yearly hosting plans.

In this video, you'll learn:
- Advanced React Best Practices, such as folder & file structure, hooks, and refs
- Creating a User Interface using Material UI
- Working with Google Maps API
- fetching data from unlimited sources using RapidAPI

Project created in collaboration with Enyel Sequeira - https://www.enyelsequeira.com
Want me to cover the project you've created? Send me an e-mail ЁЯСМ

ЁЯТ╗ Master JavaScript: https://www.completepathtojavascriptmastery.com/
Use the special promo code "YOUTUBE" on checkout to save $60!

тЭдя╕П Support JavaScript Mastery & Suggest Future Videos:
BuyMeACoffe: https://www.buymeacoffee.com/JSMastery
Patreon: https://www.patreon.com/javascriptmastery

ЁЯМО Find Me Here:
Discord Group: https://discord.gg/n6EdbFJ
Instagram: https://instagram.com/javascriptmastery
Twitter: https://twitter.com/jsmasterypro

ЁЯТ╝ Business Inquiries:
E-mail: javascriptmastery00@gmail.com

Time Stamps ЁЯСЗ
00:00:00 Intro
00:02:10 Setup
00:03:32 Demo
00:07:09 Project Setup
00:13:02 Folder Structure
00:19:19 Header
00:27:40 Map
00:35:42 List
00:45:51 Working with APIs
01:05:08 Place Card
01:20:39 Display Places on the Map
01:27:53 Scroll Places & Filters
01:46:39 Places Search
01:57:24 Weather API
02:04:18 Change Map Styles
02:06:08 ENV
02:10:06 Deployment

  • рд╢реНрд░реЗрдгреА

рдФрд░ рджрд┐рдЦрд╛рдУ

0 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ рдЗрд╕рдХреЗ рдЕрдиреБрд╕рд╛рд░ рдХреНрд░рдордмрджреНрдз рдХрд░реЗрдВ

рдХреЛрдИ рдЯрд┐рдкреНрдкрдгреА рдирд╣реАрдВ рдорд┐рд▓реА

рдЕрдЧрд▓рд╛