GS Fresh Weekly

기획 배경

동네 GS The Fresh 마트의 전단지는 종이로만 배포되거나 이미지 파일로만 존재하여 검색이 불가능했습니다. "이번 주 삼겹살이 세일인가?"를 알기 위해 깨알 같은 글씨의 전단지 이미지를 확대해서 찾아야 하는 불편함이 있었습니다.

솔루션

GS Fresh 웹사이트의 전단지 데이터를 파싱하여 텍스트 검색 가능한 모바일 친화적 UI로 변환했습니다. 추가로 쿠팡 API와 연동하여 "마트 가격 vs 로켓배송 가격" 비교 기능을 제공합니다.

개발 과정

1. 데이터 파싱 (ETL)

• Cheerio를 사용하여 정적인 HTML 구조를 분석했습니다.
• 상품명, 할인가, 원가, 단위(g/개) 정보를 구조화된 JSON 데이터로 추출했습니다.

2. 가격 비교 알고리즘

• 마트 상품명(예: "한돈 삼겹살 500g")에서 핵심 키워드를 추출하여 쿠팡 상품 검색 API를 호출합니다.
• 단위 가격(100g당 가격)을 계산하여 공정한 비교 수치를 제공합니다.

3. UI/UX 디자인

• 장보기 리스트 기능을 추가하여, 특가 상품을 체크해두면 총 예상 금액을 계산해줍니다.
• 다크 모드 지원으로 밤늦게 장을 볼 때 눈이 부시지 않도록 배려했습니다.

트러블 슈팅

문제: 주간 전단지 업데이트 시점에(목요일 0시) 트래픽이 몰려 DB 연결 초과 에러 발생 해결: Supabase Connection Pooling을 설정하고, Next.js의 unstable_cache를 적극 활용하여 DB 히트율을 90% 이상 줄였습니다.