dnd-side-project / dnd-10th-6-frontend Goto Github PK

작업 내역 설명

@raymondanythings 76번 브랜치임다~

Feature List 🛠️

구현해야하는 작업 내역

• 1 새로 작업된 온보딩 화면 UI 를 구현합니다.
• 2 일부 애니메이션 추가

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 사용자 로그인/회원가입 플로우 구현
• 2 미들웨어, HOC를 통한 router protection

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1
• 2

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 경로와 기간에 따른 나무디자인이 다양하다는 점을 소개하는 튜토리얼을 툴팁으로 변경하기로 정책이 수정됨. 해당 사항을 구현함
• 2 디자인 나오면 구현 예정

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 나무카드 뒷면 재디자인
• 2 디자인 나오면 구현 예정

뒷면 글자 안뜨는 상황에 대한 대처 필요

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 설문결과 데이터에 기반한 다양한 차트 적용하기
• 2 필터를 통해 데이터 결과 요약하기 -> TBD ( 알게된 기간으로 필터 변경 중)

참고이미지

작업 내역 설명

FN-7 번 항목, 나도써주기 기능을 구현합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 나도써주기 버튼 추가
• 2 해당 api 연결

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 메인 로고에 라우팅 걸기
• 2 로고 통일

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 남의위키 [ 1 ~ 4 ] OX 2지선다
• 2 남의위키 [ 5 ~ 8] 4지 선다
• 3 남의위키 [ 9 ~ 14] 서술형
• 설문 응답 스키마 수정
• 프로그래스바로 진척사항 표기

작업 내역 설명

원활한 작업을 위한 디자인 시스템 및 개발 환경을 세팅합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 타이포그래피, 폰트 설정
• 2 컬러칩 tailwind config 등록

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 총 0그루 화면 모달 제거 반영
• 2 createdAt 날짜 변경
• 3 돈 금액 직접입력시, 숫자만 가능 텍스트 추가

작업 내역 설명

• lo-fi 작업내역을 토대로 inputbox를 제작합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 디폴트
• 2 마우스 오버시
• 3 포커스 시
• 4 입력 시
• 5 입력 완료 시
• 비활성화 시

작업 내역 설명

수정될 가능성이 높아 미루어두었는데, 얼추 확정된 거 같아 편의를 위해 등록합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 피그마에 최종시안으로 확정된 컬러칩들 등록

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 카카오 인앱 뷰에서만 발생, 크롬에서 정상 작동

작업 내역 설명

• lo-fi 작업내역을 토대로 button 컴포넌트를 제작합니다

Feature List 🛠️

구현해야하는 작업 내역

• 1 디폴트 - (primary)
• 2 secondary
• 3 컬러, 라운드, 폰트등의 variants
• 4 마우스 호버 시
• 5 active 시
• 6 비활성화 시
• 7 로딩 시

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 padding 디자인 수정 사항 조절

• 2 총 그루 수 필터링 문구 변경

• 3 로딩화면 리뉴얼

  <br/>
  

작업 내역 설명

Feature List 🛠️

사용되는 svg 에셋들을 등록합니다.

구현해야하는 작업 내역

• 1 이미지 에셋 등록

작업 내역 설명

Next-auth를 걷어내고, 사용자 인증 모듈을 제작합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 Provider 기반의 인가/인증 API 구현

• 2 API HOC handler와 error handler 구현

• 3 커스텀 에러 클래스 구현

• 4 클라이언트 인증용 Provider와 Custom hook

  <br/>
  

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 카드가 보여지는 화면은 3단으로 재구성합니다.
• 2 개수에 맞추어 empty card를 보여줍니다.
• 3 대시보드 로고 - 정원 라우팅

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 글자수 제한 15 -> 20자로 변경
• 2 알게된 경로 기간 바뀐거 수정

작업 내역 설명

설정화면과 내게 작성된 설문목록 화면을 구현합니다

Feature List 🛠️

구현해야하는 작업 내역

• 1 설정화면

• 2 작성목록

  <br/>
  

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 작성자 회원가입
• 2 funnel, react-hook-form을 사용한 설문지 문항 프로세스 작업
• 3

작업 내역 설명

설문 응답에 맞추어 스텝이 지날수록 진행 완료율을 알 수 있는 프로그래스바를 구현합니다.
해당 페이지 위치와 전체 페이지 값을 알 수 있는 페이지 표기를 헤더에 구현합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 프로그래스바로 진척사항 표기
• 2 헤더 props 연결

작업 내역 설명

