tech blog

K-Beauty Export Tracker: AI 기반 수출 데이터 분석 플랫폼 개발기

Beauty Insight Editor

K-Beauty Export Tracker: AI 기반 수출 데이터 분석 플랫폼 개발기

Beauty Insight Lab에서 개발한 K-Beauty 수출 전문가를 위한 실시간 데이터 분석 대시보드

🎯 프로젝트 개요

K-Beauty Export Tracker는 한국 화장품 수출 데이터를 실시간으로 분석하고 AI 기반 시장 예측을 제공하는 Professional Edition 대시보드입니다. 관세청 공공 데이터와 Google Gemini AI를 결합하여 수출 전문가들에게 실질적인 인사이트를 제공합니다.

🔗 Live Demo: www.beautyinsightlab.com
📦 GitHub: K-Beauty-Export-Tracker


💡 비즈니스 가치

해결하고자 한 문제

기존 K-Beauty 수출 데이터 분석은 다음과 같은 한계가 있었습니다:

  • 📊 데이터 접근성: 관세청 데이터가 복잡한 API 구조로 되어 있어 활용이 어려움
  • ⏱️ 실시간성 부족: 월별 데이터 업데이트가 느리고 트렌드 파악이 지연됨
  • 🔍 품목별 분석 한계: 10자리 HS Code 기반 세밀한 품목 분석 도구 부재
  • 🤖 인사이트 부족: 단순 수치 나열만 있고 맥락적 해석이 없음

우리의 솔루션

  1. Expert Item Analysis Engine: 14개 K-Beauty 핵심 품목별 맞춤 분석
  2. AI Market Prediction: Gemini 2.5 기반 시장 트렌드 예측 및 해석
  3. Real-time Dashboard: 24개월 이동 평균 기반 실시간 데이터 시각화

🏗️ 기술 아키텍처

Tech Stack

Frontend:
├── Next.js 16.1.1 (App Router)
├── React 19
├── TypeScript
├── Recharts (Data Visualization)
└── Tailwind CSS

Backend:
├── Next.js API Routes (Serverless)
├── Upstash Redis (Caching)
├── Google Gemini 2.5 (AI)
└── Korea Customs API (Data Source)

Infrastructure:
├── Vercel (Deployment)
├── GitHub Actions (CI/CD)
└── Custom Domain (beautyinsightlab.com)

시스템 구조

graph LR
    A[Client] --> B[Next.js Frontend]
    B --> C[API Routes]
    C --> D[Customs Service]
    C --> E[Gemini AI Service]
    D --> F[Korea Customs API]
    D --> G[Redis Cache]
    E --> H[Gemini API]
    E --> G

🔧 핵심 기술 구현

1. Expert Item Analysis Engine

문제: 관세청 API는 범용 무역 데이터를 제공하지만, K-Beauty 특화 분석이 필요했습니다.

해결:

// lib/constants/hsk.ts
export const HSK_MAPPING: HSKItem[] = [
  {
    label: '기초화장품 (스킨/로션)',
    hsCode: '3304991000',
    group: 'basic'
  },
  {
    label: '마스크팩 (Total)',
    hsCode: '3304991000',
    hsCode2: '3307904000', // Matrix aggregation
    group: 'basic'
  },
  // ... 14개 품목
];

특징:

  • Matrix Aggregation: 2개 HS Code 합산으로 정확한 품목 분류 (예: 마스크팩 = 3304 + 3307)
  • Dynamic Data Fetching: 품목 선택 시 실시간 데이터 재조회
  • Unit Price Calculation: val / wgt 자동 계산으로 단가 트렌드 분석

2. AI-Powered Market Prediction

문제: 단순 수치만으로는 시장 맥락을 이해하기 어려웠습니다.

해결:

