한눈 애널리틱스

먼저 풀어야 했던 문제

• GA4는 무엇을 볼지 알아야 쓸 수 있다이벤트·전환·맞춤 측정기준을 설정하고 보고서를 찾아가야 해서, 작은 사업장은 숫자를 봐도 무엇이 바뀌었는지 모릅니다.
• 늘었다는 말이 우연일 수 있다방문이 적은 주에는 몇 명 차이로도 그래프가 크게 흔들려, 숫자만 보고 “효과가 있었다”고 잘못 판단하기 쉽습니다.
• 쿠키 동의 배너와 개인정보쿠키로 방문자를 쫓으면 동의 절차가 필요하고, IP·연락처가 섞이면 분석 도구가 개인정보 창고가 됩니다.

구현한 기능

• 문장 요약방문·원인·문의·속도·페이지를 최대 4문장으로 말하고, 문장 속 숫자를 누르면 그 숫자가 나온 표가 열립니다.
• 판정 근거문장마다 검사 이름·p값·기준을 함께 보여 줘, 왜 “비슷합니다”라고 했는지 확인할 수 있습니다.
• 다섯 질문 카드어디서 왔나·무엇을 봤나·어디서 나갔나·문의로 이어졌나·빠른가를 카드로 답하고, “자세히”로 마케터용 표를 엽니다.
• 한 번 눌러 거는 조건표의 행을 누르면 그 출처·기기·페이지로 대시보드 전체를 다시 계산하고, 조건과 기간은 주소에 남습니다.
• 설정 없는 문의 흐름전화·문자·메일·카카오 상담 링크와 폼 작성·제출을 따로 설정하지 않아도 셉니다. 입력값은 읽지 않습니다.
• 설치 확인설치 화면이 몇 초마다 첫 방문을 기다렸다가 들어오면 바로 알려 줍니다.

화면 뒤의 구조

• 01 · 추적 스크립트페이지뷰·참여 시간·스크롤·연락 버튼·폼·Web Vitals 를 모아 사전 확인 없는 요청으로 보냅니다. 추적 거부(DNT·GPC)면 보내지 않습니다.
• 02 · 수집 창구도메인·크기·속도를 확인하고 봇을 거른 뒤, 그날의 비밀 소금으로 방문자 해시를 만들어 30분 규칙으로 방문을 판정합니다.
• 03 · 방문 단위 표와 SQL 집계방문 한 건을 한 줄로 저장하고 기간·조건마다 SQL 로 셉니다. 같은 규칙의 메모리 구현이 같은 답을 내는지 계약 테스트로 묶었습니다.
• 04 · 보고서와 문장기간·비교 기간을 정하고, 조건부 이항 검정과 두 비율 z-검정을 통과한 변화만 문장으로 씁니다.

운영 안전장치

• IP 주소·User-Agent 원문·연락처·폼 입력값은 어느 표에도 저장하지 않음
• 방문자 해시의 비밀 소금은 이틀이 지나면 그날 첫 요청 때 지워, 해시를 사람으로 되돌릴 수 없게 함
• 다른 도메인에 붙은 설치 코드·자동화 브라우저·검색 로봇의 요청은 숫자에 넣지 않고, 꾸민 요청은 주소·사이트별 속도 제한으로 막음
• 표본이 적거나 비교 기간이 설치 전이면 “늘었다·줄었다”를 말하지 않음

알려진 제한

• 쿠키를 쓰지 않아 며칠 뒤 다시 온 사람은 알아보지 못합니다. 기간 방문자는 날마다 센 방문자의 합입니다.
• 공개 페이지의 모든 숫자는 가상 스튜디오 사이트의 예시 데이터입니다. 실제 고객 사이트의 수치는 싣지 않았습니다.
• 광고 차단기가 스크립트를 막는 방문은 셀 수 없습니다.
• 로딩 속도(Web Vitals)는 페이지를 새로 불러올 때만 잽니다. 앱형 화면 이동에서는 브라우저가 값을 주지 않습니다.

사용한 기술

Next.js 16 · TypeScript · PostgreSQL · Prisma · Web Crypto · PerformanceObserver · Vitest · Playwright