Releases: boostcampwm2025/web21-funda
Releases · boostcampwm2025/web21-funda
v2.1.0 (February 6, 2026)
Funda Release Notes — v2.1.0
이번 v2.1.0 버전은 마스코트 ‘펀디(Fundy)’의 인터랙션 고도화, 오늘의 목표 & 보상 시스템 정식 도입, 그리고 Redis 캐싱 및 Sentry · Grafana 기반의 성능·모니터링 강화에 집중한 업데이트입니다. 사용자는 더 몰입감 있는 학습 경험을, 시스템은 더 빠르고 안정적인 구조를 갖추게 되었습니다.
📦 주요 기능 추가
🦊 마스코트 ‘펀디(Fundy)’ 인터랙션 고도화
- 시선 & 모션 트래킹(Eye Tracking):
- 사용자의 마우스 위치와 상호작용에 따라 시선과 고개가 자연스럽게 움직이도록 개선했습니다.
- 상황별 액션 컨트롤 확장:
- 트로피 애니메이션, 화난 표정, 안녕 포즈(helloAction) 등 다양한 리액션을 추가했습니다.
- 꼬리 흔들기, 눈 깜빡임(Blink) 등 세밀한 애니메이션 디테일을 보강했습니다.
- 퀴즈 인터미션 애니메이션:
- 문제 전환 구간에서 캐릭터 애니메이션을 노출하여 학습 흐름의 몰입도를 높였습니다.
- Play with Fundy:
- 사이드바에 ‘펀디와 놀기’ 메뉴를 추가하고, 전용 렌더링 환경에서 캐릭터와 상호작용할 수 있도록 했습니다.
💎 오늘의 목표 & 보상 시스템
- 일일 목표 달성 보상:
- ‘오늘의 목표’ 달성 시 하루 1회 다이아 보상이 지급됩니다.
- 보상 수령 시 프로필 정보가 즉시 Refetch 되어 화면에 반영됩니다.
- 진행률 가시화:
- 사이드바 및 헤더에서 오늘의 목표 진행 바를 확인할 수 있습니다.
- 배틀 모드에서도 현재 문제 상태에 맞는 진행률이 정확히 반영되도록 개선했습니다.
🚀 성능 최적화 & 모니터링 아키텍처 (Core & DevOps)
- Redis 전방위 캐싱 적용:
- 주간/전체 랭킹, 프로필 통계, 학습 개요(Overview)에 캐싱을 적용했습니다.
- 필드·유닛·스텝 메타데이터 및 퀴즈 응답 변환 결과까지 캐싱하여 DB 부하를 대폭 감소시켰습니다.
- 에러 트래킹 및 가시성 강화:
- Sentry:
- 프론트엔드 에러 바운더리 및 소켓 통신 에러까지 추적하도록 연동했습니다.
- Source Map 설정을 통해 배포 환경에서도 정확한 에러 위치를 파악할 수 있습니다.
- Alloy & Grafana:
- Promtail에서 Alloy(logs-only)로 전환하여 Loki 로그 전송 효율을 개선했습니다.
- Slack 연동 알림을 통해 장애 인지 속도를 향상시켰습니다.
- Sentry:
- 압축 및 전송 최적화:
- 프론트엔드 에셋 및 API 응답에 Brotli/Gzip 압축을 적용하여 전송 효율을 개선했습니다.
🛠️ 관리자 백오피스(Back-office) 강화
- 캐릭터 관리 기능 추가:
- 캐릭터 노출 순서 및 활성화 상태(isActive)를 직접 제어할 수 있도록 개선했습니다.
- 학습 개요 관리:
- 유닛별 Overview 수정 및 캐시 초기화 기능을 추가하여 운영 편의성을 높였습니다.
🛠️ 개선 및 리팩터링
- UI/UX & 로딩 경험 개선:
- 페이지 이동이나 새로고침 시 사이드바가 유지되도록 라우팅 구조를 개선했습니다.
- 하단 프로필 버튼에 Skeleton 로딩을 적용해 시각적 끊김을 최소화했습니다.
- 접근성(A11y) 강화:
- 시멘틱 태그(div → section, main)를 적용했습니다.
- useId를 활용한 고유 ID 관리 및 키보드 포커스, aria-label 지원을 강화했습니다.
- 데이터 흐름 개선:
- 로그인 후 이전 페이지로 복귀하도록 세션 스토리지 기반 리다이렉션 로직을 개선했습니다.
- 소켓 리스너 중복 등록을 방지하여 배틀 리소스 낭비를 차단했습니다.
- 모바일 사용성 개선:
- 가로 스크롤 제거(overflow-x: clip)
- 반응형 랭크 바 스타일 수정 및 사이드바 하단 레이아웃 고정
🐛 버그 수정
- 인증 & 세션 관련:
- 로그아웃 시 리다이렉션 오류를 수정했습니다.
- 로그인 후 이전 페이지로 돌아가지 않던 문제를 해결했습니다.
- 랭킹 & 데이터 오류:
- 유저별 다이아 조회 누락 버그를 수정했습니다.
- 전체 랭킹을 XP 기준으로 정확히 정렬하도록 로직을 보정했습니다.
- 배틀 안정성:
- 배틀 모드에서 새로고침 시 방장 권한이 유실되던 문제를 해결했습니다.
- UI & 사운드 버그:
- 타이머 사운드 중복 재생 문제를 해결했습니다.
- 탭 복귀 시 진행 바가 초기화되던 현상과 모바일 가로 스크롤 문제를 수정했습니다.
- 배포 안정성:
- Loki, Grafana, Dockerfile 설정 오류를 수정하여 CI/CD 파이프라인 안정성을 확보했습니다.
⚙️ 인프라 / 기타
- 테스트 자동화:
- Playwright 기반 E2E 테스트(로그인, 퀴즈 풀이, 프로필 변경, 랭킹 조회)를 추가했습니다.
- 에셋 및 리소스 정비:
- 잔디(Streak) 레벨별 수치 조정
- 고유 티어 아이콘 추가 및 리소스 정리
v2.1.0 릴리즈를 통해 Funda는 더 살아있는 캐릭터와 함께, 더 빠르고 안정적인 학습 환경을 제공합니다. 매일의 목표를 달성하며 펀디와 함께 성장해 보세요 🦊✨
v2.0.0 (January 29, 2026)
Funda Release Notes — v2.0.0
이번 v2.0.0 버전은 Socket.io 기반의 실시간 배틀 인프라 구축, Blender-Three.js 캐릭터 파이프라인 완성, 그리고 소셜 인터랙션 강화를 통해 서비스의 핵심 사용자 경험을 한 단계 끌어올린 대규모 업데이트입니다.
📦 주요 기능 추가
⚡ 실시간 배틀 퀴즈(Battle Mode) 고도화
- Socket.io 기반 실시간 엔진:
- 전체 플로우 안정화: 대기방(battle:ready) → 시작 → 진행 → 결과 공개(battle:result)로 이어지는 정밀한 실시간 동기화 프로세스를 완결했습니다.
- Soft Disconnect 도입: 새로고침이나 일시적인 네트워크 끊김 시에도 기존 client_id를 참조하여 참여 정보와 점수를 유지하며 목록을 복원하는 재접속 로직을 구현했습니다.
- 서버 사이드 제어: NestJS Gateway(OnGatewayConnection, OnGatewayDisconnect)를 통해 클라이언트의 접속 상태를 실시간으로 추적하며, 호스트 이탈 시 다음 참여자에게 권한을 자동 위임합니다.
- 실시간 인터랙션:
- 점수 변동 시 숫자가 부드럽게 올라가는 카운팅 애니메이션(useAnimatedNumber) 과 순위 재정렬 슬라이드 효과를 적용했습니다.
- 결과 페이지에서 내 카드를 상단에 고정하여 가독성을 개선하고 공동 순위 계산 로직을 추가했습니다.
🦊 3D 캐릭터 시스템 및 파이프라인 (Blender to Three.js)
- 에셋 파이프라인 완성: Blender에서 정밀하게 제작된 마스코트 북극 여우(Fundy) 모델을
glTF/GLB형식으로 Three.js 환경에 성공적으로 이식했습니다. - 렌더링 및 재질 최적화:
- Three.js 내 라이팅(Lighting) 설정을 최적화하여 3D 모델의 입체감을 살렸습니다.
- 모델의 눈(Iris)과 흰자가 자연스럽게 상호작용하도록 재질(Material)을 교체하고 보정했습니다.
- 애니메이션 컨트롤: Blender에서 작업한 리깅 데이터를 Three.js AnimationMixer로 연동하여 상황별 리액션(눈 깜빡이기, 꼬리 흔들기 등)을 구현했습니다.
👤 프로필 및 소셜 기능 확장
- 소셜 네트워크: 사용자 간 팔로잉/팔로워 시스템과 친구 목록 모달을 추가하여 연결성을 강화했습니다.
- 개인화 프로필: 학습 통계 및 활동 정보를 시각적으로 개편하고 내/타인 프로필 구분 렌더링을 처리했습니다.
🛠️ 관리자 백오피스(Back-office) 강화
- 콘텐츠 관리: 퀴즈 다중 파일 업로드 지원 및 학습 유닛별 개요(Overview) 편집 기능을 추가했습니다.
- 데이터 모니터링: 전체 사용자 랭킹 조회 및 신고 목록 관리 페이지를 분리하여 운영 효율을 높였습니다.
🛠️ 개선 및 리팩터링
- UI/UX 정밀 고도화:
- 컴포넌트 분리: 거대했던 Landing, Profile 페이지를 기능별 폴더로 분리하고 로드맵 유닛 카드의 레이아웃을 최적화했습니다.
- 디자인 일관성: 버튼 Shadow 크기를 rem 단위로 통일하고 상태 기반(in_progress) 선언적 렌더링 구조로 개편했습니다.
- 성능 최적화:
- 스토어 구독 최적화: useBattleStore 선택적 구독을 통해 실시간 통신 중 발생하는 불필요한 리렌더링을 대폭 제거했습니다.
- 공통 서비스 분리: 퀴즈 정답 판별 및 채점 로직을 QuizResultService로 통합하여 코드 재사용성을 확보했습니다.
🐛 버그 수정
- 배틀 및 소켓 안정화:
- 퀴즈 재시작 시 이전 점수, 퀴즈 ID, 문제 데이터가 초기화되지 않던 문제를 해결했습니다.
- 새로고침·이탈 시 방 상태 및 참가자 상태 불일치 문제를 해결하고, invalid 상태 진입 시 올바른 경로(/battle)로 이동하도록 수정했습니다.
- 배틀 중 매칭 문제가 노출되던 현상을 차단하고 정답률 0% 버그를 수정했습니다.
- 렌더링 오류:
- 퀴즈 질문 내 마크다운 코드 블록(```)이 백틱과 함께 노출되던 문제를 textParser 개선으로 해결했습니다.
- 하드코딩된 텍스트 데이터를 제거하고 동적 데이터 기반 렌더링으로 전환했습니다.
⚙️ 인프라/기타
- 소켓 환경 정비: Nginx 소켓 처리(Upgrade Header) 보강 및 vite_socket_url 환경 변수 설정을 통해 서버 안정성을 높였습니다.
- 에셋 및 리소스: 마이페이지 전용 SVG 아이콘, 결과 페이지 메달 이미지 등 신규 에셋을 추가하고 테스트용 페이지를 정리했습니다.
v2.0.0 릴리즈를 통해 Funda는 이제 3D 캐릭터와의 상호작용과 실시간 경쟁이 결합된 역동적인 학습 플랫폼으로 완성되었습니다. 이제 더욱 생생해진 캐릭터 Fundy와 함께 경쟁하며 성장해 보세요!
v1.0.1 (January 16, 2026)
Funda Release Notes — v1.0.1
이번 릴리즈에서는 학습 페이지 개선, 퀴즈 종료 후 데이터 업데이트, UI 안정성 강화, 그리고 브랜드 일관성 향상을 위한 로고 추가 등이 업데이트 되었습니다. 아래에서 각 변경 사항을 요약합니다.
🎨 UI/UX 개선
- Learn 페이지 리팩터링 및 UI 수정
- 기존 Learn 페이지의 컴포넌트 구조를 리팩터링하고 UI를 손봤습니다. 이를 통해 레이아웃이 더 깔끔해지고 학습 진행 상황을 확인하기 편리해졌습니다
- 사이드바에 로고 추가
- 앱의 브랜드 아이덴티티를 강화하기 위해 사이드바 상단에 로고를 삽입했습니다. 사용자들이 사이트를 이용하며 브랜드를 인식할 수 있도록 디자인을 개선했습니다.
📈 기능 개선
- 퀴즈 종료 후 사용자 정보 업데이트
- 퀴즈가 끝난 뒤에 사용자 정보(경험치 등)를 즉시 업데이트하도록 변경했습니다. 이를 통해 퀴즈 결과가 실시간으로 반영되며, 사용자 경험과 보상 체계의 일관성을 유지합니다.
🛡️ 안정성 향상
- Unmount 시 불필요한 상태 업데이트 방지
- SVG 라인 컴포넌트가 언마운트 되는 상황에서
optionRefs/observer콜백이 상태를 업데이트하지 못하도록 가드를 추가했습니다. 이로 인해 컴포넌트가 사라진 이후 발생할 수 있는 불필요한 상태 변화와 메모리 누수를 예방합니다.
- SVG 라인 컴포넌트가 언마운트 되는 상황에서
이번 v1.0.1 업데이트는 학습 경험 개선과 UI 안정성 강화에 중점을 두고 있습니다. 사용자 인터페이스가 더 직관적이고 브랜드 정체성이 강화되었으며, 퀴즈 기능과 관련된 데이터 업데이트가 실시간으로 처리됩니다.
v1.0.0 (January 15, 2026)
Funda Release Notes — v1.0.0
이번 릴리즈는 주요한 기능 추가와 개선 사항, 버그 수정, 빌드/인프라 관리 작업 등이 포함되어 있습니다.
📦 주요 기능 추가
- 학습 & 스테릭(연속 기록) 기능 강화: 스테릭 페이지에 애니메이션과 UI 디테일을 추가하여 사용자 경험을 향상시켰습니다. 또한 로드맵의 진행률·정답률을 시각적으로 보여주는 기능을 구현했습니다.
- 경험치(XP) 로직 구현: 데이터 동기화 시 경험치 증가 로직을 새로 도입하여 학습·퀴즈 결과에 따른 XP 부여가 가능합니다.
- 로컬스토리지 동기화: 사용자가 푼 단계 정보(
steps)를 서버의user_step_statuses와 동기화하도록 구현했습니다. - 퀴즈 기능 개선: 비로그인 및 로그인 사용자 모두에 대해 퀴즈 정답 체크·저장·처리 로직을 추가하여, 사용자의 활동을 정확히 기록합니다.
- 사용자 설정/프로필 페이지: 유저 정보 반영과 세팅 페이지, provider 설정 기능을 추가했습니다.
- 사이드바 로고 및 파비콘 추가: 사이트의 브랜드 아이덴티티를 강화하기 위해 사이드바에 로고를 추가하고 파비콘을 설정했습니다.
🛠️ 개선 및 리팩터링
- UI/UX 개선:
- Learn 페이지를 리팩터링하고 UI를 전반적으로 수정해 가독성과 사용성을 높였습니다.
- 배포 전 UI 전체를 손봐 여러 화면에서의 일관성을 확보했습니다.
- Streak 페이지 UI를 세부적으로 다듬고 애니메이션을 적용했습니다.
- 비로그인 상태에서 프로필 페이지로 이동하면 404가 발생하던 문제를 예방하도록 라우팅을 수정했습니다.
- 빌드 및 배포 안정화:
- 반복적으로 발생하던 빌드 오류를 해결하고, 배포 스크립트를 안정화했습니다.
- PNPM lock 파일 관리와 Prettier 의존성 추가로 코드 포매팅과 패키지 관리 일관성을 확보했습니다.
- MSW(Mock Service Worker) 중지 기능을 추가해 테스트 환경 제어가 쉬워졌습니다.
- 문구와 알림 개선: 신고 토스트의 메시지와 서버 응답의 내용이 일치하도록 수정했습니다.
🐛 버그 수정
- 빌드 오류 및 응답 오류 해결: 여러 PR에서 빌드 오류와 response 오류를 수정하여 배포 안정성을 높였습니다.
- SVG 및 리소스 경로 수정: 잘못된 SVG 경로 문제를 해결했고 삭제된 아이콘을 복구했습니다.
- 401 오류 재요청 로직: 인증 만료 등으로 401 에러 발생 시 자동으로 재요청하는 로직을 도입하여 사용자 경험을 개선했습니다.
- 토스트 내용 불일치 수정: 신고 기능에서 토스트 메시지와 실제 서버 응답이 다른 문제를 해결했습니다.
⚙️ 인프라/기타
- 배포용 스크립트 및 설정 업데이트: 여러 차례의 “배포” PR을 통해 배포 프로세스를 조정했습니다.
- 코드 포매팅: Prettier 의존성을 추가하여 코드 일관성을 확보했습니다.
- 스토리북/토스트 컴포넌트 관리: 백엔드 데이터 리턴 수정 및 토스트 컴포넌트 스토리를 정비했습니다
이 릴리즈를 통해 학습 기능과 사용자 경험이 크게 향상되었으며, 여러 빌드 오류가 해결되었습니다. 또한 경험치 시스템과 스테릭 기능 도입으로 사용자 동기부여 요소를 강화했습니다.
v0.0.1 (January 9, 2026)
Funda Release Notes — v0.0.1
이번 릴리스는 Funda 서비스의 MVP 완성(비로그인 사용자 기준)을 목표로,
학습 흐름 전반(분야 선택 → 로드맵 → 유닛/스텝 → 퀴즈 → 결과)을 완성하고
안정성과 개발 생산성을 함께 개선한 업데이트입니다.
✨ 주요 기능 (Features)
🧭 학습 로드맵 & 분야 선택
- 학습 분야 선택 페이지 및 초기 진입 플로우 구현
- 학습 분야별 로드맵 조회 API 및 로드맵 테이블 설계
- 로드맵 기반 유닛 선택 페이지 구현
- 부모 필드 기준 첫 번째 유닛 조회 API 제공
🧩 유닛 · 스텝 · 퀴즈 구조
- 한 필드 내 전체 유닛 + 스텝 정보 조회 API
- 특정 스텝의 퀴즈 세트 조회 API
- 퀴즈 생성 · 저장 · 제출 · 채점 로직 구현
- 매칭 퀴즈 UX 개선 및 퀴즈 컴포넌트 개발
📊 학습 결과
- 결과 페이지 및 결과 효과 페이지 구현
- 퀴즈 제출 결과에 따른 사용자 피드백 제공
🛠 관리자 기능
- 관리자용 JSONL 퀴즈 데이터 Bulk 업로드 페이지
- 업로드 데이터 처리 및 저장 로직 구현
🧑💻 프론트엔드 진행사항
- 메인 페이지 구현
- 로드맵 페이지 레이아웃을 LearnLayout 기반 구조로 리팩터링
- 양쪽 사이드바 UI 수정
- 비로그인 유저용 LocalStorage hook & util 개발
- 다크/라이트 테마 모드 지원
- 컴포넌트 Storybook 구성
- 컴포넌트 단위 테스트 코드 작성
⚙️ 백엔드 진행사항
- 학습/로드맵/퀴즈 관련 API 전반 구현
- 퀴즈 정답 처리 및 제출 비즈니스 로직 정립
- 로깅 인터셉터 도입으로 서버 로그 가시성 개선
🧹 리팩터링 & 품질 개선 (Refactor / Chore)
- 프로젝트 폴더 구조 정리
- HTTPS 적용
- 테스트 코드 작성 및 개발 환경 안정화
✅ 상태
- MVP(비로그인 사용자 기준) 범위 내 이슈 전체 Closed
- 서비스 전반 흐름 정상 동작 확인