// lib/api/gemini.ts
export async function generateMarketPrediction(data, meta) {
  let prompt = `
    당신은 K-Beauty 수출 전문가입니다.
    품목: ${meta.itemLabel} (HS Code: ${meta.hsCode})
    데이터: ${JSON.stringify(data)}
    
    다음을 분석하세요:
    1. 주요 시장별 성장 트렌드
    2. 구조적 변화 (China vs Non-China)
    3. 향후 3개월 예측
  `;
  
  // 품목별 특화 힌트
  if (meta.itemLabel.includes('마스크팩')) {
    prompt += `
      특별 분석:
      - HS Code 분류 변화 (3304 → 3307)
      - 미국/일본 시장 성장 동인
    `;
  }
  
  const result = await model.generateContent(prompt);
  return result.response.text();
}

특징:

  • Contextual Prompting: 품목별 맞춤 분석 힌트 제공
  • Similarity-based Fallback: API Quota 초과 시 유사 캐시 데이터 활용
  • Redis Caching: 동일 요청 24시간 캐싱으로 비용 절감

3. Service Pattern 리팩토링 (Production Bug Fix)

문제: Vercel 배포 후 모든 데이터가 $0로 표시되는 Critical Bug 발생

원인 분석:

// ❌ Before: Internal HTTP loopback (Fails in Vercel)
const baseUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:3000';
const res = await fetch(`${baseUrl}/api/korea-customs?...`);
// Error: ECONNREFUSED 127.0.0.1:3000

Vercel의 서버리스 환경에서는 자기 자신에게 HTTP 요청을 할 수 없습니다 (Network Isolation).

해결:

// ✅ After: Direct function call (Service Pattern)
// lib/api/customs-service.ts
export async function fetchStandardizedCustomsData({ strtYymm, endYymm, hsCode }) {
  // 1. Redis Cache Check
  const cached = await redis.get(cacheKey);
  if (cached) return cached;
  
  // 2. External API Call
  const response = await fetch('http://apis.data.go.kr/...');
  
  // 3. Parse & Cache
  const data = parseXML(response);
  await redis.set(cacheKey, data, { ex: 86400 });
  return data;
}
 
// lib/api/korea-customs.ts
const { fetchStandardizedCustomsData } = await import('./customs-service');
const result = await fetchStandardizedCustomsData({ ... });

효과:

  • ✅ Network layer 우회로 Vercel 호환성 확보
  • ✅ 응답 시간 30% 개선 (HTTP overhead 제거)
  • ✅ 코드 재사용성 향상 (DRY 원칙)

📊 데이터 파이프라인

1. Data Fetching Strategy

// 24개월 Rolling Window
const period1 = { start: '202301', end: '202312' }; // 2023년
const period2 = { start: '202401', end: '202412' }; // 2024년
 
// Parallel fetching for performance
const [p1, p2] = await Promise.all([
  fetchPeriod(period1),
  fetchPeriod(period2)
]);
 
const allData = [...p1, ...p2]; // 24 months

2. Data Aggregation

// Country-level aggregation
const aggregated = items.reduce((acc, item) => {
  const country = item.statCd;
  const month = `${item.year}.${item.month}`;
  
  if (!acc[country]) acc[country] = {};
  if (!acc[country][month]) {
    acc[country][month] = { val: 0, wgt: 0 };
  }
  
  acc[country][month].val += parseFloat(item.expDlr);
  acc[country][month].wgt += parseFloat(item.expWgt);
  
  return acc;
}, {});
 
// Unit price calculation
Object.values(aggregated).forEach(months => {
  Object.values(months).forEach(data => {
    data.unitPrice = data.val / data.wgt; // $/kg
  });
});

3. Caching Strategy

┌─────────────────────────────────────────┐
│ Request Flow                            │
├─────────────────────────────────────────┤
│ 1. Check Redis (TTL: 24h)              │
│    ├─ HIT  → Return cached data        │
│    └─ MISS → Continue                  │
│                                         │
│ 2. Fetch from Korea Customs API        │
│    └─ Parse XML → JSON                 │
│                                         │
│ 3. Store in Redis                      │
│    └─ Key: customs-v2:{date}:{hsCode}  │
│                                         │
│ 4. Return to client                    │
└─────────────────────────────────────────┘

