사용자 이벤트 전송

핵클 SDK는 사용자 이벤트를 핵클로 전송하는 기능을 제공합니다.
사용자 행동의 변화가 일어나는 지점마다 이 기능을 활용하면 사용자 행동에 대한 유의미한 데이터를 얻을 수 있으며, 그렇게 모인 데이터를 통해 사용자 행동 분석을 할 수 있습니다.

track

track() 메소드에 이벤트 키를 전달하여 사용자 이벤트를 전송할 수 있습니다. 필요한 경우 사용자 이벤트 전송 시 숫자 값을 value에 넣어 함께 전송할 수 있습니다.

  • value는 number 타입만 넣을 수 있습니다.

예시

사용자가 구매하기 버튼을 눌렀을 때 이벤트를 수집하기 위해 purchase 라는 이벤트 키를 정의했다고 가정합니다. 이 때 구매 금액을 같이 수집하고 싶을 수 있습니다. 이런 경우 value에 구매 금액을 함께 받을 수 있습니다.

import {useTrack} from "@hackler/react-sdk";

/* 예시 1: 이벤트 키만 전송 */
const track = useTrack()
const event = { key: "purchase" }

<Button onClick={() => track(event)}>구매</Button>

/* 예시 2: 이벤트 키와 숫자 값을 함께 전송 */
const track = useTrack()
const event = {
  key: "purchase",
  value: 13200
}

<Button onClick={() => track(event)}>구매</Button>

예시 1에서는 이벤트 키만 전송하고 있으며, 예시 2에서는 구매 금액을 함께 수집하기 위해 value에 구매 금액을 넣은 사례를 보여주고 있습니다.

속성(Property)

핵클 SDK는 이벤트(Event) 객체에 속성을 추가할 수 있도록 지원합니다.

  • 속성은 속성명(key)과 속성값(value)을 한 쌍으로 보내야 합니다.
  • 이벤트 객체에 추가 가능한 속성 개수는 최대 64개입니다.

속성명(key)

  • 일반적인 변수명처럼 만들되 식별하기 쉽게 만드는 것을 권장합니다.
  • 글자수 제한은 64자입니다. (64 characters)
  • 대소문자를 구분하지 않습니다. 예를 들어 amount와 AMOUNT는 같은 키로 인식합니다.

속성값(value)

  • value는 boolean, string, number 타입을 지원합니다.
  • string 타입인 경우 글자수 제한은 64자입니다. (64 characters)
  • number 타입인 경우 정수 최대 15자리, 소수점 최대 6자리를 지원합니다.

예시

아래 예시에서는 세 가지 속성(pay_method, discount_amount, is_discount)을 추가한 것을 확인할 수 있습니다.

const track = useTrack()
const event = {
  key: "purchase",
  value: 13200,
  properties: {
    pay_method: "CARD",
    discount_amount: 800,
    is_discount: true
  }
}

<Button onClick={() => track(event)}>구매</Button>

Did this page help you?