🧑🏻‍💻 소개

RoomE는 바쁜 일상 속에서 자신을 잃어가는 현대인들에게 자아 탐색과 심리적 안정을 위한 공간을 제공합니다.

단순한 취향 공유를 넘어, 자신을 이해하고 마음의 안정을 찾으며, 같은 관심사를 가진 사람들과 자연스럽게 연결될 수 있는 디지털 힐링 공간을 지향합니다.

📝 프로젝트 기록

• 🔗 깃허브
• 🌿 회고록

🧑🏻‍💻 내가 기여한 부분

1. 소셜 로그인 인증,인가 처리

• 소셜 로그인 시 전달받은 Access Token을 브라우저의 쿠키에 저장하여 관리
  • 만료 시간을 짧게 설정하여 보안 위협 최소화
• 인증 오류(401) 발생 시, 응답 인터셉터에서 accessToken 재발급 API를 호출하여 전달받은 새로운 토큰으로 요청을 재시도함으로써, 토큰 만료 후에도 로그인 상태 유지 및 자동 로그인을 통한 UX 개선

2. CD(음악) 랙 페이지

• Swiper의 CoverFlow 기능을 활용하여 입체적인 Slide UI 구현
• 이미지에 loading=”lazy” 기법을 적용해 화면에 보일때 로드
  • FCP 1.8s→1.4s(약 32% 개선). LCP 2.3s → 1.7s (약 26% 개선)
• Slide 호버 시, 마우스 x, y 좌표값에 따라 이미지의 rotateX, rotateY 변경
  • React 상태 대신 DOM을 직접 조작하여 리렌더링을 1회로 최소화, 리렌더링 횟수 99% 감소 ****
• CD 검색 및 추가시 외부 API를 활용하여 디바운싱이 적용된 검색 결과 반환, 서버에 videoId, 재생시간 전달