GAイベント計測

1import { logEvent } from 'firebase/analytics';
2import React from 'react';
3import { ga } from '../firebase/client';
4
5const GaEvents = () => {
6  const sendEvent = (target: 'cat' | 'dog') => {
7    const name = target === 'cat' ? '猫' : '犬';
8
9    logEvent(ga, 'select_content', {
10      content_type: 'demo',
11      item_id: target,
12    });
13    alert(`${name}のクリックを計測しました`);
14  };
15
16  return (
17    <div>
18      <h1>犬と猫どっちが好きですか?</h1>
19      <div className="flex mt-4 gap-4">
20        <button
21          className="px-2 py-1 rounded border"
22          onClick={() => sendEvent('dog')}
23        >
24          🐶 犬
25        </button>
26        <button
27          className="px-2 py-1 rounded border"
28          onClick={() => sendEvent('cat')}
29        >
30          🐱 猫
31        </button>
32      </div>
33    </div>
34  );
35};
36
37export default GaEvents;

解説

任意のタイミングで以下のコードを記述することでイベントを計測できます。

logEvent(ga, 'イベントタイプ', { // パラメータ });

使用ライブラリ

参考サイト