09/10

• 기존에는 jwt-decode를 활용하지 않았기에 토큰이 없을시 그냥 /login으로 보내는 것이 가능했으나
• 이제는 jwt-decode를 활용해서 userId를 navigationBar에서 쓰기때문에 기존방식으로는 token이 invalid하다고 error가 자꾸 남
• 문제의 원인은 navBar에서의 토큰이 decode한 토큰이 아니라는 점
  

토큰 값을 세션 스토리지에 저장하는 방식으로 로그인 로직을 구현한 초안입니다.
=> 토큰을 주지 않고 쿠키에 세션 ID를 저장하는 방식으로 바뀌었습니다
고려사항

• 중복확인 누르기 전에 유효성검사
• 중복확인 누르고 나서 수정한 후로 제출했을 경우 다시 중복확인으로
• 전체 유효성 검사
• 비밀번호 암호화해서 보내기
• url 파라미터로 오는 토큰을 쿠키에 담기
• 회원가입 중복확인 누를 때 하나씩 빠져서 전송되는 문제
• 토큰이 계속 없어지는 문제
• Signup genderAge에서 useEffect 안에 토큰과 exist 넣기

08/31

• 게시물 작성에서
  • 사진 미리보기
  • formdata에 사진 포함해서 백에게 보내기
• 상품 등록에서
  • 백으로부터 무신사 크롤링 정보 받아오고
  • 유저가 무신사 정보를 선택하면 그 정보를 다시 백에게 보내주기

왜?

• 유저가 사진을 미리봐야 자신이 잘 첨부한건지 확인할 수 있고
• formdata를 사용하기로 백과 약속했으며
• 무신사 정보를 미리받아서 제공해야 유저가 더 큰 편의성을 얻고
• 다시 백에게 넘겨야 옷장 서비스를 잘 구축할 수 있기 때문에

아이콘을 변경시 새로고침을 해야 아이콘이 바뀌었으나 useCallback 사용하여 수정함

• 옷장 컴포넌트를 좋아요 컴포넌트와 함께 공용으로 사용할 수 있게 생각해야합니다.
• 무한 스크롤을 적용해야합니다.
• 게시물 클릭시 게시물의 상세페이지로 이동해야 합니다
• 대표게시물로 지정하는 버튼이 있어야 합니다

[merge/develop] develop브랜치에 merge

08/29

• 게시물 작성
• 상품 등록

왜?

• 서비스에서 우선 create가 되어야 다른 기능들을 수월하게 확인 할 수 있으니까

09/26

• 대댓글 누를 시 그 유저의 마이페이지로 갈 수 있게 구현
• 대댓글 길이 제한
• pwa설치버튼 로그인으로 이동
• 메인페이지 규격 맞춤
• 인기게시물 게시되고 삭제되었을때 클릭시 알림
• 무신사 선택 totop구현
• 게시물 수정하기 전체적인 버그픽스

09/21

• 전반적으로 코드 리팩토링을 합니다.
• 코드의 가독성을 높입니다.
• 주석을 답니다.

09/04

• IAM 만들기
• github actions의 secret설정
• s3 bucket 생성
  • 퍼블릭 엑세스 관련 권한 설정
• main.yml 생성

09/25

• 무한스크롤 끝까지 안내려가는 이슈 해결
• 무신사 아이템 선택시 선택후 다른 아이템 검색할 수 있게 로직 변경
• 무한스크롤 페이지들에 toTop 기능 구현
• refresh token 기능 구현 및 작동 확인

09/05

• 무한스크롤을 구현합니다.
• 전체적인 뷰를 완성합니다.
• 따로 컴포넌트폴더를 만들어 관리합니다.

• 마이페이지
  • mood Point 물음표 오른쪽 맨 아래쪽으로 O
  • 닉네임 컬러 #2D273F 로 변경 O
  • my closet 위치 정가운데로 O
