이 빠른 시작에서는 Google Analytics를 앱에 추가하고 이벤트 로깅을 시작합니다.
Google Analytics에서 앱의 사용 현황 및 행동 데이터를 수집합니다. SDK 다음과 같은 두 가지 기본 유형의 정보를 기록합니다.
- 이벤트: 사용자 행동, 시스템 이벤트, 오류 등 앱에서 발생하는 상황입니다.
- 사용자 속성: 사용자층을 나눈 세그먼트를 기술하고자 개발자가 정의하는 언어 환경설정, 지리적 위치 등의 속성입니다.
Analytics에서 자동으로 이벤트 및 사용자 속성 별도의 코드를 추가하지 않아도 됩니다.
시작하기 전에
아직 추가하지 않았다면 JavaScript에 Firebase를 추가합니다. 프로젝트를 열고 Google Analytics가 사용 설정되어 있는지 확인합니다. 를 실행합니다.
새 Firebase 프로젝트를 만드는 경우 Google Analytics를 사용 설정합니다. 프로젝트 생성 워크플로에서 작성할 수 있습니다
기존 Firebase 프로젝트를 사용하면 Google Analytics 사용 설정됨, 다음으로 이동: 통합
을 클릭하여 사용 설정합니다. > 탭 프로젝트 설정
프로젝트에서 Google Analytics를 사용 설정하면 Firebase 웹 앱이 연결된 Google Analytics개의 데이터 스트림과 연결된 데이터 앱 + 웹 속성.
앱에 Analytics SDK 추가
웹 애플리케이션의 호스팅 방식에 따라 구성이 자동으로 처리되거나 Firebase 구성 객체를 업데이트해야 할 수 있습니다. 웹 앱에서 이미 Google 애널리틱스를 사용하는 경우 기존 gtag.js 태그와 함께 Firebase 사용에 설명된 추가 설정을 지정해야 할 수 있습니다.
코드의 Firebase 구성 객체에
measurementId
가 포함되어 있는지 확인합니다. 사용 설정하면 이 ID가 자동으로 생성됩니다. Analytics를 설정하고 웹 앱을 등록하면 Analytics 서비스를 사용해야 합니다.앱에서 Firebase Hosting를 사용하고 Firebase SDK에 예약된 URL을 사용하는 경우 다음 안내를 따르세요.
Firebase는 자동으로 애플리케이션 구성을 처리합니다. 설정을 완료하려면 프로젝트 설정에 있는 내 앱 카드의 스크립트를 앱의 <body> 태그에 추가합니다(아직 추가하지 않은 경우).
앱에서 예약된 URL을 사용하지 않는 경우: 기존 웹 앱으로 작업하는 경우
measurementId
필드가 포함되도록 코드에서 Firebase 구성 객체를 업데이트합니다. 구성 객체는 다음 예시와 유사합니다.// For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field const firebaseConfig = { apiKey: "AIzaSyCGQ0tYppWFJkuSxBhOpkH0xVDmX245Vdc", authDomain: "project-id.firebaseapp.com", databaseURL: "https://project-id.firebaseio.com", projectId: "project-id", storageBucket: "project-id.appspot.com", messagingSenderId: "637908496727", appId: "2:637908496727:web:a4284b4c99e329d5", measurementId: "G-9VP01NDSXJ" };
아직 진행하지 않았다면 Firebase JS SDK를 설치하고 Firebase를 초기화합니다.
Analytics JS SDK를 추가하고 Analytics를 초기화합니다.
Web
import { initializeApp } from "firebase/app"; import { getAnalytics } from "firebase/analytics"; // TODO: Replace the following with your app's Firebase project configuration // See: https://firebase.google.com/docs/web/learn-more#config-object const firebaseConfig = { // ... }; // Initialize Firebase const app = initializeApp(firebaseConfig); // Initialize Analytics and get a reference to the service const analytics = getAnalytics(app);
Web
import firebase from "firebase/compat/app"; import "firebase/compat/analytics"; // TODO: Replace the following with your app's Firebase project configuration // See: https://firebase.google.com/docs/web/learn-more#config-object const firebaseConfig = { // ... }; // Initialize Firebase firebase.initializeApp(firebaseConfig); // Initialize Analytics and get a reference to the service const analytics = firebase.analytics();
기존 gtag.js 태그와 함께 Firebase 사용
이전에 gtag.js 스니펫을 사용하여 앱에서 Google 애널리틱스를 실행한 경우 다음 중 하나를 수행하려면 앱을 추가로 설정해야 할 수 있습니다.
- Firebase의 Google Analytics 호출을 페이지에 추가하고 다음 작업도 계획합니다.
같은 페이지에서 직접
gtag()
호출을 계속 사용합니다. - 직접
gtag()
호출과 Firebase로 Google Analytics 데이터가 전송되었습니다.
모든 Firebase 서비스에서 이벤트를 사용할 수 있도록 하려면 다음 추가 설정 단계를 완료합니다.
gtag('config', 'GA_MEASUREMENT_ID');
줄을 삭제합니다. 여기서GA_MEASUREMENT_ID
는 Firebase 웹 앱의measurementId
입니다. 페이지의 다른 애널리틱스 속성에 다른 ID가 있으면 해당 구성 줄을 삭제하지 않아도 됩니다.gtag()
로 이벤트를 전송하기 전에firebase.analytics()
를 호출해야 합니다.
그렇지 않으면 gtag()
호출을 통해 ID로 전송된 이벤트는 Firebase와 연결되지 않으며 다른 Firebase 서비스에서 타겟팅할 수 없습니다.
이벤트 로깅 시작
애널리틱스 서비스를 초기화한 후 logEvent()
메서드를 사용하여 이벤트 로깅을 시작할 수 있습니다.
모든 앱에 권장되는 특정 이벤트가 있으며 특정 비즈니스 유형이나 카테고리에 권장되는 이벤트가 있습니다. 추천 이벤트를 사전 정의된 매개변수와 함께 전송해야 합니다. 이렇게 하면 보고서에 세부정보가 최대한 포함되고 향후 기능 및 통합을 즉시 사용할 수 있습니다. 이 섹션에서는 사전 정의된 이벤트 로깅을 보여줍니다. 이벤트 로깅에 대한 자세한 내용은 이벤트 로깅을 참조하세요.
다음 예시에서는 사용자가 앱에서 알림을 수신했음을 나타내는 추천 이벤트를 로깅하는 방법을 보여줍니다.
Web
import { getAnalytics, logEvent } from "firebase/analytics"; const analytics = getAnalytics(); logEvent(analytics, 'notification_received');
Web
firebase.analytics().logEvent('notification_received');
다음 단계
- 각 애널리틱스 보고서 이해하기
- DebugView를 사용하여 이벤트를 확인합니다.
- Firebase 콘솔에서 데이터를 탐색합니다.
- 이벤트 및 사용자 속성에 대한 가이드를 살펴봅니다.
- BigQuery로 데이터를 내보내는 방법을 알아봅니다.