HomeAboutMeBlogGuest
© 2025 Sejin Cha. All rights reserved.
Built with Next.js, deployed on Vercel
♥️
2기 최종 프로젝트 팀별 공간
/
💸
10원모아10조❗️
/
📗
프론트엔드 회의록
/
프론트엔드 회의록 (8/1)

프론트엔드 회의록 (8/1)

 
  1. 수입 지출 등록 중에 새로고침 시 노출되는 화면 어떻게 유지할 것인지?
    1. 수입 등록 중에 새로 고침 이후 해당 화면에 대한 isActived 상태를 유지하려면 url에 고정 필요함
  1. BottomNavigation
    1. → NavLink로 해야함. 라우팅 처리 필요한 컴포넌트
  1. Theme 잘못사용하고 있음
      • Provider로 주입하는데 컴포넌트마다 상수를 import해서 사용하고 있음.
      • useTheme 훅을 사용하거나 props에서 주입받는 값을 사용해야함.
      Theming
      Theming is included in the @emotion/react package.
      Theming
      https://emotion.sh/docs/theming
      Theming
  1. 컴포넌트마다 Props 타입 정의하는 방법이 다 다름
    1. 컨벤션 필요함
  1. 리뷰 방식
  1. 페이지 단위의 컴포넌트 → src/component 쪽으로 전체 이관
  1. 클래스 사용 지양하기
  1. 금액 포매팅 공통 유틸 함수로 빼기
 

14시 회의 내용(비올레, 다나, 제닛)

  1. 작업 공유가 필요
  • 정기 스크럼이 필요(매일 오후1시 or 오후 11시 - 소니가 되는 시간에)
  • 두 명 이상 대화해서 결정된 사항이 있으면 노션에 회의록 쓰고 → 슬랙에 공유
 
  1. 리팩토링 시간이 필요(중간 마감 이후)
  • 컨벤션이라도 맞추자
  • emotion theme 바꾸기
 
  1. 달력을 못할 수도
  • 작업할 여력이 없을 수 있는 파트
  • 기능적으로는 좋지만 개발적으로는 challenge가 적을 수 있는 파트
 
  1. 개발 일정 대략적으로 잡아보기.
    1. axios interceptor, 로그인 토큰 관련 작업은 소니가 담당. 로그인, 회원가입은 다나가 담당
      • 비올레 - 수입, 지출 등록 페이지 완성 및 수정 페이지 추가하기 + 검색 페이지 바로 시작
      • 다나 - 로그인, 회원가입 api 연동 및 로딩 처리 등등 UI 작업
      • 제닛 - 통계 페이지 컴포넌트 구현
      • 소니 - axios interceptor, 로그인 토큰 작업 완료 후 통계 페이지 컴포넌트 구현
 
  1. 달력 컴포넌트 추가할지 말지 비올레가 가장 하고 싶어하니 비올레가 정해서 루체에게 전달하기.
  1. 에러 상태 코드에 따라서 핸들링 해줘야 하는데 401, 403, 404는 리다이렉트 시켜주고, 400 일땐 에러 메시지를 받아서 처리하고 싶음. 500 에러일땐 어떻게 처리..?
  1. 네트워크 에러 핸들링을 처리하는 것도 신경써야 한다
  1. react-query default 옵션 회의 필요. 추후 리팩토링 하면서 react-query 컨벤션 맞추고 옵션 맞추기
  1. useIsFetching 활용??(모든 isFetching 상태 가져옴. 0보다 크면 로딩 컴포넌트 보여주기)
 

통계 페이지 API 회의 (Sony, Jenet)

요청url
  • statistics/year
Ex. statistics/year=2022
  • statistics/year={year}&month={month}
Ex. statistics/year=2022&month=7
 
json data : /percent에 따라 정렬필요
  • “name”: 카테고리명
  • percent: 소숫점 둘째자리까지
  • total: 양의 정수
 
<원 그래프용> - Jenet
const monthData = { year: 2022, month: 7, incomes: [ { name: '월급', percent: 50, total: 500000, }, { name: '주식', percent: 30, total: 300000, }, ], expenditures: [ { name: '식비', percent: 50, total: 50000, }, { name: '패션/미용', percent: 30, total: 30000, }, { name: '교육', percent: 20, total: 20000, }, ], };
 
<기타 그래프> - Sony
// 원하는 API 결과 값있으면 써줄것