프론트엔드 프로젝트 첫 시작 시, 고려사항들 노트용

- 권한별 라우트 처리

- theme, style, 아이콘 관리 파일

- 낙관적 업데이트 (React Query - get은 낙관적 업데이트를 하면 데이터를 새로 불러오기 전 보이는 캐시 데이터로 인해 오해를 불러올 수 있음 -> get은 낙관적 업데이트 x, 로딩바로 제어. put/post/remove는 낙관적 업데이트로 등록/수정/삭제 네트워크 성공 전에도 바로 적용된거처럼 낙관적 업데이트를 진행한다. 혹시 네트워크 실패로 등록/수정/삭제가 제대로 이루어지지 않은 경우에는 저장해둔 이전 데이터로 롤백하도록 한다.)

- providers 폴더 (AuthProvider, ThemeProvider, QueryProvider,...)

- validation schemas

- utils, libs, hooks 고려

- 전역 상태 관리 (Zustand)

- 에러 및 성공 메세지 관리 파일

- 버튼 더블 클릭 방지

- 응답 성공 실패 및 알림 notification 전역 관리 기능

- 단어 및 상태 통일성을 위한 상수파일

 

- layout

  . 기본 레이아웃 틀 Dashboard / Public / Minimal (회원가입,로그인 화면)

  . 후에 레이아웃 틀을 추가되는 경우를 대비하여 확장성 레이아웃 플로우 추가
  . 과정 : 1) 새 레이아웃 추가 2) Container 컴포넌트에 원하는 variant 추가 혹은 기존 variant 사용하여 레이아웃에 적용 3) routes/config 파일에서 사용할 layoutType 정의 4) routes/helper 파일에서 layoutMap 매핑 추가 5) 끝.
  . 해당 과정은 docs 폴더 가이드 파일로 정리 완료

 

- 기본 함수 및 utils..

  . 핸드폰 번호는 번호로만 받고 formatter 함수 사용해서 표기만 010-****-****로 변경시켜준다.

 

 

- 상세페이지 : 뒤로가기 버튼과 함께 이전 페이지 title 표기

- 테이블 : 페이지네이션 / 정렬 / 필터 필수

 

 

 

 

 

- 커서룰 적용

 

 

 

 

더 뭐가 있을까요,,