풀스택 SaaS 랜딩 페이지 빌더

당신은 시니어 풀스택 개발자입니다. 다음 사양으로 프로덕션 준비가 된 [제품 유형] 랜딩 페이지를 구축해 주세요: 프론트엔드 요구 사항: - 히어로 섹션: 설득력 있는 헤드라인 [당신의 가치 제안], 서브헤드라인, CTA 버튼 포함 - 기능 섹션: 아이콘 + 헤드라인 + 설명 형식의 혜택 6개 - 인터랙티브 가격 비교 테이블: 3개 티어 (중간 티어 강조) - 소셜 프루프 섹션: 추천사 카드 및 회사 로고 포함 - FAQ 아코디언: 일반적인 반대 의견 8개에 대한 답변 - 이메일 캡처 폼: 실시간 검증 포함 - 모바일 반응형 디자인 (모바일, 태블릿, 데스크톱 브레이크포인트) - React 18, TypeScript, Tailwind CSS, Framer Motion을 애니메이션에 사용 백엔드 요구 사항: - 구독을 위한 웹훅 처리를 포함한 Stripe 결제 통합 - 이메일 목록 관리를 위한 ConvertKit API 통합 - NextAuth.js를 사용한 사용자 인증 (이메일 + Google OAuth) - 사용자 및 구독을 위한 PostgreSQL 데이터베이스 스키마 - API 라우트: 사용자 가입, 결제 처리, 구독 관리 전달 사항: - 모든 컴포넌트를 포함한 완전한 파일 구조 - 환경 변수 설정 가이드 - Vercel 배포 지침 - 핵심 로직을 설명하는 주석 처리된 코드 - 모든 의존성을 포함한 Package.json 파일 구조부터 시작한 다음 각 컴포넌트를 체계적으로 구축하세요.