• 검색페이지에서 선택부분을 네모 체크박스로 O
• 검색페이지에서 폰트 맞춰서 O
• 아이콘 알람 컬러 뒤로가기 컬러 등 전체적인 아이콘 컬러 맞춰주세요
  • 푸터 부분들도 조금 차이가 있고
  • 검색 부분의 색깔도 차이가 있고 헤더에 있는 아이콘들도 차이가 있음
• 메인페이지에 mycloset의 폰트를 변경 O
• 메인페이지와 로그인 페이지에서 뒤로가기 부분이 없었으면 O→ 로그인, 회원가입 페이지에서만 제거
• 검색페이지에서는 헤더에서 mood catcher → search로 변경되도록 O
• 메인페이지에서의 디자인 수정 O
• 내비게이션 바에서 클릭시 그 부분 위쪽에 검정색 부분 생겼으면 O
• 사진에 있는 그림자들은 모두 제거 되었으면 O

09/10

• 백으로 받은 포스트 배열데이터를 map함수 돌려서 다른 컴포넌트를 그려주니
• 그 컴포넌트에서 배열의 객체들이 undefined가 뜨는 이슈
• 무한스크롤로 다른 데이터를 받으면 잘 받아짐
  

1. 스크롤해서 받으면 item이 나오니 우선 item?.imgUrl을 하자

• 데이터는 나오지만 밑에 계속 더미데이터가 보임

2. 처음에 주는 page를 1페이지를 주자

• 이론상으로는 맞지만 문제해결은 되지 않음

• 밑에 쓸데없이 EachPost가 하나 더 있는것을 발견 지우고 나니 정상적으로 작동

10/01 css 2.0

• css reset 도입
• 이용약관 전면 개편
• 로그인, 회원가입, 닉네임, 성별 css 전면 개편
• open페이지 css 수정

0902

• 전체적인 뷰

[merge/develop] develop브랜치에 merge

08/29

• 폴더구조 생성
• 라이브러리 일부분 설치

왜?

• 시작할때 같은 폴더 구조에서 라이브러리충돌을 최소화하며 시작하기 위해서

09/11

• 새로 고침을 눌렀을 경우 쿠키에 있던 토큰이 사라지는 이슈가 발생했습니다.
  • 검색에서 setCookie를 검색해서 import 해오던 부분을 모두 삭제했습니다.
  • 추가로 확인해야 할 부분들이 있습니다.

좋아요 기능 구현

09/15

