# [[Create React App 기반 패션 E-commerce 플랫폼의 Next.js 전환 프로젝트]]

## 📌 Brief Summary
이 프로젝트는 10,000개의 제품을 보유한 패션 전자상거래(E-commerce) 웹사이트를 기존의 Create React App(CRA) 기반 클라이언트 사이드 렌더링(CSR) 환경에서 Next.js로 마이그레이션한 사례입니다 [1]. 기존 CSR 구조로 인해 발생하던 심각한 검색엔진 색인 누락과 성능 저하 문제를 정적 사이트 생성(SSG) 및 점진적 정적 재생성(ISR)을 도입하여 해결했습니다 [2]. 결과적으로 대규모의 색인율 개선, Core Web Vitals(특히 LCP) 성능 향상, 그리고 괄목할 만한 유기적 트래픽 및 수익 증가를 달성했습니다 [2].

## 📖 Core Content
* **도입 배경 및 기존 문제점:**
  * 기존 패션 E-commerce 사이트는 Create React App(CSR)으로 구축되어 검색엔진 최적화(SEO) 및 성능에 큰 취약점을 가지고 있었습니다 [1].
  * 전체 10,000개의 제품 중 40%만 검색엔진에 색인(Index)되었으며, 평균 LCP(Largest Contentful Paint)는 4.2초로 'Poor' 등급, TTFB(Time to First Byte)는 200ms를 기록했습니다 [1].
  * 이 상태에서의 월간 유기적 검색 트래픽은 50,000명 수준이었으며, 유기적 트래픽으로 인한 월 수익은 $200,000이었습니다 [1].

* **주요 변경 사항 및 마이그레이션 전략:**
  * **렌더링 방식 변경:** 카테고리 페이지에는 빌드 타임에 렌더링을 수행하는 정적 사이트 생성(SSG)을 도입하고, 제품 페이지에는 1시간(3600초) 단위로 데이터가 업데이트되는 점진적 정적 재생성(ISR)을 적용했습니다 [2].
  * **구조화된 데이터(Structured Data):** 리치 결과(Rich Results)를 획득하기 위해 제품 스키마(Product Schema)를 추가하여 SEO를 강화했습니다 [2].
  * **이미지 및 코드 최적화:** WebP 형식을 지원하는 Next.js Image 컴포넌트를 사용하여 이미지를 최적화하였으며, 코드 스플리팅을 통해 메인 자바스크립트 번들 크기를 1.8MB에서 320KB로 대폭 축소했습니다 [2].

* **프로젝트 결과 및 비즈니스 성과 (ROI):**
  * 두 명의 엔지니어가 6주간 마이그레이션 작업을 진행한 결과, 제품 색인율이 기존 40%에서 95%로 크게 향상되었습니다 [2, 3].
  * ISR 캐시 히트 덕분에 TTFB는 50ms로 단축되었고, LCP 성능은 1.8초('Good' 등급)로 크게 개선되었습니다 [2].
  * 결과적으로 월간 유기적 트래픽이 70% 증가한 85,000명을 기록했으며, 유기적 검색으로 인한 월 수익은 75% 상승한 $350,000를 달성하여 연간 약 180만 달러(+$150k/월)의 추가 ROI를 창출했습니다 [2, 3].

## 🔗 Knowledge Connections
- **Related Topics:** [[Client-Side Rendering (CSR)]], [[Server-Side Rendering (SSR)]], [[Incremental Static Regeneration (ISR)]], [[Largest Contentful Paint (LCP)]], [[Search Engine Optimization (SEO)]], [[Core Web Vitals]]
- **Projects/Contexts:** [[E-commerce Migration to Next.js]]
- **Contradictions/Notes:** 소스에 따르면 기본적으로 CSR(Create React App 방식)은 인증된 사용자 대시보드나 개인화된 인터페이스에만 적합하며, 트래픽을 유도해야 하는 공개 페이지나 전자상거래 사이트의 경우 검색 엔진이 콘텐츠를 효과적으로 크롤링할 수 있도록 Next.js나 Remix 같은 SSR/SSG 지원 프레임워크를 사용하는 것이 필수적입니다 [3-5]. 

---
*Last updated: 2026-04-26*