FE

[논의 사항]

1. 컬러 팔레트
   • 전통주와 관련된 색상을 고려한 결과, 브라운, 황금색, 붉은색과 같은 쨍한 색상이 적합하다고 판단
   • 따라서, 컬러 팔레트를 쨍한 브라운 계열로 설정하고 포인트 컬러로 골드색을 추가할 예정
2. 목데이터 불러올 때 window.onload 사용 문제
   • window.onload는 비권장사항이므로 사용 X
   • 처음에는 worker.start() 후에 API를 불러오는 방식으로 처리했지만, main.tsx에서 한 번만 worker.start()를 호출하면 문제 없이 작동함
3. Admin 계정 생성 여부
   • 초기에는 관리자 계정을 한 명만 생성할 예정. 추후 관리 영역이 확장되면 관리자 계정을 추가할 수 있음
   • JWT에서 받아온 role 값에 따라 접근 권한을 부여할 수 있으므로, 별도로 admin 컬럼을 추가할 필요 X
4. 회원가입 애니메이션 Post 애니메이션과 통일
   • 회원가입에도 ChangePage 같은 공통 컴포넌트를 만들어 재사용할 계획
   • UI의 일관성을 위해 같은 애니메이션 라이브러리를 사용하고, shadcn UI로 변경하여 통일할 예정

[프로젝트 및 UI 관련 피드백]

1. 위치 정보 제공에 동의하지 않는 경우 모달이 계속 노출되면 사용자에게 피로감을 줄 수 있음
   • 모달이 아닌 오늘의 데일리 추천 영역에서만 위치 정보 제공 알림이 뜨도록 수정 권장
2. PC를 고려한 UI인지?
   • 최초 계획은 모바일로 진행하였으며 모바일인 경우 이상적인 UI
   • 차후 PC 서비스를 제공하는 경우 [썸네일|내용] 식으로 제공한다던가, 리스트를 2개가 아닌 더 쪼개서 제공하는 식으로 레이아웃 변경이 필요해 보임
3. 폰트
   • IOS는 16px이하인 경우 input창이 확대되는 경우가 있음
   • 기술적으로 작은 폰트는 UX에 좋지 않기에 가독성 좋은 폰트나 큰 폰트를 사용
4. 배포가 되지 않은 경우에 대비 사항
   • MSW를 활용
   • Firebase도 활용 가능
   • BE 개발 서버가 유지되지 않는다면 일부라도 보여줄 수 있는 기회가 필요하기 때문에 고려해봐야 함
5. 주석과 콘솔로그
   • TSDoc의 경우 오히려 필요
   • 주석 자체는 안지워도 상관 없음
   • 콘솔은 개발중 필요하다면 남기거나 vite에서 콘솔 삭제로 일괄 처리
   • TODO tree 확장자 통해 삭제할 주석 처리 가능

[Q&A]

1. msw와 zustand를 최대한 활용하는게 좋음

   • 여유가 된다면 예외처리도 진행 권장
   • delay 메서드를 통해 네트워크 딜레이가 있는것처럼 구현
   • 가상의 에러를 만들어 서버 에러 테스트 가능
   • 컴포넌트 렌더링도 에러에 따라서 처리 가능
   • 댓글 제출 상황인 경우 다른 댓글이 등록되지 않도록 예외처리 가능
   • 최근 FE 흐름은 퍼블리싱도 같이 진행하고 chatGPT를 활용해 업무를 진행하고 있음
   • 통신(MSW) 관련해서 어느정도 지식이 있어 어필 포인트가 되지 않음
   • UI나 UX관점에서 좀 더 돋보이거나 Three.js와 같은 3D 모델링 활용을 강조하는 방향

2. 선택과 집중이 필요 → BE검색엔진에 따라 선택 필요해보임

   [태그만 검색]

   • 빠르지만 구현이 상대적으로 간단함

   [태그 + 게시글(권장)]

   • 좀 더 세부적인 검색이 가능
   • BE에서 ELK를 사용한다는 전제하에
   • 자동완성의 경우 FE에서 debounce 처리 필요
   • 일정 길이 이상일 때 API를 호출하도록 처리 가능
   • 검색 결과를 캐싱하는 것도 고려 가능(tanstack query)
   • FE에서만 구현한다면 Hangle.js + Fuse.js 조합으로 구현 가능
   • MSW에서 적은 양에 대한 검색 테스트 진행 시 사용

3. 포트폴리오

• github 제출 방식은 거의 없으며 무작정 readMe에 작성하는 방식은 좋지 않음
• 1depth: 포트폴리오 or 자소서