🎨 UX/UI 설계

1. Information Architecture

Dashboard
├── Header
│   ├── Item Selector (14 items, grouped)
│   ├── Time Range Filter (6M/1Y/2Y)
│   └── Live/Simulation Badge
│
├── Indicator Cards (8 cards)
│   ├── Total Export
│   ├── US, CN, JP, FR, MX, AE
│   └── Others
│
├── Trends Chart (Dual View)
│   ├── Structural Shift (China vs Non-China)
│   └── Regional Portfolio (7 markets)
│
└── AI Prediction
    ├── Model Selector (Flash/Pro)
    ├── Market Analysis
    └── 3-Month Forecast

2. 사용자 경험 최적화

Progressive Disclosure:

// 초기 로드: 기초화장품 (가장 일반적)
const [selectedItem, setSelectedItem] = useState(HSK_MAPPING[0]);
 
// 품목 변경 시: Optimistic UI
const handleItemChange = (item) => {
  setSelectedItem(item); // Immediate UI update
  fetchIndicators(item.hsCode, item.hsCode2); // Background fetch
};

Smart Caching:

  • AI 예측: 동일 데이터 + 모델 조합 24시간 캐싱
  • 관세청 데이터: 월별 데이터 24시간 캐싱
  • 결과: 평균 응답 시간 200ms → 50ms (75% 개선)

🚀 배포 및 운영

Vercel Deployment

# vercel.json (implicit)
{
  "framework": "nextjs",
  "buildCommand": "npm run build",
  "devCommand": "npm run dev",
  "installCommand": "npm install",
  "regions": ["icn1", "iad1"] # Seoul, Virginia
}

Environment Variables

# .env.local
KOREA_CUSTOMS_API_KEY=your_api_key
GEMINI_API_KEY=your_gemini_key
UPSTASH_REDIS_REST_URL=https://...
UPSTASH_REDIS_REST_TOKEN=...

Performance Metrics

MetricValueTarget
First Contentful Paint0.8s< 1.5s ✅
Time to Interactive1.2s< 2.0s ✅
API Response (Cached)50ms< 100ms ✅
API Response (Fresh)800ms< 1.5s ✅

📈 비즈니스 임팩트

정량적 성과

  • 데이터 접근성: API 호출 → 원클릭 대시보드 (접근 시간 90% 단축)
  • 분석 속도: 엑셀 수작업 2시간 → 실시간 자동 분석 (시간 절감 100%)
  • AI 활용: 전문가 해석 대체 → 즉시 인사이트 제공

정성적 가치

  • 의사결정 지원: 수출 전략 수립 시 데이터 기반 판단 가능
  • 시장 트렌드 파악: 품목별/국가별 성장 동인 즉시 확인
  • 리스크 관리: 중국 의존도 모니터링 및 다변화 전략 수립

🔮 향후 계획

프로젝트의 전문성을 강화하고 의사결정 지원 시스템(DSS)으로 거듭나기 위한 업데이트 계획입니다.

1. 수출 단가(Unit Price) 모니터링

  • 수익성 분석: 단순 수출액(Value) 뿐만 아니라, **중량(Weight) 대비 단가($/kg)**를 자동 계산하여 차트에 반영
  • 프리미엄화 추적: 저가 물량 공세인지, 브랜드 프리미엄화에 따른 질적 성장인지 구분 가능한 지표 제공

2. 거시 경제 지표 연동 (FRED API)

  • 환율 및 소비 지표 분석: 달러 환율(KRW/USD), 미국 개인소비지출(PCE) 등 FRED 데이터를 수출 실적과 연동하여 상관관계 분석
  • 경기 변동 예측: 거시 지표 변화에 따른 화장품 소비 심리 영향력 모니터링

