<aside> 👉 목차

</aside>

필요한 정보 공유

<aside> 👉 관련 정보

• CSS 그라디언트

  background: linear-gradient(to top, #fc257e, #fcdf7e)
  

• 정규 표현식

  //정규표현식
  let reg = null
  if(props.type === 'email') reg = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*\\.[a-zA-Z]{2,3}$/
  else if (props.type === 'password') reg = /^(?=.*[A-Za-z])(?=.*\\d)(?=.*[$@$!%*#?&])[A-Za-z\\d$@$!%*#?&]{8,}$/
  

</aside>

0. 일정 계획

• 8월 19일
  • [x] API명세 수립
• 8월 20일
  • [x] 페이지 역할 분담 및 구현할 기능 정리
• 8월 21일
  • [x] 페이지 작업
  • [x] 추가학습 주제: PWA
  • [x] 백엔드 ⇒ API 배포 ⇒ axios 연결작업
• 8월 22일
  • [x] 각 페이지 초안+뷰 완성하기
    • [x] 프로필 수정 페이지 CSS
    • [x] 회원가입 페이지 CSS
• 8월 23일
  • [x] 기능 구현 후 버그 수정 시작
    • [x] 이미지 url 작업
    • [x] 해당 유저 지도 출력
  • [x] 중간단계 배포하기X ⇒ 에러 때문에 보류
• 8월 24일
  • [x] 로그인 유지관련 코드 - 박준수
    • [x] 좋아요
  • [x] 지도 관련 코드 - 두선아
    • [x] 지도 상대와의 거리 버그
    • [x] 메뉴에 내가 있는 섹션 표시
    • [x] 프로필 이미지 눌렀을 때 내 정보로 가기
    • [ ] 태그 내용 수정(마진 위쪽 띄우기) ⇒ 회원가입, 프로필 수정
    • [x] 게더 사람들 프로필 정리
    • [ ] 지도 아이콘 z-index 띄우기
  • [x] 프로필 수정페이지 프로그래스바 - 유지완
  • [x] 스토어 수정
  • [x] 링크 오류 수정
• 8월 25일
  • [x] 0. 배포
    • [x] 카카오 지도 확인
  • [x] 1. 지도
    • [x] 맵 관련 버그 수정
  • [x] 2. 회원가입 페이지 마무리
    • [x] 이슈 https://github.com/TinDater/TinDater-frontend/issues/51
  • [x] 3. 프로필 수정 페이지 마무리
    • [x] 프로필 수정에서 interrest가 들어가야만 응답이 오는 이슈 해결(박준수)

1. 프로젝트 개요

페이지별 구현 기능

1. 로그인 페이지
   • 유저 로그인: 토큰 ⇒ 쿠키에 저장
2. 회원가입 페이지
   • 유저 정보 submit
     • react hook form사용
   • 이미지 저장(aws sdk), imageURL post
   • input종류별 조건부 랜더링
   • 태그 정보는 다음과 같이 구성
     • [0,1,0,0,0,0,1,0]
3. 스와이프 페이지
   • 받은 유저 데이터를 랜더링
   • 좋아요와 싫어요 클릭 시 API 명세에 따라 요청 보냄
     • 받은 유저 데이터를 리랜더링
     • 받은 유저 데이터와 좋아요 매치 시, 매치 페이지로 이동
4. 좋아요 페이지
   • 내가 좋아요한 사람 리스트(간략) 출력
     • 카드를 클릭하면 해당 사람의 마이페이지로 이동
   • 매치된 사람의 카드는 다른 카드와 구분되는 스타일 적용
   1. 마이 페이지 / 프로필 페이지
      • 받아온 유저의 정보를 랜더링
        • (조건부 랜더링) 유저 아이디와 로그인한 유저의 아이디가 같다면, 프로필 수정 버튼 보여주기
      • [x] 보여줄 유저가 하나도 없을 때 예외처리