Как использовать Pan для простой аналитики в приложении Laravel

Введение

При создании веб-сайта или приложения знание как пользователи взаимодействуют с ним, является ключевым фактором для улучшения качества работы. Однако многие инструменты отслеживания сложны, дорогостоящи или не заботятся о конфиденциальности. Именно здесь на помощь приходит Pan. Pan — это простой, дружественный к конфиденциальности инструмент для отслеживания поведения пользователей в приложениях на Laravel, созданный Nuno Maduro и David Hill из команды Laravel.

В моём телеграм канале 📦 Laravel packages был обзор на пакет Pan

Что потребуется

Прежде чем приступить к работе, убедитесь, что у вас подготовлено следующее:

• PHP 8.3 или выше
• Установленный проект Laravel 11+
• Установлен Composer (помогает управлять зависимостями проекта)

Шаг 1 — Установка Pan

Прежде всего, давайте добавим Pan в проект Laravel. Это можно сделать с помощью Composer:

1. Откройте терминал.
2. Перейдите в папку с проектом Laravel.
3. Выполните следующую команду:

composer require panphp/pan

Это установит Pan в проект Laravel.

Теперь выполните команду, необходимую для установки Pan:

php artisan install:pan

Эта команда настроит всё за вас!

Шаг 2 — Отслеживание действий пользователя

Установив Pan, можно отслеживать отдельные элементы сайта. Pan использует атрибут data-pan для отслеживания определённых элементов.

Например, чтобы отследить, когда кто-то нажимает или наводит курсор на кнопку Подписаться, добавьте следующее:

<button data-pan="sign-up-button">Sign Up</button>

Ещё несколько примеров:

<div data-pan="hero-section">Welcome to our site!</div>
<a data-pan="learn-more-link" href="/about">Learn More</a>
<form data-pan="contact-form">
  <!-- Поля формы -->
</form>

Pan автоматически начнёт отслеживать показы, наведение курсора и клики по этим элементам!

Шаг 3 — Просмотр данных отслеживания

Теперь, когда Pan отслеживает элементы, можно просмотреть собранные данные с помощью Artisan:

1. Откройте терминал.
2. Перейдите в папку с проектом.
3. Выполните следующую команду:

php artisan pan

Вы увидите таблицу, показывающую, сколько раз каждый элемент был просмотрен, наведён курсор или кликнут.

Если необходимо посмотреть конкретный элемент, используйте:

php artisan pan --filter=sign-up-button

Замените sign-up-button на элемент, который хотите посмотреть.

Шаг 4 — Настройка Pan (опционально)

По умолчанию Pan отслеживает до 50 элементов, но при необходимости это значение можно изменить. Чтобы настроить Pan, откройте файл AppServiceProvider.php и добавьте:

use Pan\PanConfiguration;

public function register(): void
{
    // Отслеживание конкретных элементов
    PanConfiguration::allowedAnalytics([
        'sign-up-button',
        'contact-form',
    ]);

    // Или увеличьте лимит
    // PanConfiguration::maxAnalytics(10000);

    // Или полностью убрать ограничение
    // PanConfiguration::unlimitedAnalytics();
}

Шаг 5 — Что отслеживает Pan

Вот, что отслеживает Пан:

1. Впечатления: Подсчитывает, сколько раз элемент был показан.
2. Наведения: Подсчитывает, сколько раз пользователи наводят курсор на элемент.
3. Клики: Подсчитывает, сколько раз пользователи кликнули на элемент.

Pan полностью ориентирован на конфиденциальность — он не собирает никаких личных данных о пользователях.

Шаг 6 — Используете данные для улучшения

Отслеживая, как пользователи взаимодействуют с сайтом, Pan может использовать эти данные для его улучшения. Например:

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

Шаг 7 — Очистка отслеживаемых данных

Если вам потребуется очистить отслеживаемые данные Pan, это очень просто:

1. Откройте терминал.
2. Перейдите в папку с проектом.
3. Выполните следующую команду:

php artisan pan:flush

Это сбросит отслеживаемые данные Pan, и можно будет начать с чистого листа.

Заключение

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

Добавив атрибут data-pan и используя команды Artisan, можно отслеживать поведение пользователей и вносить своевременные улучшения в работу сайта или приложения.

Комментарии