sj0826 / coding-swamp- Goto Github PK

📄 Description

서버에서 받아온 access token이 만료되었을 경우 어떻게 처리할 것인지에 대한 이슈입니다.

📄 Todo

• todo
• todo

📄 ETC

기타사항을 작성합니다.

📄 Description

회원가입 페이지에서 이미지를 업로드할 때 파일 올리기창이 두번 생성됩니다.

📄 Todo

• 이미지 업로드 버튼 눌렀을 때 파일 올리기 창이 한번만 뜨게 하기
• ui겹치지 않게 프로필 이미지 단위 바꾸기

📄 Trouble Shooting

📄 Description

배포환경에서 이메일 인증을 하려했을 때 401에러가 발생합니다.

📄 Todo

• url 다시 확인하기

📄 Description

메인 페이지에 있는 뷰포트 크게 따라 달라지는 스터디 아이템의 크기가 사용자에게 불편한 경험을 주므로 수정 필요

📄 Description

배포시 npm run build명령어가 실행되지 않습니다.

📄 Description

User에 대한 상세 정보를 보여주고 정보를 수정할 수 있습니다.

📄 Todo

• 보여지는 User정보에는 [username, email, image]가 있고 [username, image]는 수정할 수 있습니다.
• todo

📄 ETC

기타사항을 작성합니다.

📄 Description

스터디 타입에 따른 필터링 기능이 실행 되고 있지 않음.

📄 Trouble Shooting

스터디 이름을 store에서 설정한 이름과 다르게 사용해 에러가 발생함.

📄 Description

스터디 상세 페이지의 코멘트 기능입니다.

📄 Todo

• 코멘트 페이지 UI
• 코멘트 조회하기(무한 스크롤)
• 코멘트 수정하기
• 코멘트 삭제하기

📄 Description

스터디 상세 정보 페이지에서 신청한 스터디일 때, 이미 참가한 스터디로 보여짐.

📄 Todo

• 메시지 조건 추가해서 설정하기

📄 Description

로그인 버튼을 클릭했을때 로그인은 되는데 페이지 이동이 안됨.
navigator 함수를 사용하는중.

📄 Todo

• 비동기 처리가 잘 되고 있는지 다시 확인

📄 Trouble Shooting

📄 Description

스터디 상세 페이지에서 설정 탭에 해당하는 기능입니다.

📄 Todo

• 스터디 이름과 설명을 수정할 수 있습니다.
• 스터디장이 스터디 참가 신청 허가를 할 수 있습니다.
• 스터디장이 회원을 강제 탈퇴할 수 있습니다.
• 스터디장이 스터디를 삭제할 수 있습니다.
• 설정 페이지에서 스터디 신청을 취소합니다.
• 설정 페이지에서 스터디 탈퇴를 할 수 있습니다.

📄 Description

서비스에 접속시 가장 먼저 보여지는 페이지입니다.

📄 Todo

• jwt토큰을 디코딩해 받아온 memberId로 받아온 정보를 store에 저장합니다.
• 생성된 스터디목록을 페이지네이션 기능을 이용해 한페이지 당 8개씩 보여줍니다.
• 모각코 / 스터디 기준으로 필터링 기능이 있습니다.
• 스터디 아이템을 클릭하면 모달창에서 스터디 상세정보를 보여줍니다.
• 모달창에서 스터디 신청을 할 수 있습니다.

📄 ETC

기타사항을 작성합니다.

📄 Refectoring 이유

• 기존 store에 관심사의 분리가 잘 되어 있는 것 같지 않아 구조를 변경합니다.
• 로그인 회원가입 레이아웃을 가독성있게 변경합니다.

📄 Todo

• 인증에 관한 state는 authSlice에서 관리합니다.
  • 로그인 폼
  • 로그인 유효성 검사 결과
  • 로그인 폼 초기화
  • postSignInAPI
• 회원 정보에 관한 state는 'memberSlice`에서 관리합니다.
  • 회원 가입/유저 수정 폼, member 상세 정보
  • 회원가입/유저 수정 유효성 검사 결과
  • 회원 가입/유저 수정 폼 초기화

📄 Description

회원가입 방식은 직접 회원가입과 sns로그인 방식이 있습니다.
sns는 깃허브를 우선으로 적용합니다.
회원가입시 받는 정보는 다음과 같습니다.

1. 이미지 (등록안하면 기본 이미지 설정)
2. Username(닉네임)
3. 이메일(아이디)
4. 비밀번호

📄 Todo

• 회원가입 페이지 UI구현하기
• 아이디/비밀번호 정규식 사용해서 Validation함수 만들기
• 이미지 업로드 기능 구현하기

