[Story] 단어 시험 기능 구현

[DDINGJOO]

상위 Epic

• [Epic] 단어 암기 서비스 구현 #57 [Epic] 단어 암기 서비스 구현

목표

4지선다 단어 시험 기능 구현 (/vocab/test, /vocab/test/result/:id)

화면 구성

시험 설정 화면

┌─────────────────────────────────────────────────────────────┐
│  시험 설정                                                   │
│  ┌─────────────────────────────────────────────────────┐   │
│  │  문제 수: [ 10개 ] [ 20개 ] [ 30개 ]                 │   │
│  │  레벨: [ 전체 ] [ 초급 ] [ 중급 ] [ 고급 ]           │   │
│  │  출제 유형:                                          │   │
│  │  ( ) 한국어 → 영어                                   │   │
│  │  (●) 영어 → 한국어                                   │   │
│  └─────────────────────────────────────────────────────┘   │
│              [ 🎯 시험 시작하기 ]                           │
│  📊 최근 시험 기록                                          │
└─────────────────────────────────────────────────────────────┘

시험 진행 화면

┌─────────────────────────────────────────────────────────────┐
│  문제 8 / 20                               남은시간 04:32   │
│  ━━━━━━━━━━━━━━━━━━━━░░░░░░░░░░░░░░░░  40%                 │
│  ┌─────────────────────────────────────────────────────┐   │
│  │                      사과                            │   │
│  │            다음 중 올바른 영어 단어는?               │   │
│  └─────────────────────────────────────────────────────┘   │
│  ① apple    ② banana    ③ orange    ④ grape              │
└─────────────────────────────────────────────────────────────┘

결과 화면

• 총점, 정답률
• 틀린 문제 복습
• 다시 시험 보기 버튼

사용 API

• POST /vocab/test/{userId}/start - 시험 시작
• POST /vocab/test/{userId}/submit - 답안 제출
• GET /vocab/test/{userId}/results - 시험 결과 목록

하위 태스크

• TestPage 컴포넌트 생성 (설정 화면)
• TestQuestion 컴포넌트 구현 (4지선다)
• 시험 진행 상태 관리 (타이머, 현재 문제)
• 답안 제출 및 결과 처리
• TestResultPage 컴포넌트 구현
• 틀린 문제 복습 기능
• 라우팅 설정 (/vocab/test, /vocab/test/result/:id)

완료 조건

• 시험 설정 후 시작 가능
• 4지선다 문제 표시 및 선택
• 제출 후 결과 화면 표시
• 틀린 문제 확인 가능

[github-actions]

Closed by PR #102