• 예전 버전을 그대로 보여주는 캐시가 남아서 새로운 버전을 보여주지 못하는 것으로 파악
• aws -> cloudfront -> 무효화 -> /* 를 생성
• 위의 방법으로 해당 이슈 해결
• 관련 링크
  • https://infraboy.tistory.com/5

09/06

• LoginForm에서 password를 .toString으로 고쳤습니다.
• SignupForm에서 password, confirmPw를 .toString으로 고쳤습니다.
• SignupGenderAge에서 window.location.href.slice()를 이용해 백으로 쿼리로 받은 토큰을 쿠키에 저장합니다.
• URL들중 ? 앞에 / 가 붙은 경우 다 제거했습니다. ex) /comments/?${payload.postId} -> /comments?${payload.postId}
• loginSlice에서 __login이 되면 백으로부터 body로 토큰이 쿼리로 담긴 URL을 받는데 이 주소를 window.location.href를 이용해 SignupGenderAge 로 이동시킵니다.
• Cookie에 setCookie에서 opt속성의 기본값을 null로 변경했습니다.

09/05

• 무한스크롤을 구현합니다.
• main 페이지를 모듈화 합니다.

고려사항

• 무한스크롤
• 검색기능
• 검색페이지 필터기능

09/13

• 기존의 like페이지의 조회기능을 uploadSlice에서 likeSlice로 변경
• like페이지에서 totop기능 구현
• like페이지에서 쓰로틀 적용

09/10

• App.js에서 이동할때 parameter로 postId와 userId를 받게 변경
• item_detail에서 포스트이미지와 무신사데이터, 유저정보, 댓글정보 받아오게 추가
• item_detail에서 댓글 추가기능 추가
• DetailCommentList의 전체적인 css 변경 및 댓글 출력기능 추가
• uploadSlice에서는 게시물 상세 조회 함수, commentSlice에서는 댓글 추가 및 댓글 조회 함수 수정 업데이트
• EachPost에서 item_detail로 갈때 postId와 userId를 파라미터로 제공하게 수정

09/27

• a태그 기본적으로 커서를 디폴트로, 카카오맵관련 href로 경로방법 변경
• 대댓글 채팅아이콘 클릭해도 해당유저 옷장으로 이동할 수 있게
• 카카오맵 근처 유저 500km로 변경
• 카카오맵 프로필사진 사이징변경

09/26

• 댓글에서 대댓글 갯수 보여주기
• 댓글, 대댓글도 드롭다운 적용
• 댓글, 대댓글 폰트변경
• 시작페이지 css, 위의 여백 제거
• 상세페이지 모바일에서 규격맞게 수정

09/17

• 무신사 아이템 이름 상자 삐져나옴(준수) O
• 디테일페이지에서 점점점의 크기를 줄여야 하는 이슈(준수) O
• 디테일페이지에서 댓글 적는 란에 이미지를 나오게 해야함(준수) O
• 전체적으로 어플의 배경을 밑에서부터 하얗게 (피그마와 똑같게)(준수) O
• 뒤로가기 화살표 변경해야함(준수) O
• 디테일 페이지에서 제목도 볼 수 있게(준수) O
• 메인페이지에서 대표게시물사진양식을 밑에 올포스트에 적용해야함(프레임을 없애고 사진을 라운드하거나 아니면 프레임 둔 상태에서 사진만 라운드)(준수) O
• 대표게시물에서 작성시간 작게하고 상단부로 올리게 하기(준수) O
• 대댓글 보는 부분의 배경을 하얀색으로 하고 작대기를 보라색으로(준수) O

09/25

• 서비스의 유저 분석을 위해 구글 애널리틱스 적용
• index의 head에 관련 코드 구현
• og카드 구현

10/04

0911

• route53 이용 DNS 적용
• CloudFront 이용 SSL 인증서를 이용한 HTTPS 호스팅을 지원
• ACM을 이용하여 인증서를 받은 후 Elastic Load Balancer, Amazon CloudFront 배포

좋아요 기능을 완성시켰습니다.

09/04

• 지금까지의 과정들을 main에 merge합니다.

[merge/develop] develop브랜치에 merge 09/11

09/20

• async & modules 나누기
  • comment, like, rank, upload 를 async 폴더로 모듈화 완료
• api에 instance를 따로 모듈화해서 export 하기(ex userAPI, voteAPI)
  • rank, like, comment, upload 완료
• 에러처리!!! reject랑 fullfilled, pending 신경쓰기
• comment, like, rank, upload 를 async 폴더로 모듈화 완료
• 추가로 user가 로그인 되어있는지 체크하는 api있으면 좋을 것 같음

09/25

• index.html에 카카오맵 관련 sdk 코드 삽입
• 카카오맵 관련 redux slice 구현
• 카카오맵 css 수정

0923

• 모든 페이지를 처음부터 불러올 필요가 없기 때문에 지금 사용하는 코드가 아닌 코드는 나중에 불러와 사용할 수 있는 코드스플리팅 도입
• 최적화 싱글페이지 어플리케이션에서 번들 사이즈가 커지면 로딩속도나 성능면에서 문제가 생길 수 있음
  • 1안) React 내장의 lazy와 Suspense를 사용
  • 2안) 페이스북 권장의 loadable components를 사용
• 1. SSR을 지원하지 않는다.
• 2. SSR을 지원하고, 분할된 파일을 미리 불러올 수 있는 preload라는 기능이 있다.
• 우리는 SSR을 하고 있고, preload라는 기능도 사용할 것이기에 loadable components를 사용

프로필 수정페이지 구현입니다.

고려사항

• 이미지 업로드/미리보기
• 이미지와 닉네임, 성별, 나이를 fromData로 넘겨주기
• 로그아웃/회원탈퇴
• 페이지 자체가 해당 유저에게만 보이게

고려사항

• 유저 아이디를 받아서 해당 유저의 정보가 보여지게 해야합니다
• gradeList
• 유저의 grade 프로그래스 바
• 수정하기 버튼이 해당 유저에만 보이도록 해야합니다
• 아이콘을 수정할 수 있게 해야합니다
• 아이콘 설명 버튼을 더 작게 만들어야 합니다.
• 가로 스크롤

09/13

• 메인에서 대표게시물을 클릭하면 옷장페이지로 넘어갑니다.
• 디테일페이지에서 드롭다운으로 게시물 수정,삭제, 대표게시물 지정을 할 수 있습니다.
• 게시물 수정페이지를 따로 만들었습니다.
• 대댓글기능을 추가했습니다.
  • 아직 css 많이 부족하고, 새로고침이슈가 있으며, 대댓글 수정 및 삭제는 안됩니다.

0904

• json-server를 이용해서 get으로 데이터를 잘 받아오는 지 테스트 할 수 있는 환경 구성
• 전체적으로 css 1차 완성 (upload, upload_select, main, header, navigationBar)
• 전체적인 코드들에서 필요없는 css코드 제거(ex. container)
• 전체적으로 주석을 달고, css의 코드를 컨벤션의 순서로 맞춤
• jsx의 코드와 css의 코드의 순서를 맞춤

0902

• 로그인
• 회원가입
• 메인
• 업로드
• 프로필 수정 페이지

를 매끄럽게 연결합니다.

09/16

• 게시글 작성시 기본이미지가 호박머리(준수)
• 글자수 제한 기능 만들기(업로드 시)(input에 max Length)(준수) O → 더 유저 친화적으로 만들어야함
• 디테일 페이지에서 자신이 아니면 점 세개 안보이게 하기(준수) O
• 다른 사람의 댓글 수정&삭제 안보이게 하기(준수) O (좀 더 꼼꼼한 확인 필요)
• hotPosts에서 누르면 걔네의 상세페이지로 갈 수 있게 하기(준수) → hotPosts get할시에 userId받아오기 → api 수정시 완료 O
• 댓글 달았을때 바로 보이게 하기(준수) → 댓글 작성 API에서 댓글 작성과 댓글조회가 같은 양식으로 나올 수 있게 해야함 → 댓글 새로고침을 그 리스트 부분만 할 수 있는지(전체말고) → api 수정시 완료 O
• 무신사 선택시 선택된거 알 수 있게 색깔을 넣는다던지 알려줘야함(준수) O
• 무신사 다 선택하면 다시 사진창으로 가는 버튼 만들기(완료버튼)(준수) O
• 무신사 선택시 뺄수 있는 기능(준수) O
• 다른 유저 이름이나 동그란 이미지 누르면 그사람 옷장으로 갈 수있게 하기(준수) O
• 대표게시물 지정 눌렀을 때 뭔가 반응이 있으면 좋을 것 같다(준수) O

확인해야할 부분

• 상세페이지에서 내가 쓴 글이 아닌데 내가 쓴것처럼 보이는 이슈(준수) ??? 확인안됨 다시 확인해야합니다 → 처음에는 내가 쓴것처럼 보였다가 시간지나면 상대방이 쓴것처럼 보임(모바일에서는 시간이 지나도 내가쓴걸로 보임)
• 메인페이지로 돌아가면 제가 작성한 글만 보이고 다른사람들 글이 없음 무한스크롤이 안된다.(준수) → 좀 더 명확한 확인이 필요
• 댓글에서 누르면 그 댓글이 다 보이게 만들기, 대댓글 포함(준수)
• 댓글부분 1분이상 지나도 방금전 으로 뜨는 부분(준수) → 요청후 응답이 방금전에서 변하지 않음