README.md

📚 StudyPals

📌 개요

• 학습 시간을 기록하고 관리할 수 있는 크로스 플랫폼 애플리케이션
• React Native 기반 (Android / iOS / macOS / Windows 지원)
• STOMP + SSE 기반 실시간 그룹 채팅
• SQLite 기반 로컬 데이터 캐싱 및 오프라인 대응

👭 친구들과 함께 공부하며 성장 기록 남기기

혼자 공부할 때는 목표를 꾸준히 유지하기 어렵고, 스터디를 하더라도 서로의 학습량을 확인하기 어려운 경우가 많습니다.

StudyPals는 이러한 문제 상황에서 착안하여 학습 기록을 시각화하고, 스터디 그룹 단위의 공동 목표를 설정하여 함께 공부하며 동기부여를 받을 수 있도록 설계된 서비스입니다.

🌐 크로스 플랫폼 애플리케이션

StudyPals는 Android, iOS, macOS, Windows 환경에서 동작하는 크로스 플랫폼 애플리케이션입니다.

📱 Mobile Demo

Android	iOS
Android 영상 원본	iOS 영상 원본

🖥️ Desktop Demo

Windows	MacOS
Windows 영상 원본	MacOS 영상 원본

✨ 주요 기능

👋 서비스 가입하기

아이디와 비밀번호 기반으로 계정을 생성하고, 자신의 프로필을 설정할 수 있습니다.

회원가입 Flow

🏃‍♂️ 학습 목표 설정하기

사용자는 목표 시간과 수행 요일을 설정하여 학습 목표를 관리할 수 있습니다. 목표 시간과 목표를 수행할 요일을 지정하여 구체적인 학습 계획 수립이 가능합니다.

목표 생성	목표 수정	목표 삭제

📝 학습 기록 남기기

공부 시작과 종료 시간을 기록하여 학습 시간을 관리할 수 있습니다.

학습 시작 / 종료

• 타이머 기반 학습 기록 기능
• 학습 세션 단위 공부 시간 저장

---

📊 학습 통계

사용자의 학습 기록을 캘린더 형태로 한 눈에 확인할 수 있습니다.

학습 통계 화면	히트맵 시각화 예시(더미 데이터)

• 월별 최소 / 최대 공부 시간을 기준으로 컬러 스케일 기반 히트맵 시각화
• 날짜별 학습량을 직관적으로 파악할 수 있는 캘린더 UI

---

👥 스터디 그룹

스터디 그룹을 생성하고, 공유 목표를 설정하여 함께 공부할 수 있습니다.

그룹 생성	그룹 목표 생성	그룹 랭킹(더미 데이터)

• 그룹 단위 학습 관리
• 디바이스별 그룹 색상 커스터마이징

---

💬 실시간 그룹 채팅

스터디 그룹 내에서 실시간 채팅을 통해 대화를 주고받을 수 있습니다.

그룹 채팅

• STOMP 기반 WebSocket 통신
• SSE 기반 메시지 수신으로 채팅 안읽음 개수 실시간 반영
• 무한 스크롤 기반 단계적 렌더링으로 메모리 사용 최적화
• 수신한 채팅은 로컬 스토리지에 캐싱하여 네트워크 비용 절감

---

🔠 언어 설정

앱 내에서 언어를 설정할 수 있습니다.

언어 설정

• react-i18next 라이브러리를 사용하여 구현

🛠 기술 스택

구분	기술
프론트엔드	React Native, TypeScript
내비게이션	React Navigation
로컬 데이터 관리	AsyncStorage, EncryptedStorage, SQLite
상태 관리	TanStack Query, Zustand
실시간 통신	STOMP, SSE
외부 데이터 검증	Zod, React Hook Form
OTA 업데이트	Hot Updater

---

📖 기술 문서

프로젝트의 기술적인 설계와 구현 과정은 Wiki에서 확인할 수 있습니다.

👉 Wiki 바로가기

---

📷 Screenshots

👉 모든 화면에 대한 명세 바로가기