Amplitude 빠른 시작
Amplitude는 세 가지 설치 경로를 제공합니다. 즉, 프레임워크를 감지하고 SDK 연동을 작성하는 CLI 마법사, Cursor 또는 Claude Code 내부에서 사용하기 위한 복사하여 붙여넣기 AI 프롬프트, 그리고 귀하의 사이트의 <head>에 드롭되는 브라우저 스니펫입니다. 세 가지 모두 동일한 Amplitude 프로젝트로 데이터를 전송하므로 가장 빠른 옵션으로 시작하고 나중에 전환할 수 있습니다.
자신에게 가장 적합한 경로를 선택하십시오.
마법사 CLI
전체 SDK 설정
개발자나 터미널을 익숙하게 사용하는 사람에게 적합합니다. Wizard가 사용자의 프레임워크를 감지하고, Amplitude를 통해 사용자를 인증하며, 핵심 구현 흐름을 연결합니다.
- 전체 SDK 설정.
- AI가 생성한 사용자 지정 이벤트.
- MCP, Slack, Teams 연동.
AI 프롬프트
로우코드 설정
AI 코딩 도구를 사용하는 팀에게 적합합니다. 하나의 프롬프트를 Cursor, Claude Code, Copilot 또는 다른 도우미에 붙여넣고 구현 단계를 처리하도록 하세요.
- 전체 SDK 설정.
- 자동 캡처 및 세션 리플레이.
- 클라이언트측 초기화 지침.
브라우저 스니펫
붙여넣기 방식의 설치
가장 빠른 설정을 원하는 웹 팀에 적합합니다. 사이트의 <head>에 스크립트 태그 하나를 추가하면 번들러 없이도 브라우저 데이터 수집을 시작할 수 있습니다.
- 스크립트 태그 설치.
- 자동 캡처.
- 세션 리플레이 및 원격 구성.
마법사 CLI
개발자를 위한 전체 SDK 설정. 마법사는 Amplitude를 통해 사용자를 인증하고, 사용자의 프레임워크를 감지하며, 사용자 지정 이벤트를 제안하고, 데이터가 프로젝트에 제대로 도달했는지 확인한 후 종료됩니다.
제공 혜택
프레임워크 감지를 포함한 전체 SDK 설정.
자동 캡처, 세션, 클릭, 페이지 뷰 및 양식 포함.
세션 리플레이, 기능 실험, 및 가이드 및 설문조사.
AI에서 생성된 맞춤형 이벤트와 Amplitude MCP, Slack, Teams 연동.
Node.js 20이 필요합니다.
실행
설치 마법사 실행
터미널에서 명령어를 실행하거나, 터미널 내부의 Claude Code에서 명령어를 실행하십시오.
bashnpx @amplitude/wizard추가
API 키 추가
마법사가 메시지를 표시할 때 추적할 프로젝트의 API 키를 붙여넣습니다.
API 키를 찾을 수 있는 곳
_설정 > 프로젝트_로 이동하여 추적하려는 프로젝트의 API 키를 복사하십시오. API 키가 필요하십니까? 무료 Amplitude 계정을 만드세요.
팁
- 자동 감지 대신
--menu을 사용하여 프레임워크를 직접 선택하십시오. - 마법사 진행 중
tab을(를) 눌러 질문을 하거나 피드백을 보냅니다.
AI 프롬프트
AI 어시스턴트를 이용한 로우코드 설정. 이 프롬프트를 AI 코딩 도구에 복사하여 전체 마법사 흐름을 실행하지 않고도 JavaScript 웹 앱용 Amplitude Browser SDK를 설정할 수 있습니다.
AI 프롬프트로 설정
AI 도구가 사용자 대신 코드를 변경하도록 하려면 이 옵션을 사용하십시오. Amplitude가 프레임워크를 감지하고 자동으로 이벤트를 제안하도록 하려면 대신 Wizard CLI를 사용하십시오.
제공 혜택
JavaScript 웹 앱을 위한 전체 SDK 설정.
기능 플래그 및 가이드를 위한 원격 구성.
복사
프롬프트를 AI 도구에 복사
프롬프트를 Cursor, Claude Code, Copilot 또는 프로젝트를 편집할 수 있는 다른 코딩 어시스턴트에 붙여 넣으십시오.
textInstall and configure Amplitude for this JavaScript web application. Use API key: AMPLITUDE_API_KEY Requirements: - Run the implementation only on the client. - Initialize Amplitude once during app load. - Install the correct browser package for this project. - Enable fetchRemoteConfig: true. - Enable autocapture for attribution, page views, sessions, element interactions, form interactions, and file downloads. - Enable Session Replay with sampleRate: 1. - Preserve the project's existing TypeScript and framework patterns.검토
생성된 변경사항 검토
어시스턴트가 SDK를 설치했고, 올바른 클라이언트 진입점에서 이를 초기화했으며, 코드를 클라이언트측에 보관했는지 확인하십시오.
팁
- 프롬프트를 복사하기 전에 코드 블록에서 API 키 버튼을 클릭하여 키를 삽입합니다.
- 여전히 프로젝트와 API 키가 필요한 경우 무료 Amplitude 계정을 만드십시오.
브라우저 스니펫
웹사이트용 간편한 붙여넣기 방식의 설치. 빌드 단계나 npm 패키지 없이 가장 빠른 브라우저 설치를 원할 경우, 이 스크립트를 사이트의 <head>에 붙여 넣으십시오.
브라우저 조각을 사용하여 설정정적 사이트, CMS 기반 사이트 또는 스크립트 태그를 설치하는 것이 SDK 설치보다 쉬운 모든 프로젝트에 이 옵션을 사용하십시오.
프레임워크 인식 설정을 원할 경우 마법사 CLI 를 대신 사용하십시오.
제공되는 기능
번들러 없이 스크립트 태그로 설치
기능 플래그 원격 구성.
붙여넣기
스니펫을 사이트의 `<head>`에 붙여넣기
추적하고 싶은 모든 페이지에 이를 추가하십시오.
html<script src="https://cdn.amplitude.com/script/AMPLITUDE_API_KEY.js"></script> <script> window.amplitude.add(window.sessionReplay.plugin({ sampleRate: 1 })); window.amplitude.init("AMPLITUDE_API_KEY", { fetchRemoteConfig: true, autocapture: { attribution: true, fileDownloads: true, formInteractions: true, pageViews: true, sessions: true, elementInteractions: true, networkTracking: true, webVitals: true, frustrationInteractions: true, }, }); </script>설정
API 키 설정 및 페이지 로드
자리 표시자를 프로젝트의 API 키로 바꾸고, 브라우저에서 추적 대상 페이지를 로드하십시오.
팁
- 코드 블록에서 API 키 버튼을 클릭하여 코드 조각을 복사하기 전에 키를 삽입하십시오.
- 프로젝트에서 EU 데이터 상주를 사용하는 경우 EU CDN 호스트를 사용하십시오.
- 프로젝트와 API 키가 필요하다면 무료 Amplitude 계정을 만드세요.
다음 단계를 수행하십시오.
데이터가 흐르기 시작한 후 이 가이드를 사용하여 구현을 확장하십시오.
Amplitude MCP 서버
워크플로를 벗어나지 않고 Claude, Cursor 또는 기타 MCP 호환 클라이언트에서 분석 데이터를 쿼리할 수 있습니다.
Claude Code 플러그인
Claude Code용 Amplitude 플러그인을 설치하여 차트, 대시보드 및 계측 작업을 위한 내장 슬래시 명령을 이용하세요.
맞춤형 이벤트
자동 캡처가 기본 사항을 처리한 후, 비즈니스에 중요한 제품 이벤트를 추적하십시오.
사용자 식별
익명의 활동을 알려진 사용자와 연결하여 세션과 기기 전반에 걸친 행동을 분석할 수 있습니다.
그룹 분석
사용자 그룹을 사용하여 계정, 작업 공간 또는 팀 수준에서 행동을 분석합니다.
세션 리플레이
이벤트 데이터와 함께 실제 사용자 세션을 관찰하여 마찰, 혼란, 중단 지점을 찾아냅니다.
이 섹션의 추가 정보
이 내용이 도움이 되었나요?