Bassip 그로스해킹 대시보드

Neon(Bassip)의 데이터를 Supabase로 매일 동기화하고, Vercel로 배포된 대시보드가 페이지를 열 때마다 Supabase에서 실시간으로 데이터를 불러옵니다. 실제 의뢰인 데이터가 들어있으므로 대시보드 페이지 자체에 로그인(Supabase Auth)이 걸려 있습니다.

Neon (bassip_ai_reader, 원본)
   │  매일 08:00 KST, GitHub Actions
   ▼
Supabase Postgres (읽기 전용 미러 + RLS)
   │  로그인한 사용자만 조회 가능
   ▼
Vercel (docs/index.html 배포) — 매 접속마다 Supabase에서 fetch

GitHub Pages는 개인 계정 Free 플랜에서는 Private 저장소에 못 켭니다 (Pro 이상만 가능). 그래서 Vercel로 배포합니다 — Private 저장소도 그대로 연결되고, 무료 플랜으로 충분합니다.

0. 준비물

• GitHub 계정, Private 저장소로 이 폴더를 push
• Vercel 계정 (무료 플랜으로 충분, GitHub 계정으로 바로 가입 가능) — https://vercel.com
• Supabase 계정 (무료 플랜으로 충분) — https://supabase.com
• Neon(bassip_ai_reader) 연결 문자열 — 이전에 psql로 접속할 때 쓰던 그 문자열

1. Supabase 프로젝트 생성

1. https://supabase.com/dashboard 에서 New Project 생성 (리전은 서울과 가까운 곳 추천)