통계화면의 2개의 박스를 구현합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 나는 이런 사람이에요 블록 구현하기 - 카테고리별 가장 많이 선택된 항목 표시
• 2 000정도의 돈을 빌려줄 수 있어요 블록 구현하기 - 설문된 총 금액 표시하기

  <br/>

작업 내역 설명

SNS 로그인을 위한 next-auth를 연동합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 인가코드를 서버로 전송하여, 유저정보를 응답받습니다.

• 2 로그인 성공 / 실패 처리

• 3 커스텀 로그인 화면

  <br/>
  

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 공유받은 남의위키 링크 접속 -> 로그인 완료 -> 정원 먼저 노출 -> 몇초 후 설문 페이지로 리다이렉션

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 폴더구조 fsd 적용

• 2 svg 컴포넌트 모두 webp로 수정

  <br/>
  

작업 내역 설명

Funnel 방식의 온보딩 화면을 구현합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 스와이프를 통한 화면 전환

• 2 최초 접속 시에만 화면 노출하기

• 참고화면
  

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 나무 플립카드 구현
• 2 메인 내 정원 구현

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 응답 api 시간 동안 로딩 노출
• 2 여러번 제출 확인 -> 백

작업 내역 설명

사용되는 모달이 많은 거 같아 미리 구현합니다. 이후 바텀시트나 다른 부분에서 활용해도 좋을 거 같아요 !
toss useOverlay를 활용할 예정입니다.
toss 공식 소개 링크

Feature List 🛠️

구현해야하는 작업 내역

• 1 모달 구현
• 2 테스트 적용

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 카카오 인앱 뷰에서만 발생, 크롬에서 정상 작동

  <br/>
  

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 대시보드 내 컨텐츠에서 직접 입력 답변만 있을시, 그래프 및 값 노출이 될 것이 없기에 해당 빈페이지 화면 필요
• 2 디자인 이후 작업 진행

작업 내역 설명

에러 코드별 토스트 노출 로직을 작성합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 query String 을 통한 글로벌 커스텀 에러 핸들링
• 2 커스텀 에러 별 메세지 정의

작업 내역 설명

이슈 분배를 위해 머지된 PR의 연장선으로, 인증모듈에 토큰 갱신로직을 추가합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 만료된 토큰일 경우, 새로운 토큰 발급 후 재 요청

  <br/>
  

작업 내역 설명

나무 아이콘을 기간, 경로가 포함된 아이콘으로 수정합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 아이콘 svg render class 정의
• 2 relation, period에 따라 데이터 fetch

before -> after 화면 첨부

작업 내역 설명

내 정원에 공유하기 버튼 추가

Feature List 🛠️

구현해야하는 작업 내역

• 1 대시보드 페이지에만 존재하기때문에 공유버튼 접근성이 떨어진다는 유저 피드백을 반영해, 정원 페이지에도 공유하기 버튼을 추가함.
• 2 디자인 나오면 구현 예정

작업 내역 설명

• 내가 받은 설문이 상세 내용 Drawer구현

Feature List 🛠️

구현해야하는 작업 내역

• 1 자세히보기 버튼을 통해 상세보기 Drawer노출
• 2 Optinal - 모바일 스와이프시 이전화면 노출

작업 내역 설명

만난 경로 태그를 등록합니다. 그외 최종으로 확정된 디자인에 맞춰 이전에 작업해둔 버튼들을 수정합니다.

Feature List 🛠️

구현해야하는 작업 내역

• 1 버튼 컴포넌트 최종 시안대로 수정
• 2 카카오 로그인 버튼
• 3 일부 변경 없을 에셋 svg 등록
• 4 만난 경로 태그 구현

작업 내역 설명

구현해야하는 작업 내역

• 1 두번 눌러야 focus -> 라디오 버튼 수정
  Multi choice에서 직접 입력 클릭하면 input이 바로 focus안됨

• 2 라디오 버튼 리팩토링

• 3 이유를 먼저 입력하고, 라디오버튼 선택시 다음 버튼 disabled가 풀리지 않음.

작업 내역 설명

Feature List 🛠️

구현해야하는 작업 내역

• 1 회원가입일 경우, 웰컴 페이지 노출
• 2 링크공유, 카카오톡 공유

작업 내역 설명

Feature List 🛠️

• 체크 박스가 노출되는 라디오 버튼를 제작합니다.
• 드롭다운 형식의 셀렉트 박스를 구현합니다.

구현해야하는 작업 내역

• 1 라디오버튼 컴포넌트 구현
• 2 드롭다운 필드 컴포넌트 구현