화면 구성 및 기능

로그인

• 카카오 로그인 API를 활용한 간편 로그인
• 카카오 서버로부터 Auth Code를 받아 백엔드로 전달
• 백엔드로부터 반환된 JWT 관리
• 로그인 상태 아닐 시 로그인 페이지로 강제 다이렉트

메인

• 계정 별 디폴트 지역 설정 가능
• 선택한 지역에 맞는 오늘의 날씨 및 그래프 출력
• 오늘과 가장 비슷한 날씨의 착장 3개 출력

착장 기록

• 날짜 및 지역 변경 가능
• 아우터/상의/하의/기타 4가지 카테고리 별로 옷 선택
• 옷 선택 취소 및 대표옷 변경 가능
• 추움/시원/적당/따뜻/더움 5단계로 평가
• sesstionStorage를 이용한 자동 임시 저장

옷장 리스트

• 아우터/상의/하의/기타 별로 API와 통신
• 선택한 세부 카테고리에 맞는 옷만 출력
• 숨긴 옷들만 따로 확인 가능

옷장 추가

• 이미지 선택 시 AI 서버와 통신하여 segmentation를 미리보기로 띄움
• classification 결과로 카테고리 자동 선택
• 옷 숨기기(옷장 리스트에서 안보기) 가능

착장 리스트

• 추천순, 최근등록순으로 정렬 변경 가능
• 아우터/상의/하의의 평가가 "적당"인 착장 필터링 가능
• 각 카테고리 별 대표옷을 출력하고, 2개 이상이면 + 표시
• 스크롤 위치, 정렬, 필터 내용 저장

기타 성과

• RESTful API와 상호작용
• 미디어 쿼리를 활용한 반응형 웹 구현
• url 파라미터 문법을 사용해 코드 재사용성 향상
• AWS S3 이용한 배포
• ootw.store로 접속 시 www.ootw.store 으로 리디렉션
• AWS CloudFront 이용한 https 적용