Привет, народ. В этой статье мы узнаем, как реализовать Google Analytics в React JS.

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

Настройте учетную запись Google Analytics

Шаг 1: Войдите в Google Analytics.

Шаг 2. Откройте кнопку администратора.

Шаг 3. Перейдите в раздел Создать учетную запись.

Шаг 4: Укажите имя своей учетной записи в деталях учетной записи.

Шаг 5: В настройках свойств введите имя свойства и нажмите «Показать дополнительные параметры».

Шаг 6: Затем активируйте кнопку переключения.

Шаг 7. Введите веб-домен (например, xyz.com) и выберите параметр «Создать только ресурс Universal Analytics». Затем нажмите Далее.

Шаг 8: Заполните информацию о компании и нажмите «Создать», чтобы продолжить.

Шаг 9. После перехода на эту страницу вам понадобится идентификатор отслеживания для внедрения Google Analytics в React-js.

Внедрение Google Analytics в React JS

Шаг 1: Установите пакет npm react-ga.

npm install react-ga --save

Шаг 2. Чтобы инициализировать Google Analytics в своем проекте, добавьте следующую строку в файл App.js или App.tsx.

Шаг 3. Теперь мы создаем компонент высшего порядка (HOC) для отслеживания действий пользователя на каждом маршруте нашего веб-приложения. В компоненте HOC функция pageView регистрирует путь к просматриваемой странице и параметры запроса всякий раз, когда пользователь обращается к веб-странице.

Поздравляем с завершением реализации! Теперь откройте панель инструментов Google Analytics, чтобы просмотреть маршруты, к которым пользователи обращаются в нашем веб-приложении, и регионы, из которых они получают к нему доступ.

Поздравляем! Вы успешно включили Google Analytics для отслеживания просмотров страниц, посещенных вашими пользователями, и важных событий в вашем приложении ReactJS.

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