이벤트 및 메트릭 정의
이벤트 트리거
- 백엔드 추적
  - 추가 속성
  - 컨트롤러 및 API 도우미
- 프론트엔드 추적

내부 이벤트 추적을 위한 빠른 시작

GitLab은 더 효율적이고 확장 가능하며 통합된 추적 API를 제공하기 위해 기존의 RedisHLL 및 Snowplow 추적을 폐기하고 있습니다. 대신, 새로운 track_event (Backend) 및 trackEvent (Frontend) 방법을 구현하고 있습니다. 이 방식을 통해 RedisHLL 카운터를 업데이트하고 기본 구현에 대해 걱정하지 않고 Snowplow 이벤트를 보낼 수 있습니다.

내부 이벤트 추적을 위해 코드에 계기를 부여하려면 다음 세 가지를 수행해야 합니다:

이벤트 정의
하나 이상의 메트릭 정의
이벤트 트리거

이벤트 및 메트릭 정의

gitlab 디렉터리의 internal_events 생성기를 사용하여 이벤트와/또는 메트릭 정의를 생성하려면:

ruby scripts/internal_events/cli.rb

이 CLI는 특정 사용 사례를 기반으로 올바른 정의 파일을 만들고, 계기 설정 및 테스트에 대한 코드 예제를 제공하는 데 도움이 됩니다.

이벤트 트리거

이벤트를 트리거하여 메트릭을 업데이트하는 방법은 백엔드 및 프론트엔드에서 약간 다릅니다. 아래의 관련 섹션을 참조하세요.

백엔드 추적

내부 이벤트를 사용한 백엔드 계기 인스트루먼테이션에 대한 비디오를 시청하세요.

이벤트를 트리거하려면 Gitlab::InternalEventsTracking 모듈의 track_internal_event 메서드를 호출하고 원하는 인수를 지정하세요:

include Gitlab::InternalEventsTracking

track_internal_event(
  "i_code_review_user_apply_suggestion",
  user: user,
  namespace: namespace,
  project: project
)

이 메서드는 자동으로 i_code_review_user_apply_suggestion 이벤트와 관련된 모든 RedisHLL 메트릭을 증가시키고, 명명된 인수 및 표준 컨텍스트(SaaS 전용)와 함께 해당 Snowplow 이벤트를 보냅니다. 또한, 이벤트를 트리거하는 클래스의 이름이 Snowplow 이벤트의 category 속성에 저장됩니다.

project.id와 같은 고유 속성이 지정된 메트릭을 정의한 경우 project 인수를 제공해야 합니다.

user, namespace, project 등을 가능한 한 많이 입력하는 것이 장려됩니다. 이는 데이터 품질을 향상시키고 앞으로 메트릭을 정의하는 데 도움이 됩니다.

namespace 없이 project만 제공하는 경우 project.namespace가 이벤트의 namespace로 사용됩니다.

일부 경우에는 category를 매뉴얼으로 지정하거나 지정하지 않을 수 있습니다. 이 경우 모듈 대신에 InternalEvents.track_event 메서드를 직접 호출할 수 있습니다.

추가 속성

추가 속성은 이벤트 추적 시 전달할 수 있습니다. 주어진 이벤트와 관련된 추가 데이터를 저장하는 데 사용할 수 있습니다. label (문자열), property (문자열) 및 value (숫자) 키로 최대 세 가지 추가 속성을 보낼 수 있습니다.

추가 속성은 additional_properties 해시를 #track_event 호출에 포함하여 전달됩니다:

Gitlab::InternalEvents.track_event(
  "i_code_review_user_apply_suggestion",
  user: user,
  additional_properties: {
    label: 'admin',
    value: 20
  }
)

컨트롤러 및 API 도우미

컨트롤러에 대한 내부 이벤트 추적을 돕는 ProductAnalyticsTracking 도우미 모듈이 있습니다. 특정 컨트롤러 작업에 대한 내부 이벤트를 추적할 수 있습니다:

class Projects::PipelinesController < Projects::ApplicationController
  include ProductAnalyticsTracking
  
  track_internal_event :charts, name: 'p_analytics_ci_cd_pipelines', conditions: -> { should_track_ci_cd_pipelines? }
  
  def charts
    ...
  end
  
  private
  
  def should_track_ci_cd_pipelines?
    params[:chart].blank? || params[:chart] == 'pipelines'
  end
end