^(?=.[A-Za-z])(?=.\d)(?=.[$@$!%#?&])[A-Za-z\d$@$!%*#?&]{8,}$

• 회원정보 API 통신 기능 구현 with axios
• 회원가입 API http 코드에 따른 응답 처리
• 이메일 인증 구현하기
• github 로그인 구현하기

📄 ETC

기타사항을 작성합니다.

📄 Description

배포 환경에서 깃헙 로그인시 콜백페이지 404에러가 발생합니다.

📄 Todo

• github 로그인 url 재확인

📄 Description

작은 화면에 맞는 ui를 나타낼 수 있게 웹에 반응형 설정을 합니다.

📄 Todo

• 설정 페이지 반응형 추가하기

📄 Description

설정 페이지에서 스터디 현황을 조회하고 탈퇴할 수 있습니다.

📄 Todo

• 설정페이지에서 참가중인 스터디 리스트를 렌더링 합니다.
• 참가중인 스터디를 누르면 상세 페이지로 이동합니다.
• 탈퇴는 설정페이지에서 할 수 있습니다.
• 설정페이지에서 참가신청한 스터디 리스트를 렌더링 합니다.

📄 ETC

📄 Description

• 스터디 상세페이지의 첫 화면입니다.
• 스터디의 상세 정보를 볼 수 있습니다.

📄 Todo

• 경로는 study/profile입니다.
• 스터디 소개, 스터디 멤버를 렌더링합니다.

📄 ETC

기타사항을 작성합니다.

📄 Description

사용자 프로필 수정시 이미지만 업로드가 되지 않고 submit 되는 이슈

📄 Todo

• 인프런 강의를 통해 이미지 업로드 프로세스 이해하기
• 이미지 업로드 컴포넌트 수정하기

📄 추가로 구현해야 하는 이슈

• 깃허브 사용자는 회원 수정 못하게 막기

📄 Description

작성한 이메일에 코드를 보내는 시간이 길어 사용자 인터렉션 필요

📄 Todo

• 이메일 인증하기 옆에 처리중임을 알리는 UI 생성

📄 Description

배포 환경에서 새로고침시 404에러가 발생합니다.

📄 Description

스터디 생성시 입력받는 태그에 중복된 데이터가 있다면 무효처리합니다.

📄 Todo

📄 Description

자동 배포를 위해 설정한 githubflow 에서 에러가 발생합니다.

📄 Description

페이지 이동하면 헤더에 있는 UserIcon이 활성화되지 않습니다.

📄 Trouble Shooting

📄 Description

로고 클릭시 메인 페이지로 이동합니다.

📄 Todo

• 로고 정해서 추가하기

📄 Description

서비스 유저 인증을 위한 로그인 기능입니다.

📄 Todo

• 로그인 페이지 UI 구현하기
• 이메일과 비밀번호 유효성 검증하기
• 로그인 성공하면 메인페이지로 이동하기
• 깃허브 계정으로 로그인하는 방식을 추가하기
• accessToken 관리 방법 생각하기
  1. token을 받으면 axios interceptor메소드로 토큰을 localStorage에 저장한다. athorization헤더에 토큰을 넣어서 보내야해
  서 쿠키는 사용할 수 없다.
  2. 데이터를 요청하고 토큰 만료를 알리는 상태코드로 응답이 오면 이또한 interceptor메소드에 로직을 구현해서 다시 토큰
  을 요청하고 localStorage에 저장한다.
• private route, public route 구현하기

📄 ETC

기타사항을 작성합니다.

📄 Description

시작하지 않은 스터디 상세 페이지에서 모집 마감이라고 보여집니다.

📄 Todo

• 스터디 상태 뱃지에 조건을 걸어 메시지 추가하기

📄 Description

• 스터디 수정하는 기능에 대한 리팩토링 입니다.

📄 Todo

• Header 메뉴 위치 수정
• 전체 Layout 수정

📄 Description

새로운 스터디를 생성할 때 보여지는 페이지입니다.

📄 Todo

• 헤더에 사용자 아이콘을 클릭하면 보여지는 메뉴에 스터디 생성버튼이 있습니다.
• 스터디 생성시 받는 정보는 제목, 설명, 스터디 타입, 썸네일 색상코드, 스터디 시작일 , 스터디 종료일, 스터디 최대인원, 검색시 활용될 태그 입니다.
• 스터디를 생성하면 자동으로 스터디 상세 페이지로 페이지 이동됩니다.

📄 ETC

기타사항을 작성합니다.