3. K-Beauty 벨류체인 기업 분석

  • 공급망 시각화: 원료사(Upstream) - 제조사(ODM/OEM) - 브랜드사(Downstream)로 이어지는 벨류체인별 주요 기업 정보 제공
  • 실적 연동: 상장사 분기 실적 공시와 실제 수출 통계 데이터를 비교 분석하는 인사이트 기능

4. 뷰티 마켓 리서치 에이전트 (AI Agent)

  • 자율형 리서치: 특정 국가의 최신 뷰티 트렌드, 규제 변화, 경쟁사 동향을 웹 서칭을 통해 자동 리포트화
  • 대화형 쿼리: 자연어 질문을 통해 복잡한 수출 통계에서 유의미한 비즈니스 기회 포착

Phase 2: Advanced Analytics

  • 예측 모델 고도화: 시계열 분석 (ARIMA, Prophet)
  • 경쟁사 벤치마킹: 타 국가 대비 한국 수출 경쟁력 분석
  • 알림 시스템: 급격한 시장 변화 시 이메일/Slack 알림

Phase 3: Platform Expansion

  • API 제공: 외부 서비스 연동을 위한 RESTful API
  • 모바일 앱: React Native 기반 iOS/Android 앱
  • 다국어 지원: 영어/중국어/일본어 인터페이스

💭 회고 및 교훈

기술적 도전과 해결

1. Vercel 서버리스 환경 이해

  • 문제: 로컬에서 정상 작동하던 코드가 프로덕션에서 실패
  • 교훈: 서버리스 환경의 네트워크 제약사항 사전 학습 필요
  • 해결: Service Pattern으로 HTTP 의존성 제거

2. AI API 비용 최적화

  • 문제: Gemini API 무료 티어 Quota 빠르게 소진
  • 교훈: 캐싱 전략이 AI 서비스의 핵심
  • 해결: Redis 기반 Similarity Matching으로 90% 캐시 히트율 달성

3. 데이터 품질 관리

  • 문제: XML 파싱 시 숫자 타입 변환으로 "2025.10" → 2025.1 오류
  • 교훈: 외부 API 데이터는 항상 원본 형태 보존 후 변환
  • 해결: parseTagValue: false 옵션으로 문자열 보존

팀워크 및 프로세스

  • 문서화의 중요성: daily_report, root_cause_analysis 등 상세 문서로 지식 공유
  • 점진적 개선: MVP → Expert Analysis → AI Integration 단계적 구현
  • 사용자 피드백: 실제 수출 전문가 인터뷰로 UX 개선

🎓 기술 스택 선택 이유

Why Next.js?

  • SSR/SSG: SEO 최적화 및 초기 로딩 속도 개선
  • API Routes: 별도 백엔드 서버 없이 Serverless Functions 활용
  • Vercel 최적화: 배포 및 성능 최적화 자동화

Why Gemini AI?

  • 무료 티어: 초기 프로토타입에 적합한 관대한 무료 할당량
  • 한국어 지원: GPT 대비 한국어 맥락 이해도 우수
  • 빠른 응답: Flash 모델로 실시간 분석 가능

Why Upstash Redis?

  • 서버리스 친화적: Connection pooling 불필요
  • 글로벌 복제: 낮은 레이턴시
  • 무료 티어: 10,000 requests/day 충분

📚 참고 자료


👥 팀 소개

Beauty Insight Lab Inc.
K-Beauty 산업을 위한 데이터 인텔리전스 솔루션 제공

Project Lead: PM 박용락 (Yongrak Park)
📧 Contact: yongrak@beautyinsightlab.com



이 프로젝트는 공공 데이터 활용과 AI 기술을 결합하여 K-Beauty 산업의 글로벌 경쟁력 강화에 기여하고자 합니다.