Как подключить google maps в React приложение? 2022

В очередном видео я расскажу как интегрировать гугл карты в реакт приложение
- Как интегрировать карты гугл в реакт приложение?
- Как интегрировать google place api?
- Как использовать геолокацию?
- Настройка регистрация в google maps
- Подключение Maps Js APi && Places API && geocoding API
- Создание ключа
- Создание базовой структуры проекта
- Добавление карты
- Настройка внешнего вида контейнера с картой
- Настройка поведения не зумить при скролле, убрать контролы и т.д.
- Добавление автокомлита use-places-autocomplet
- Добавление react-cool-onclickoutside
- getGeolocation преобразование описания локации в координаты
- Добавление маркера
- Настройка маркера с расположением пользователя
- Кастомизация маркера
- Отрисовка маркеров при клике
- Удаление маркеров с карты
- Браузерна геолокация

00:00:00 Вступление/настройка зависимостей
00:10:05 Добавление компонента карты
00:27:00 Настройка темы для google maps
00:30:35 Добавление autocomplete
00:50:00 Добавление настройка маркера текущего положения
01:16:00 Использование браузерной геолокации

#boringfrontend
#funfrontend
#обучениереакт
#обучениефронтенд

[MonkyKseniya]

Понравилось видео. Видно, что опытный разработчик с приличным стажем и красивым кодом. Спасибо, что делишься своими знаниями)

[tujtihq]

Топовый видос! Очень помог разобраться. Спасибо! Продолжай снимать дальше. Удачи тебе.

[xtnlnoe]

Круто, автору большое спасибо!! google maps react

[ghost]

Гарна подача, хороший приклад.
P.S. на 55:26-55:33 певно контент який планували вирізати

[vitaliinnest]

Приємне відео, дякую. Всього найкращого!

[zaobriy]

Дякую за відео, було дуже корисно. Чекаємо перемогу і новий контент:)

[podpalmoi]

Благодарю автора за классное и подробное видео. Как у тебя сейчас дела, как с работой? Видно, что ты умный и толковый программист.

[ernesttrachuk]

просто топ, огромное спасибо, было бы круто если бы вы сделали обзор на все функции и возможности взаимодействия с картой, большое спасибо
пс. на собесе дали задание по взаимодействию с картой, видос очень помог

[xlbgibf]

Очень крутое видео, спасибо. А есть что-то по построению маршрутов на карте, как это правильно делать?

[c]

Илья, подскажите, пожал. почему может не переходить по адресу и не консолятся гео-координаты? нашёл проблему в data приходит пустой массив.

[kubrakivan]

Відео дуже корисне! Дякую!
Було б дуже добре подивитись відео на тему useCallback(), Directions API and Routes API. Як витягувати дані з маркера чи з інфо windows google і створювати довідник адрес.

[mhersimonyan]

Может кто-то скинуть пожалуйста полный код видео? Ссылка репозитория например

[dvdeulm]

сегодня впервые вижу ваши видео. я как понимаю перестали делать контент и очень жаль. на мой взгляд могли бы неплохо развиться в этом плане!!! спасибо за полезный туториал

[oxynzek]

Спасибо за видео! Подскажи как можно соединять линией маркеры, что бы при добавлении нового маркера появлялась линия от предыдущего и мы получали что то типа маршрута? Есть ли стандартное решение?

[podpalmoi]

Товарищ автор, я сделал дипломный проект и улучшаю его. Верно ли понимаю, что если вдруг случится атака ботов, то с меня могут списать круглую сумму? И сколько там вообще платить надо в случае превышения лимитов?

[tahyc]

почему не работает оба установщика карты?( я уже всё перепробовал, постоянно выдает одну и ту же ошибку

[MrTruth-rcfr]

A нельзя без Гугл клауда? Нет карты банковской у меня -_-

[petroradchenko]

Коллеги, кто собрал проект по этому уроку и он работает? Дайте, пожалуйста ссылку на гит

[oxynzek]

С рефами было не совсем понятно почему мы выкинули строчку bounds…, видео по рефам будет полезно.

[viktordikovich]

Блин нифига не отображается карта! ошибок в консоле нет, счетчик запросов в гугле растёт, но карты нет. Уже и разные библиотеки качал, начинал все сначала, открывал в разных браузерах, и ничего !!! Я пользую webStorm, может из за этого, ,,,)))) уже не знаю. что думать