Personal Project
2026.06 - 진행중몇점이야? — MBTI 궁합 점수 테스트
두 사람의 MBTI·나이·혈액형을 넣으면 연인·친구·직장동료·썸 등 관계별 궁합 점수를 AI가 B급 감성으로 분석해주는 무료 테스트입니다. 16개 유형별 궁합 순위와 136개 조합 상세 페이지를 정적 생성해 검색 유입을 만드는 SEO/AEO 실험 프로젝트이기도 합니다.
Next.js 16
React 19
TypeScript
Tailwind CSS v4
Supabase
OpenAI API
Google AdSense

프로젝트 소개
**몇점이야?**는 "우리 궁합 몇 점이야?"라는 가벼운 질문에 30초 안에 답을 주는 토이 프로젝트입니다. 나와 상대방의 MBTI를 고르고 관계 유형을 선택하면 AI가 0~100점 총점과 한 줄 평, 4개 세부 지표를 밈 감성으로 뽑아줍니다. 결과는 고유 링크로 저장돼 친구에게 보내면 같은 결과를 바로 볼 수 있고, 받은 사람은 "나도 해보기"로 입장을 바꿔 이어서 테스트할 수 있습니다.
처음에는 입력과 결과 화면만 있는 단일 페이지였는데, 검색엔진이 볼 수 있는 URL이 홈 하나뿐이라 유입이 거의 없었습니다. 그래서 MBTI 유형별·조합별 콘텐츠 페이지를 정적으로 생성해 검색 유입을 만드는 방향으로 확장했고, 작은 서비스로 트래픽과 광고 수익을 실험하는 트랙의 첫 번째 프로젝트가 되었습니다.
주요 기능
- AI 궁합 분석 — MBTI(필수), 성별·나이·혈액형(선택), 관계 유형 6종(연인·친구·직장동료·가족·소개팅·썸)을 조합해 총점, 한 줄 평, MBTI 궁합·소통 스타일·감성 케미·장기 관계 4개 지표를 JSON Schema 구조화 출력으로 생성
- 결과 공유 — 분석 결과를 Supabase에 저장하고
/r/[id]고유 링크로 재현. 결과별 동적 OG 이미지로 카톡·인스타 미리보기 대응, 공유 유입자용 "나도 해보기" 흐름 - MBTI 궁합표 —
/mbti/[type]유형별 궁합 순위 16장,/pair/[a-b]조합 상세 136장을 빌드 시 정적 생성. 관계별 점수, 잘 맞는 포인트·부딪히는 포인트, 실전 팁, FAQ 수록 - 정밀 분석 CTA — 콘텐츠 페이지에서 URL 파라미터 프리필로 앱에 진입해 나이·혈액형까지 넣은 개인화 결과로 연결
- 비용 방어 — IP 기반 분당·일당 rate limit, 결과 캐싱으로 공유 링크 열람 시 AI 재호출 없음
시스템 아키텍처
- 분석 API (
/api/analyze)- OpenAI Chat Completions에 JSON Schema strict 모드로 결과 구조를 고정하고, 관계 유형별 분석 포커스를 프롬프트로 주입합니다.
OPENAI_BASE_URL을 환경변수로 분리해 Vercel AI Gateway 같은 호환 엔드포인트로 코드 수정 없이 교체할 수 있습니다.
- 저장 (Supabase)
- 분석 입력과 결과를
score_analyses테이블에 저장하고 공유 링크에서 재현합니다. 조회수와 IP는 서버 전용(service role) 클라이언트에서만 다룹니다.
- 분석 입력과 결과를
- 정적 콘텐츠 파이프라인
- 유형 16개·조합 136개 본문은 생성 스크립트로 한 번 만들어 JSON으로 커밋합니다. 런타임 AI 호출이 없어 페이지 전체가 정적 HTML로 서빙됩니다.
- 조합 URL은 알파벳순 소문자 slug 하나만 canonical로 두고, 역순·대문자 접근은 301로 모읍니다.
- 광고 (AdSense)
- 앱 화면에는 하단 고정 배너와 분석 중 화면 광고, 콘텐츠 페이지에는 인아티클 광고를 배치하고, 슬롯 환경변수가 없으면 광고 영역 자체를 렌더하지 않습니다.
SEO / AI 검색 최적화
- 롱테일 페이지: 검색엔진에 노출되는 URL을 1개에서 154개로 확장하고 사이트맵으로 전부 제출
- 한글 표기 키워드: "인프제 엔프피 궁합"처럼 커뮤니티 한글 표기로 검색하는 수요를 title·본문·키워드에 반영
- JSON-LD 스키마: Article, FAQPage, BreadcrumbList, ItemList(유형별 궁합 순위), WebApplication
- 공유 결과 분리: 개인 결과 페이지는 noindex, follow로 두고 조합 페이지로 내부 링크를 흘려보내 콘텐츠 페이지에 크롤링 예산을 집중
- 동적 OG 이미지: 결과·유형·조합 페이지별로 한글 폰트 서브셋을 적용한 OG 이미지 생성
배운 점
- 바이럴 고리는 첫 유입이 있어야 돈다: 공유 링크와 OG 이미지를 잘 만들어도 검색 유입이 0이면 시동이 걸리지 않습니다. 도구형 서비스일수록 검색엔진이 잡을 수 있는 콘텐츠 URL을 먼저 깔아야 한다는 걸 숫자로 확인했습니다.
- AI 콘텐츠는 빌드 타임에: 사용자마다 즉석 생성하는 결과와 별개로, 조합별 콘텐츠는 한 번 생성해 정적으로 두는 편이 비용·속도·SEO 모두에 유리했습니다.
- 공급자 종속 줄이기: 특정 AI 공급자의 크레딧 소진으로 라이브 기능이 멈춘 경험을 계기로, 공급자를 환경변수로 교체할 수 있게 구조를 바꿨습니다.