Feature: /admin/projects 데이터베이스 연동 #2
Description
🎯 Feature: /admin/projects 데이터베이스 연동
📋 Description
/admin/projects 페이지를 Mock 데이터에서 Prisma 데이터베이스 연동으로 전환하여 실제 프로젝트 관리 시스템을 구축합니다.
🎯 Goals
- Mock 데이터를 Prisma 데이터베이스로 완전 대체
- Server Actions 기반의 데이터 처리 시스템 구축
- 실시간 통계 및 고급 필터링 기능 구현
- 관리자 권한 기반의 프로젝트 승인/거부 워크플로우 완성
🏗️ Technical Architecture
Data Flow:
Admin Page (Server Component) → Server Actions → Prisma Client → PostgreSQL
Component Strategy:
- Server Components: 데이터 패칭 및 초기 렌더링
- Client Components: 사용자 인터랙션 및 상태 관리
- Server Actions: 모든 데이터 변경 작업
📁 Implementation Scope
Core Features ✨
- 프로젝트 목록 조회: Cursor 기반 페이지네이션
- 실시간 통계: 전체/승인대기/신규/신고 개수
- 고급 필터링: 상태/카테고리/태그/날짜/검색
- 상태 관리: 프로젝트 승인/거부/삭제
- 일괄 작업: 선택된 프로젝트 일괄 처리
Enhanced Features 🚀
- 관리자 노트: 프로젝트별 관리 메모
- 활동 로그: 모든 관리 작업 추적
- 데이터 내보내기: CSV/Excel 형식
- 실시간 알림: 중요 이벤트 알림
🛠️ Technical Implementation
Server Actions Structure
src/lib/actions/admin/
├── project-list.ts # 목록 조회 + 필터링
├── project-stats.ts # 통계 데이터
├── project-approve.ts # 승인 처리
├── project-reject.ts # 거부 처리
├── project-delete.ts # 삭제 처리
├── project-bulk.ts # 일괄 작업
└── project-export.ts # 데이터 내보내기
Database Optimization
- Indexes: 상태, 날짜, 작성자별 복합 인덱스
- Caching: 통계 데이터 5분, 필터 옵션 1시간 캐싱
- Query Optimization: include/select 최적화, N+1 쿼리 방지
Security & Authorization
- 관리자/모더레이터 권한 확인
- 모든 입력값 Zod 스키마 검증
- Rate limiting 및 CSRF 보호
🧪 Testing Strategy
Unit Tests
- Server Actions 로직 테스트
- 필터링 및 페이지네이션 테스트
- 권한 확인 로직 테스트
Integration Tests
- 데이터베이스 쿼리 성능 테스트
- Component 렌더링 테스트
- User interaction 테스트
E2E Tests
- 프로젝트 승인/거부 플로우
- 일괄 작업 시나리오
- 필터 및 검색 기능
📈 Performance Targets
- Initial Load: < 2초 (1000+ 프로젝트)
- Filter Response: < 500ms
- Bulk Operations: < 3초 (100개 항목)
- Database Queries: < 100ms (95th percentile)
🗓️ Implementation Timeline
Phase 1: 기반 구조 (1-2일)
- Server Actions 기본 구조 생성
- 권한 확인 미들웨어 구현
- 입력 검증 스키마 정의
Phase 2: 핵심 기능 (2-3일)
- 프로젝트 목록 조회 구현
- 통계 데이터 생성 로직
- 필터링 및 검색 기능
- 페이지네이션 구현
Phase 3: 관리 기능 (2-3일)
- 프로젝트 상태 변경 기능
- 일괄 작업 처리 로직
- 관리자 노트 시스템
- 활동 로그 기능
Phase 4: UI/UX 최적화 (1-2일)
- Server Component 리팩터링
- 로딩 및 에러 상태 처리
- Optimistic Updates 구현
- 접근성 개선
Phase 5: 테스트 및 배포 (1일)
- 종합 테스트 실행
- 성능 최적화
- 타입체크 및 린팅
- 프로덕션 배포
✅ Definition of Done
- 모든 Mock 데이터가 데이터베이스로 대체됨
- 관리자 권한 확인이 모든 액션에서 작동함
- 프로젝트 상태 변경이 실시간으로 반영됨
- 필터링이 복합 조건에서 정확히 작동함
- 일괄 작업이 대량 데이터에서 안정적으로 동작함
- 모든 테스트가 통과함 (Unit + Integration + E2E)
- TypeScript 에러가 없음
- 성능 목표를 달성함
- 접근성 기준을 준수함
📚 Additional Context
- Database Schema:
prisma/schema.prisma - Current Mock Implementation:
src/components/admin/projects/project-table.tsx - Existing Server Actions:
src/lib/actions/admin/
Priority: High
Complexity: Medium-High
Estimated Points: 13