7.2 KiB
7.2 KiB
다음 작업 계획
작성일: 2025-11-25 Phase 1 마무리 및 기능 고도화
✅ 최근 완료된 작업
- 글 분석 및 상호작용 기능 (2025-11-25)
/api/writing/[id]/analyzeAPI 추가- 글 분석 결과에 따른 상호작용 컴포넌트 추가 (
components/interaction/*) - 점수 기반 영역 해금 로직 (
utils/areaLimit.ts)
- 이미지 왜곡 영역 기능 (2025-11-25)
DistortionAreaData모델 추가InteractiveImageViewer컴포넌트 추가- 글 수정 시 왜곡 영역 저장 지원
- 팀 멤버 닉네임 추가 (2025-11-25)
POST /api/team/add-member에 닉네임 파라미터 추가
🔴 최우선 작업 (오늘~내일)
1. Firebase Security Rules 작성 및 배포 ⚡ (30분)
현재 문제: Firestore에 보안 규칙이 없어 누구나 모든 데이터 접근 가능 💥
작업 내용:
1. firestore.rules 파일 생성
2. 컬렉션별 규칙 작성:
- users: 본인만 수정 가능
- teams: 소유자만 수정, 멤버는 읽기
- writings: 본인만 CRUD
- topics: 소유자만 수정
- patternAnalyses: 읽기 전용 (캐시용)
3. Firebase Console에 배포
4. 테스트 (권한 없는 접근 차단 확인)
우선순위: 🔴 높음 (보안 필수)
2. Level 1 실제 작동 테스트 🧪 (30분)
목적: 구현한 UID 기반 중복 체크 로직 검증
테스트 시나리오:
시나리오 A: 첫 로그인
1. npm run dev
2. Level 1 팀 생성 (완전 개방)
3. 로그아웃 (또는 시크릿 모드)
4. 팀 코드 입력 → "철수" 입력
5. 예상: 새 익명 계정 생성 ✅
6. 확인: /team/{teamId} 페이지에서 멤버 확인
시나리오 B: 재로그인 (핵심)
1. 로그아웃
2. 동일 팀 코드 → "철수" 입력
3. 예상: Custom Token으로 기존 계정 로그인 ✅
4. 확인: 이전 글이 그대로 있는지 확인
시나리오 C: 다른 브라우저 (중요)
1. 다른 브라우저 또는 시크릿 모드
2. 동일 팀 코드 → "철수" 입력
3. 예상: 동일 계정으로 로그인 ✅
4. 확인: 크로스 디바이스 로그인 작동
시나리오 D: 정식 계정 이름 중복 (보안)
1. Google 로그인 → 팀 가입 → 닉네임 "영희"
2. 로그아웃
3. 비로그인 상태에서 "영희" 입력
4. 예상: "이미 사용 중인 이름입니다" 에러 ✅
5. 확인: 정식 계정 탈취 방지
시나리오 E: 로그인 상태에서 중복
1. "철수"로 로그인된 상태
2. 팀 참여 시도 → "철수" 입력
3. 예상: "이미 이 팀에 가입되어 있습니다" 에러 ✅
우선순위: 🔴 높음 (복잡한 로직, 검증 필수)
예상 버그:
- Custom Token API 경로 오류 가능성
- 에러 메시지 번역 누락 가능성
- Firebase Admin SDK 권한 문제
3. 코드 정리 및 최적화 🧹 (30분)
체크리스트:
□ console.log 제거 또는 조건부 처리 (process.env.NODE_ENV === 'development')
□ 사용하지 않는 import 제거
□ TODO 코멘트 확인 및 처리
□ 중복 코드 리팩토링
□ 불필요한 any 타입 제거
□ ESLint 경고 수정
대상 파일:
src/services/firebaseAuth.ts(많은 로그)src/components/auth/StudentLoginFlow.tsxsrc/managers/WritingSessionManager.ts(디버그 로그)
우선순위: 🟡 중간
🟡 이번 주 완료 목표
4. 에러 처리 개선 (1시간)
작업 내용:
A. 전역 에러 바운더리
// src/app/[locale]/error.tsx 생성
'use client';
export default function Error({
error,
reset,
}: {
error: Error & { digest?: string };
reset: () => void;
}) {
return (
<Box minH="100vh" display="flex" alignItems="center" justifyContent="center">
<VStack>
<Heading>오류가 발생했습니다</Heading>
<Text>{error.message}</Text>
<Button onClick={reset}>다시 시도</Button>
</VStack>
</Box>
);
}
B. 404 페이지 개선
// src/app/[locale]/not-found.tsx 개선
// 현재: 없음
// 추가: 사용자 친화적 디자인, 홈으로 돌아가기
C. API 에러 통합 처리
// src/utils/apiErrorHandler.ts 생성
// 일관된 에러 토스트 표시
우선순위: 🟡 중간
5. 성능 최적화 체크 (30분)
체크 항목:
□ React DevTools Profiler로 불필요한 리렌더링 확인
□ 번들 크기 분석 (npm run build 후 확인)
□ 이미지 최적화 (Next.js Image 사용)
□ Lighthouse 점수 측정 (목표: 90+)
□ 초기 로딩 속도 (목표: 2초 이내)
예상 개선점:
- WritingEditor 메모이제이션
- 큰 컴포넌트 lazy loading
- 사용하지 않는 라이브러리 제거
우선순위: 🟡 중간
6. Phase 1 문서 최종 검토 (30분)
체크리스트:
□ CLAUDE.md - 최신 정보 반영 확인
□ PROJECT_STRUCTURE.md - 모든 파일 반영
□ ROADMAP.md - 완료 항목 이동
□ API_SPEC.md - 모든 엔드포인트 문서화
□ README.md - 설치/실행 가이드 확인
□ DATA_MODELS.md - 스키마 최신화
우선순위: 🟢 낮음
🟢 다음 주 시작 작업
옵션 A: Phase 2 - 학습 시스템 설계
7. 학습 페이지 설계 (2-3시간)
1. /learn 페이지 와이어프레임
2. Lesson 데이터 모델 설계:
- id, title, content, category, difficulty
- prerequisites (선수 레슨)
- quizzes (연습 문제)
- completionCriteria
3. UI 컴포넌트 설계:
- LessonCard (썸네일, 제목, 난이도)
- LessonContent (이론, 예시)
- QuizSection (문제 풀이)
- ProgressBar (진행률)
8. 첫 레슨 콘텐츠 작성 (1-2시간)
예시: "문장 만들기 첫걸음"
- 이론: 주어와 서술어
- 예시: "나는 달린다", "고양이가 잔다"
- 연습: 주어를 고르세요 (4지선다)
- 평가: 문장 3개 만들기
옵션 B: 베타 테스트 준비
9. 베타 테스터 모집 (1주일)
1. 초등학교 선생님 1-2명 섭외
2. 테스트 계정 준비
3. 사용 가이드 작성
4. 피드백 수집 양식 준비 (Google Forms)
10. 실제 수업 시나리오 테스트
시나리오: 초등 2학년 반 (25명)
1. 선생님이 팀 생성 (Level 2, 명단 등록)
2. 학생들 팀 코드로 로그인
3. 팀 주제 "오늘의 날씨" 작성
4. 선생님 실시간 모니터링
5. 피드백 수집
💡 제 최종 추천 순서
오늘 (1.5시간):
- Firebase Security Rules (30분) ⚡ 최우선
- Level 1 테스트 (30분) 🧪 검증 필수
- 코드 정리 (30분) 🧹 품질 확보
내일 (선택):
- 에러 처리 개선 (1시간) - Phase 1 완성도
- 성능 최적화 (30분) - 사용자 경험
다음 주 (선택 1개):
- 옵션 A: Phase 2 시작 (학습 시스템) - 기능 확장
- 옵션 B: 베타 테스트 준비 - 실사용 피드백
📋 작업 선택 가이드
빠른 출시를 원하면: Firebase Rules → 테스트 → 베타 테스트 기능을 더 만들고 싶으면: Firebase Rules → 테스트 → Phase 2 시작 코드 품질 우선이면: 코드 정리 → 에러 처리 → 성능 최적화
어떤 작업부터 시작할까요?