지금까지 우리가 한 것을 돌아봅니다. 사이트를 만들고, 도메인을 붙이고, 구글·네이버에 등록했습니다. 그런데 한 가지가 빠졌습니다 — "내 사이트에 사람이 왔는가?"
가게 문은 열었는데 손님이 몇 명 왔는지, 어느 선반에서 오래 서 있었는지, 어디서 왔는지 전혀 모르면 — 내일 어떻게 더 잘할 수 있을지 알 방법이 없습니다.
구글 애널리틱스(GA4)는 내 사이트의 "방문자 카운터 + 메모장"입니다. 무료이고, 코드 두 줄이면 연결됩니다. 오늘 붙이고 나면 방문자 데이터가 쌓이기 시작합니다.
오늘 순서: GA4 계정 만들기(§1) → 추적 코드 삽입(§2) → 실시간 대시보드(§3) → 보고서 읽기(§4) → 애드센스 맛보기(§5).
구글 애널리틱스 공식 페이지(analytics.google.com)에서 계정을 만들고 측정 ID를 받습니다.
측정 ID는 G-XXXXXXXXXX 형태의 코드로, 내 사이트와 애널리틱스를 연결하는 열쇠입니다.
analytics.google.com 접속내이름_사이트 (자유롭게)어떤 플랫폼(웹/앱)에서 데이터를 수집할지 지정하는 단계입니다. 우리는 웹사이트를 만들었으니 웹을 선택합니다.
https://내도메인.kr)G-XXXXXXXXXX) 찾기G-로 시작하는 10자리 측정 ID를 복사했으면 성공.
이 코드가 없으면 다음 단계를 진행할 수 없으니 꼭 보관해두세요.
G-XXXXXXXXXX 표시GA4가 방문자를 추적하려면 내 사이트 HTML에 스크립트 두 줄을 넣어야 합니다. 직접 코드를 쓸 필요 없이, 측정 ID만 알려주면 안티그래비티가 대신 추가해줍니다.
내 사이트에 구글 애널리틱스(GA4) 추적 코드를 추가해줘. 측정 ID는 G-XXXXXXXXXX야. (여기에 내 실제 측정 ID로 바꿔서 붙여넣기) - index.html의 <head> 안에 아래 두 줄을 추가해줘 1) <script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script> 2) gtag 초기화 스크립트 - 다른 부분은 건드리지 마. - Next.js 프로젝트라면 _app.tsx 또는 layout.tsx의 <head>에 넣어줘.
G-XXXXXXXXXX)가 코드 안에 들어가 있는지 확인합니다.
app/layout.tsx 또는 pages/_app.tsx의
<head> 부분에 넣으면 모든 페이지에 자동 적용됩니다.
안티그래비티에 "Next.js 프로젝트야"라고 알려주면 알아서 올바른 위치에 넣어줍니다.
googletagmanager.com 문자열이 보이는지 확인googletagmanager.com/gtag/js?id=G-로 시작하는 줄이 보이면 성공.
배포가 완료됐으면 이제 실시간으로 방문자를 볼 수 있습니다. GA4 데이터가 쌓이기 시작하면 — 지금 이 순간 접속 중인 사람 수가 실시간으로 표시됩니다.
analytics.google.com → 방금 만든 속성 선택실시간 외에도 GA4는 다양한 보고서를 제공합니다. 처음에는 세 가지만 알면 충분합니다. 그리고 8회차에 등록한 Google Search Console과 연결하면 — 어떤 검색어로 들어왔는지도 볼 수 있습니다.
| 보고서 위치 | 볼 수 있는 것 |
|---|---|
| 보고서 → 획득 → 트래픽 획득 |
방문자가 어디서 왔는가 — 직접 입력, 구글 검색, 소셜 미디어(카카오톡 포함) 등 유입 경로별 분류 |
| 보고서 → 사용자 → 기술 세부정보 |
어떤 기기(PC/모바일/태블릿)로 왔는가, 어떤 브라우저를 쓰는가 |
| 보고서 → 참여도 → 페이지 및 화면 |
어떤 페이지를 가장 많이 봤는가, 평균 체류 시간 |
8회차에 등록한 Search Console 계정과 GA4를 연결하면 — "어떤 검색어로 내 사이트에 들어왔는가"를 GA4 안에서 바로 볼 수 있습니다.
내가 만든 사이트에서 용돈을 벌 수도 있습니다. 구글 애드센스는 내 사이트에 광고를 자동으로 게재하고, 방문자가 광고를 볼 때마다 수익을 나눠주는 서비스입니다. 지금 당장 신청할 필요는 없지만, 어떤 것인지 알아두면 코딩을 계속하는 큰 동기가 됩니다.
| 어떻게 작동하나 | 내 사이트에 광고 코드 한 줄 추가 → 구글이 방문자 맞춤 광고 게재 → 광고 1,000번 노출당 약 100~500원 수익 분배 |
| 승인 조건 | 충분한 양의 오리지널 콘텐츠, 저작권 문제 없는 이미지, 개인정보처리방침 페이지, 일정 수준의 방문자 |
| 승인까지 기간 | 신청 후 보통 2~4주. 처음에는 거절될 수도 있습니다 — 콘텐츠를 보완하고 재신청하면 됩니다 |
| 지금 해야 하나 | 콘텐츠가 쌓이고 방문자가 생긴 후에 신청하는 것이 좋습니다. 오늘은 "이런 게 있다"는 것만 알고 가도 충분합니다 |
adsense.google.com을 열어 화면을 구경합니다.
G-로 시작하는 측정 ID를 받았다googletagmanager.com 코드가 보인다adsense.google.com) 화면을 열어봤다| 증상 | 해결 |
|---|---|
| 실시간 보고서에 내가 접속해도 숫자가 안 뜬다 | ① 추적 코드가 실제로 배포됐는지 소스보기 확인 ② 광고 차단 확장프로그램(uBlock 등) 잠깐 끄기 ③ 시크릿 창에서 내 사이트 열기 → 30초 대기 |
| 측정 ID를 잃어버렸다 | GA4 → 관리(톱니바퀴) → 속성 열 → 데이터 스트림 → 스트림 클릭 → 화면 상단에 G-XXXXXXXXXX 표시 |
| Next.js인데 어디에 넣어야 하는지 모르겠다 | 안티그래비티에 "Next.js app router 프로젝트야. GA4 측정 ID G-XXX를 모든 페이지에 적용해줘"라고 요청하면 app/layout.tsx에 자동 추가 |
| Search Console 연결이 안 된다 | GA4와 Search Console 모두 같은 구글 계정으로 로그인했는지 확인. 다른 계정이면 GA4 관리자로 그 계정을 추가하거나, 같은 계정으로 Search Console에 사이트를 다시 등록 |
| 보고서가 영어로 표시된다 | GA4 오른쪽 상단 물음표 아이콘 → 언어 설정 → 한국어. 또는 구글 계정 언어 설정 변경 |
| GA4 계정이 이미 있는 것 같다 | 이전에 만든 계정일 수 있습니다. 왼쪽 상단 계정/속성 선택창에서 기존 것을 쓰거나 새 속성만 추가하면 됩니다 |
| 데이터가 어제 것인데 "데이터 처리 중"이라고 뜬다 | GA4 표준 보고서는 24~48시간 지연이 있습니다. 실시간 데이터는 즉시 반영되지만, 기간별 보고서는 다음날 이후에 정확해집니다 |
| GA4 | Google Analytics 4의 줄임말. 구글이 무료로 제공하는 웹사이트 방문자 분석 도구. 2023년부터 이전 버전(UA)을 대체하는 최신 버전 |
| 측정 ID | G-XXXXXXXXXX 형태의 코드. 내 사이트와 GA4 계정을 연결하는 열쇠. 사이트 코드에 이 ID를 넣어야 데이터가 수집됨 |
| 데이터 스트림 | 어느 채널(웹/앱)에서 데이터를 수집할지 정의하는 설정. 웹사이트 하나당 웹 스트림 하나를 만듦 |
| 실시간 보고서 | 지금 이 순간 내 사이트에 접속 중인 사용자 수와 행동을 보여주는 보고서. 코드 삽입 직후 테스트할 때 가장 먼저 확인하는 곳 |
| 트래픽 획득 | 방문자가 어디서 왔는지를 나타내는 보고서 항목. 직접 입력(Direct), 구글 검색(Organic Search), 소셜(Social, 카카오톡 포함) 등으로 분류됨 |
| 세션 | 한 방문자가 사이트에 접속해서 떠날 때까지의 한 묶음. 30분 이상 활동이 없으면 새 세션으로 계산됨 |
| 애드센스 | 내 사이트에 구글 광고를 달아 수익을 얻는 서비스. 광고 1,000번 노출(1,000 impressions)당 약 100~500원 수준의 수익 발생. 신청 후 구글 심사를 통과해야 사용 가능 |
| 이탈률 | 내 사이트에 방문했다가 다른 페이지 방문 없이 바로 떠난 비율. 높을수록 "첫 페이지에서 원하는 걸 못 찾고 떠났다"는 신호. GA4에서는 '참여율'(이탈률의 반대)로 표시됨 |