도우미 모듈이 이벤트에 대한 현재 프로젝트 및 네임스페이스를 가져올 수 있도록 컨트롤러 본문에 이 두 가지 메서드를 추가해야 합니다:

  private
  
  def tracking_namespace_source
    project.namespace
  end
  
  def tracking_project_source
    project
  end

또한, API 도우미가 있습니다:

track_event(
  event_name,
  user: current_user,
  namespace_id: namespace_id,
  project_id: project_id
)

프론트엔드 추적

페이지의 현재 컨텍스트에서 user.id, namespace.id, 및 project.id 값을 자동으로 전달하는 프론트엔드 추적 호출이 있습니다.

extra, context, label, property, value와 같은 추가 속성을 전달해야 하는 경우 사양이 변경된 snowplow 구현을 사용할 수 있습니다. 이 경우, 우리에게 내부 이벤트에 대한 피드백 이슈에 특정 사용 사례를 알려주세요.

Vue 컴포넌트

Vue 컴포넌트에서 Vue mixin을 사용하여 추적할 수 있습니다.

Vue 컴포넌트 추적을 구현하려면:

InternalEvents 라이브러리를 가져와 mixin 메서드를 호출하세요:

  import { InternalEvents } from '~/tracking';
  const trackingMixin = InternalEvents.mixin();

컴포넌트에서 mixin을 사용하세요:

export default {
  mixins: [trackingMixin],
     
  data() {
    return {
      expanded: false,
    };
  },
};

trackEvent 메서드를 호출하세요. 추적 옵션은 두 번째 매개변수로 전달할 수 있습니다:

this.trackEvent('i_code_review_user_apply_suggestion');

또는 템플릿에서 trackEvent를 사용하세요:

<template>
  <div>
    <button data-testid="toggle" @click="toggle">Toggle</button>
       
    <div v-if="expanded">
      <p>Hello world!</p>
      <button @click="trackEvent('i_code_review_user_apply_suggestion')">Track another event</button>
    </div>
  </div>
</template>

Raw JavaScript

임의의 프론트엔드 JavaScript 코드에서 이벤트를 직접 추적하기 위해 원시 JavaScript 모듈이 제공됩니다. 이는 Mixin을 활용할 수 없는 컴포넌트 콘텍스트 밖에서 사용할 수 있습니다.

import { InternalEvents } from '~/tracking';
InternalEvents.trackEvent('i_code_review_user_apply_suggestion');

추가 속성

이벤트를 추적할 때 추가 속성을 전달할 수 있습니다. 주어진 이벤트와 관련된 추가 데이터를 저장하는 데 사용할 수 있습니다. 키가 label (문자열), property (문자열), value (숫자)인 추가 속성을 최대 세 개까지 전송할 수 있습니다.

Vue Mixin의 경우:

   this.trackEvent('i_code_review_user_apply_suggestion', undefined, {
    label: 'push_event',
    property: 'golang',
    value: 20
   });

원시 JavaScript의 경우:

   InternalEvents.trackEvent('i_code_review_user_apply_suggestion', undefined, {
    label: 'admin',
    property: 'system',
    value: 20
   });

Data-track 속성

이 속성을 사용하면 GitLab 내부 이벤트를 버튼에 대해 추적하려는 경우, Click 핸들러에 JavaScript 코드를 작성할 필요가 없습니다. 대신에 이벤트 값을 가진 data-event-tracking 속성을 추가하기만 하면 작동합니다. 이는 HAML 뷰와 함께 사용할 수도 있습니다.

  <gl-button
    data-event-tracking="i_analytics_dev_ops_adoption"
  >
   Click Me
  </gl-button>

Haml

= render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle',  data: { event_tracking: 'action' }}) do

렌더링 시 내부 이벤트

가끔은 컴포넌트가 렌더링되거나 로드될 때 내부 이벤트를 보내고 싶을 수 있습니다. 이러한 경우에는 data-event-tracking-load="true" 속성을 추가할 수 있습니다:

= render Pajamas::ButtonComponent.new(button_options: { data: { event_tracking_load: 'true', event_tracking: 'i_devops' } }) do
        = _("New project")

내부 이벤트 추적을 위한 빠른 시작

이벤트 및 메트릭 정의

이벤트 트리거

백엔드 추적

추가 속성

컨트롤러 및 API 도우미

프론트엔드 추적

Vue 컴포넌트

Raw JavaScript

추가 속성

Data-track 속성

Haml

렌더링 시 내부 이벤트

도움말

기능 사용 가능성과 제품 평가판

도움받기