RYU
DONGHYEON

서비스 개요

시뮬레이터를 통해 수집된 데이터를 기반으로 사용자의 운전습관을 분석하고 개선점을 제안하는 모바일 서비스입니다.

프론트엔드 구현

TypeScript와 React Native를 기반으로 개발된 운전 습관 분석 모바일 애플리케이션입니다. 상태 관리는 Zustand를 사용하여 비즈니스 로직과 UI를 분리했으며, 카카오 소셜 로그인을 통해 사용자 인증을 구현했습니다.

주요 개발 성과

• 주행 데이터를 안전, 탄소 배출 등 다각도로 분석하고 다양한 차트로 시각화하여 직관적인 피드백 제공
• 독자적인 운전 성향 MBTI 'Mobti'와 '씨앗' 보상 시스템을 통해 사용자의 재미와 참여 유도
• Axios 인터셉터로 안정적인 API 통신 구축
• Firebase(FCM)와 Notifee를 연동하여 실시간 운전 이벤트 알림 기능 구현
• Container/Presenter 패턴 적용과 Jest 기반의 테스트 코드 작성을 통해 코드의 품질과 유지보수성 확보

서비스 개요

HaruHan은 숏폼 콘텐츠가 범람하는 시대에 의미 있는 정보와 지식을 전달하는 일일 뉴스레터 서비스입니다. 출퇴근 시간 등 짧은 시간에도 가치 있는 콘텐츠를 소비할 수 있도록 기획되었습니다.

프론트엔드 구현

React와 Vite를 기반으로 구축된 데일리 지식 뉴스레터 서비스입니다. 정보 과잉 시대에 사용자가 방해 없이 양질의 지식을 꾸준히 습득하는 것을 목표로 합니다.

주요 개발 성과

• React Query를 활용한 데이터 캐싱과 API 요청 최적화
• Framer Motion과 커스텀 훅으로 스크롤에 반응하는 동적인 UI 구현
• 기능별 컴포넌트 모듈화
• Axios Interceptor를 활용한 전역 에러 핸들링 시스템 구현
• 일반 사용자와 관리자의 접근 권한을 분리하는 라우트 가드 적용

서비스 개요

CineAI는 단순 추천을 넘어 사용자와 AI가 대화하며 영화를 추천받고 정보를 얻을 수 있는 쌍방향 영화 추천 플랫폼입니다.

프론트엔드 구현

React를 활용해 추천 및 상세 정보 조회 인터페이스를 개발했습니다. 사용자가 원하는 영화를 쉽게 찾도록 검색 시스템을 구축했으며, 세션 스토리지를 활용한 캐싱 전략을 적용해 서비스 응답성을 높였습니다.

주요 개발 성과

• 검색 결과 페이지에 '더보기' 버튼 방식의 페이지네이션 구현 - 초기 로딩 속도 확보 및 동적 데이터 로딩
• React Router의 보호된 라우팅 기능으로 권한별 접근 제어
• Nginx를 직접 구성하여 SPA 배포 환경 구축