2. 프로젝트가 만들어지면 Settings → API 에서 다음 두 값을 복사해둡니다.

   • Project URL (예: https://abcdxyz.supabase.co) https://blkelwmejqlofvplrfvp.supabase.co
   • anon public key eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImJsa2Vsd21lanFsb2Z2cGxyZnZwIiwicm9sZSI6ImFub24iLCJpYXQiOjE3ODc4NjU4NjMsImV4cCI6MjEwMzQ0MTg2M30.ieS6WGi1qHgFgJG7C58UWI5Hx1L0ui-lEk9lGiXuZDg

3. Settings → Database → Connection string 에서 URI 형식의 연결 문자열을 복사해둡니다. (이게 SUPABASE_DB_URL — service_role 이 아니라 DB 자체 접속 문자열입니다. 비밀번호는 프로젝트 생성 시 설정한 DB 비밀번호입니다.) postgresql://postgres:[YOUR-PASSWORD]@db.blkelwmejqlofvplrfvp.supabase.co:5432/postgres

2. 스키마 + 초기 데이터 넣기

Supabase 대시보드 SQL Editor에서 아래 파일들을 순서대로 통째로 붙여넣고 실행하세요.

1. supabase/schema.sql — 테이블 3개 + RLS 정책 생성
2. supabase/seed/seed_funnel_rows.sql
3. supabase/seed/seed_case_rows.sql
4. supabase/seed/seed_case_stage_events.sql

(이 seed 파일들은 현재 대시보드에 이미 들어있던 스냅샷을 그대로 옮긴 것이라, 여기까지만 해도 대시보드는 바로 정상 작동합니다. 이후 데이터는 3번의 자동 동기화가 매일 새로 갱신합니다.)

3. Auth — 로그인 계정 만들기 & 회원가입 막기

실제 의뢰인 데이터라서 아무나 로그인할 수 없게 막아야 합니다.

1. Authentication → Providers → Email 에서 "Allow new users to sign up" 을 꺼주세요. (꺼두지 않으면 로그인 화면에 가입 폼이 없어도, anon key를 아는 사람이 브라우저 콘솔에서 직접 회원가입 API를 호출해 새 계정을 만들 수 있습니다.)
2. Authentication → Users → Add user 로 볼 사람의 이메일/비밀번호를 직접 만들어줍니다. (팀원 각자 계정을 만들어도 되고, 공용 계정 하나만 만들어도 됩니다.)

4. 대시보드에 Supabase 값 채우기

docs/index.html 안에서 아래 두 줄을 찾아 1번에서 복사해둔 값으로 바꿉니다.

var SUPABASE_URL = 'https://YOUR-PROJECT-REF.supabase.co';
var SUPABASE_ANON_KEY = 'YOUR-ANON-PUBLIC-KEY';

anon 키는 브라우저 소스에 그대로 노출되지만, RLS 정책이 "로그인한 사용자만 조회"로 막고 있어서 로그인하지 않은 사람은 이 키만으로는 데이터를 하나도 읽을 수 없습니다.

5. GitHub에 올리고 Vercel로 배포하기

이미 GitHub Private 저장소에 push가 끝났다면 이 단계는 건너뛰고 아래 Vercel 설정만 하면 됩니다.

1. https://vercel.com 에서 GitHub 계정으로 로그인합니다.
2. 대시보드에서 Add New... → Project를 누릅니다.
3. 처음이면 GitHub 연동 권한을 요청하는 화면이 뜹니다 — "Only select repositories"를 골라서 growth-analytics 저장소만 접근 허용해도 됩니다(Private 저장소도 문제없이 선택 가능합니다).
4. 저장소 목록에서 growth-analytics를 찾아 Import를 누릅니다.
5. "Configure Project" 화면에서 아래처럼 설정합니다.
   • Framework Preset: Other (자동 인식 안 되면 이걸로 직접 선택)
   • Root Directory: Edit 버튼을 눌러 docs 로 지정 (이게 제일 중요합니다 — 대시보드 파일이 저장소 최상위가 아니라 docs/ 폴더 안에 있기 때문입니다)
   • Build Command, Output Directory: 비워두거나 기본값 그대로 (빌드 과정이 없는 순수 정적 HTML이라 손댈 필요 없음)
6. Deploy 클릭 → 1~2분 뒤 https://growth-analytics-<random>.vercel.app 같은 주소로 배포가 끝납니다. 이후 main에 새로 push할 때마다 Vercel이 자동으로 재배포합니다.

⚠️ 중요: Private 저장소를 연결해도 Vercel 배포 URL 자체는 링크를 아는 사람이면 누구나 열립니다 (GitHub Pages와 마찬가지 — Vercel의 비밀번호 보호 기능은 유료 플랜 전용입니다). 그래서 4번에서 만든 로그인 화면이 실제 접근 제한 역할을 합니다 — 반드시 3번(회원가입 차단 + 계정 직접 생성)을 건너뛰지 마세요.

6. 매일 자동 동기화 (GitHub Actions)

Settings → Secrets and variables → Actions 에서 시크릿 2개를 등록하세요.

• NEON_DATABASE_URL — bassip_ai_reader 읽기전용 연결 문자열
• SUPABASE_DB_URL — 1번에서 복사해둔 Supabase DB 연결 문자열
• META_ACCESS_TOKEN — (선택, 월간 보고서의 CTR/CVR용) 아래 "월간 보고서 — Meta 광고 연동" 참고

.github/workflows/sync-data.yml 이 매일 08:00 KST(UTC 23:00 전날)에 자동으로 sync/sync.sh 를 실행해서 Neon → Supabase로 최신 데이터를 다시 채워 넣습니다. 바로 한 번 테스트해보고 싶으면 저장소의 Actions 탭 → Sync Bassip data → Run workflow 로 수동 실행할 수 있습니다.

sync/neon_export.sql 검증 완료 (2026-08-28)

3개 쿼리 모두 실제 Neon 스키마와 대조 확인했고, psql로 직접 실행해서 정상적으로 JSON을 뽑아내는 것까지 확인했습니다(문의 3,185건/사건 1,055건/단계이력 2,645건 — 마지막 스냅샷보다 늘어난 건 그 사이 실제로 들어온 신규 데이터라 정상입니다). 그대로 쓰면 됩니다. 스키마가 나중에 바뀌면(테이블/컬럼 추가 등) 아래로 다시 확인하세요.

psql "$NEON_DATABASE_URL" -c "\d requests"
psql "$NEON_DATABASE_URL" -c "\d communications"
psql "$NEON_DATABASE_URL" -c "\d quotes"
psql "$NEON_DATABASE_URL" -c "\d contracts"
psql "$NEON_DATABASE_URL" -c "\d cases"
psql "$NEON_DATABASE_URL" -c "\d case_stage_histories"

월간 보고서 — Meta 광고 연동 (2026-10-01 추가)

요약 탭의 "월간 보고서"(리드수/CTR/CVR/유효리드율)는 Neon이 아니라 Meta 광고 계정 (베이스 특허법률사무소, ad_account 1410802980341574)에서 직접 데이터를 가져옵니다. META_ACCESS_TOKEN 시크릿을 등록하기 전까지는 이 표가 비어 있고, 나머지 대시보드는 평소처럼 정상 작동합니다.

토큰 발급 (한 번만 하면 됨, System User 토큰은 만료가 없습니다):

1. https://business.facebook.com 에서 이 광고 계정이 속한 비즈니스(Business ID 693181260125342)의 Business Settings 로 들어갑니다.
2. 왼쪽 메뉴 Users → System Users 에서 시스템 사용자를 하나 새로 만들거나 (역할은 "Employee"로 충분) 기존 것을 씁니다.
3. 그 시스템 사용자를 선택 → Add Assets 로 이 광고 계정(베이스 특허법률사무소)을 추가하고 권한을 "Manage campaigns"(또는 그 이상)로 부여합니다 — 최소 ads_read 권한이 있어야 인사이트 조회가 됩니다.
4. 같은 화면에서 Generate New Token 클릭 → 연결된 앱 선택 → 권한에서 ads_read 체크 → 생성된 토큰을 복사합니다.
5. GitHub 저장소 Settings → Secrets and variables → Actions 에 META_ACCESS_TOKEN 이름으로 등록합니다.

등록 후 다음 동기화(스케줄 또는 Actions 탭에서 수동 Run workflow)부터 2026-05월치부터 지금까지 월별 노출/클릭/지출 데이터가 자동으로 채워지고, 이후 매일 최신 값으로 갱신됩니다(집행 중인 달은 그 달이 끝날 때까지 값이 계속 바뀝니다 — 정상입니다).

리드수·유효리드율은 광고(Meta) 채널로 들어온 문의만 대상으로 계산합니다(CTR/클릭 분모와 같은 채널이어야 CVR=리드/클릭이 의미가 있기 때문). "유효 리드"는 requests.category가 상표/디자인/기타(취급 범위 밖)가 아닌 건 — 즉 특허 상담으로 이어질 가능성이 있는 리드만 셉니다.

폴더 구조

bassip-dashboard/
├── docs/index.html              대시보드 본체 (Vercel Root Directory = docs)
├── supabase/schema.sql          테이블 + RLS 정책
├── supabase/seed/*.sql          초기 데이터 (현재 스냅샷)
├── sync/neon_export.sql         Neon에서 뽑는 3개 쿼리 (검증 완료)
├── sync/sync.sh                 Neon → Supabase 동기화 스크립트
└── .github/workflows/sync-data.yml   매일 자동 실행 워크플로

로컬에서 미리보기

docs/index.html은 순수 정적 파일이라 아무 방법으로나 로컬에서 열어볼 수 있습니다 (단, Supabase 값을 채워야 로그인 화면 다음 단계까지 확인됩니다). 이 컴퓨터엔 Python/Node가 따로 없으므로 PowerShell로 간단히 띄우면 됩니다.

# 이 폴더(docs)에서 실행 — http://localhost:8080/index.html
cd docs
$listener = New-Object System.Net.HttpListener
$listener.Prefixes.Add("http://localhost:8080/")
$listener.Start()
while ($listener.IsListening) {
  $ctx = $listener.GetContext()
  $path = $ctx.Request.Url.LocalPath.TrimStart('/')
  if ([string]::IsNullOrEmpty($path)) { $path = "index.html" }
  $bytes = [System.IO.File]::ReadAllBytes((Join-Path (Get-Location) $path))
  $ctx.Response.OutputStream.Write($bytes, 0, $bytes.Length)
  $ctx.Response.Close()
}