주요 변경사항: • Clerk 인증 시스템 통합 및 설정 • Supabase 데이터베이스 스키마 설계 및 적용 • JWT 기반 Row Level Security (RLS) 정책 구현 • 기존 Appwrite 인증을 Clerk로 완전 교체 기술적 개선: • 무한 로딩 문제 해결 - Index.tsx 인증 로직 수정 • React root 마운팅 오류 수정 - main.tsx 개선 • CORS 설정 추가 - vite.config.ts 수정 • Sentry 에러 모니터링 통합 추가된 컴포넌트: • AuthGuard: 인증 보호 컴포넌트 • SignIn/SignUp: Clerk 기반 인증 UI • ClerkProvider: Clerk 설정 래퍼 • EnvTest: 개발환경 디버깅 도구 데이터베이스: • user_profiles, transactions, budgets, category_budgets 테이블 • Clerk JWT 토큰 기반 RLS 정책 • 자동 사용자 프로필 생성 및 동기화 Task Master: • Task 11.1, 11.2, 11.4 완료 • 프로젝트 관리 시스템 업데이트 Note: ESLint 정리는 별도 커밋에서 진행 예정 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
62 lines
4.4 KiB
Plaintext
62 lines
4.4 KiB
Plaintext
# Task ID: 11
|
|
# Title: Upgrade Authentication System with Clerk and Add Social Logins
|
|
# Status: pending
|
|
# Dependencies: None
|
|
# Priority: medium
|
|
# Description: Appwrite 시스템을 완전히 제거하고 Clerk 인증과 Supabase 백엔드를 동시에 구현하여 최종 목표 시스템으로 직접 전환합니다. 카카오/네이버 소셜 로그인과 실시간 동기화 기능을 포함합니다.
|
|
# Details:
|
|
기존 Appwrite 시스템을 완전히 제거하고 Clerk React SDK와 Supabase를 통합하여 인증 및 데이터 관리를 구현합니다. 카카오/네이버 소셜 로그인, 실시간 동기화, 데이터 마이그레이션을 포함한 완전한 시스템 교체를 수행합니다. 중간 단계 없이 바로 최종 목표 아키텍처로 전환하여 개발 효율성을 높입니다.
|
|
|
|
# Test Strategy:
|
|
Clerk 인증 플로우 (이메일/비밀번호, 소셜 로그인) 전체 테스트, Supabase 데이터베이스 연결 및 CRUD 작업 테스트, 실시간 동기화 기능 테스트, 데이터 마이그레이션 스크립트 검증, 보안 검토 및 성능 테스트 수행
|
|
|
|
# Subtasks:
|
|
## 1. Supabase 프로젝트 설정 및 데이터베이스 스키마 설계 [pending]
|
|
### Dependencies: None
|
|
### Description: Supabase 프로젝트를 생성하고 기존 데이터 구조에 맞는 데이터베이스 스키마를 설계합니다.
|
|
### Details:
|
|
Supabase 대시보드에서 새 프로젝트 생성, 환경 변수 설정, transactions, budgets, categories 등 주요 테이블 생성, RLS (Row Level Security) 정책 설정, 기존 Appwrite 데이터 구조 분석 및 Supabase 스키마로 매핑
|
|
|
|
## 2. Clerk 설정 및 Supabase Auth 통합 [pending]
|
|
### Dependencies: 11.1
|
|
### Description: Clerk 프로젝트를 생성하고 Supabase Auth와 통합하여 사용자 인증 시스템을 구축합니다.
|
|
### Details:
|
|
Clerk 대시보드에서 프로젝트 생성, React SDK 설치 및 설정, ClerkProvider 설정, Supabase Auth와 Clerk JWT 통합, 사용자 메타데이터 동기화 설정, 환경 변수 구성
|
|
|
|
## 3. 소셜 로그인 통합 (카카오, 네이버) [pending]
|
|
### Dependencies: 11.2
|
|
### Description: Clerk를 통해 카카오와 네이버 소셜 로그인을 설정하고 구현합니다.
|
|
### Details:
|
|
카카오 및 네이버 개발자 콘솔에서 OAuth 앱 등록, Clerk 대시보드에서 소셜 프로바이더 설정, 소셜 로그인 UI 컴포넌트 구현, 사용자 프로필 정보 Supabase 동기화, 에러 처리 로직 구현
|
|
|
|
## 4. 기존 Appwrite 코드 완전 제거 및 Supabase 클라이언트 구현 [pending]
|
|
### Dependencies: 11.2
|
|
### Description: 모든 Appwrite 관련 코드를 제거하고 Supabase 클라이언트를 구현합니다.
|
|
### Details:
|
|
Appwrite SDK 및 관련 코드 제거, Supabase 클라이언트 설정, API 함수들을 Supabase 쿼리로 변경, 타입 정의 업데이트, 상태 관리 로직 수정, 미사용 의존성 정리
|
|
|
|
## 5. 데이터 마이그레이션 스크립트 작성 및 실행 [pending]
|
|
### Dependencies: 11.1, 11.4
|
|
### Description: 기존 Appwrite 데이터를 Supabase로 마이그레이션하는 스크립트를 작성합니다.
|
|
### Details:
|
|
Appwrite 데이터 추출 스크립트 작성, Supabase 형식으로 데이터 변환 로직 구현, 사용자 ID 매핑 로직 구현, 거래 내역 및 예산 데이터 마이그레이션, 데이터 무결성 검증 로직 포함
|
|
|
|
## 6. Supabase CRUD 작업 구현 [pending]
|
|
### Dependencies: 11.4
|
|
### Description: 모든 데이터 CRUD 작업을 Supabase로 변경하고 최적화합니다.
|
|
### Details:
|
|
거래 내역 CRUD 함수를 Supabase로 변경, 예산 관리 함수 업데이트, 카테고리 관리 로직 구현, 쿼리 최적화, 에러 처리 개선, TypeScript 타입 안전성 확보
|
|
|
|
## 7. 실시간 동기화 구현 [pending]
|
|
### Dependencies: 11.6
|
|
### Description: Supabase 실시간 구독을 통해 데이터 동기화 기능을 구현합니다.
|
|
### Details:
|
|
Supabase Realtime 설정, 거래 내역 실시간 업데이트 구독, 예산 변경 실시간 반영, 다중 디바이스 동기화 로직, 네트워크 연결 상태 관리, 충돌 해결 메커니즘 구현
|
|
|
|
## 8. 통합 테스트 및 성능 최적화 [pending]
|
|
### Dependencies: 11.3, 11.5, 11.7
|
|
### Description: 전체 시스템 통합 테스트를 수행하고 성능을 최적화합니다.
|
|
### Details:
|
|
전체 인증 플로우 통합 테스트, 데이터 동기화 성능 측정, 보안 취약점 점검, 사용자 경험 개선, 로딩 시간 최적화, 에러 로깅 및 모니터링 설정
|
|
|