Bubble.io와 Mixpanel 통합: 단계별 가이드 2024

Bubble.io와 Mixpanel의 통합은 강력한 분석 데이터를 제공함으로써 플랫폼의 성능을 향상시킬 수 있습니다. 아래에는 Bubble.io와 Mixpanel를 통합하는 방법에 대한 자세하고 단계별 가이드가 있습니다.

단계 1: Mixpanel 계정 만들기

시작하려면 Mixpanel 계정이 필요합니다. Mixpanel을 방문하고 "Get Started Free"를 클릭합니다.

1. 이메일과 비밀번호를 제공하여 계정을 생성합니다.
2. 등록 후 나오는 설정 프롬프트를 따릅니다. 그러면 프로젝트 대시보드로 이동하게 됩니다.

단계 2: Mixpanel 토큰 가져오기

Mixpanel 토큰은 프로젝트에 고유합니다. 이는 애플리케이션의 데이터를 Mixpanel 계정과 효과적으로 연결합니다.

1. 대시보드 페이지의 왼쪽 하단에 있는 톱니바퀴 아이콘을 클릭하여 "Settings"를 클릭합니다.
2. "Project settings"를 선택합니다.
3. "Management" 섹션에서 토큰을 복사합니다.

단계 3: Bubble.io에서 새 앱 만들기

이제 Bubble.io로 이동하여 Mixpanel을 통합할 새 앱을 생성해야 합니다.

1. Bubble을 방문하고 로그인합니다.
2. 페이지 오른쪽 상단의 "New App" 버튼을 클릭합니다.
3. 앱의 이름을 지정하고 플랜 및 설정을 선택합니다.
4. 새 앱을 생성하기 위해 "Create"를 클릭합니다.

단계 4: 플러그인 탭 이동

연결을 설정하기 위해 Mixpanel 플러그인을 추가해야 합니다.

1. Bubble.io 앱의 편집기 페이지 왼쪽 메뉴에서 "Plugins"를 클릭합니다.
2. "Add plugins"를 클릭합니다.
3. 플러그인 검색창에 "Mixpanel"을 입력합니다.
4. Mixpanel 플러그인에서 "Install"을 클릭합니다.

단계 5: Mixpanel 플러그인 설정

다음으로, Mixpanel에서 받은 토큰을 사용하여 플러그인을 설정해야 합니다.

1. Mixpanel 플러그인 섹션에서, 복사한 토큰을 "Mixpanel Token" 입력 필드에 붙여넣습니다.
2. 플러그인 목록 아래에 나타나는 플러그인 텍스트를 클릭한 다음 상단의 'Settings'로 이동합니다.
3. 필요한 다른 필드를 설정합니다.

단계 6: 액션 설정

플러그인을 설치한 후 이제 Mixpanel 액션과 이벤트를 설정할 수 있습니다.

1. Bubble.io 앱의 왼쪽 메뉴에서 "Design"으로 이동합니다.
2. 이벤트를 추적하려는 페이지 또는 컴포넌트를 클릭합니다.
3. 속성 바에서 "Start/Edit workflow"을 클릭합니다.
4. "+ Add action" 버튼을 통해 액션을 설정합니다.
5. "Plugins actions> Log event with Mixpanel"을 선택합니다.
6. 적절한 정보; 이벤트 이름 등을 입력합니다.

단계 7: Bubble.io 앱 게시

모든 것이 적용되려면 앱을 게시해야 합니다.

1. Bubble.io의 기본 페이지에서 "Deploy"를 클릭합니다.
2. 'Deploy a new version' 제목 아래에 "Development Version"을 선택합니다.
3. "Deploy Current"을 클릭하고 배포를 확인합니다.

이제, Bubble.io는 Mixpanel과 완전히 통합되었습니다. 이벤트가 설정된 컴포넌트와 상호작용하는 사용자들에 대한 데이터를 Mixpanel이 기록하고 분석합니다.