05월 19일 프론트엔드 논의 사항

[WaiNaat]

개요

현재 프롤로그 프론트엔드 코드에 여러 문제가 있어서 작업 시마다 애로 사항이 꽃핀다.
이것들에 관한 내용을 간단하게 공유하고자 솔로스타의 주도 하에 간단하게 긴급 논의를 열어 진행하였다.

문제

1. 반응형

• 반응형에 대한 기준 (breakpoint, icon 등) 통일성이 부족
• 공통 커스텀 훅 같은 걸 만들거나 의존성을 설치해서 일관성 있는 사용이 필요
• 현재는 일관성이 너무 없음
• 공통 코드로 관리하는 게 유지 보수 측면에서 훨씬 좋을 듯함

2. utils 폴더

• 유틸의 기준이 모호함
• 활용성이 낮은 유틸은 걷어낼 필요성이 있음

3. 스토리북

• 스토리북 테스트 코드가 제대로 작동하지 않음

4. 커스텀 훅

• useUser, useNotFound 처럼 이상한 훅이 있음
• react-query 라이브러리와 useFetch 훅이 동시에 존재: 역할 중복

5. 타입스크립트와 자바스크립트의 혼용

• 정의된 타입들이 너무 적어 타입스크립트를 제대로 사용하기 힘듦

논의된 사항

대부분의 문제가 코드 전반에 내재되어 있어 지금 당장 해결이 어렵다.
다만 반응형에 대한 기준 은 현재 작업하고 있는 사항과 직접적인 관련이 있다.
따라서 반응형에 대한 기준을 정하고자 한다.

tailwindcss의 기준을 참고하여 반응형 기준을 다음과 같이 정했다.

이름	크기
xs	420px
sm	640px
md	768px
lg	1024px
xl	1280px

우선 지금은 픽셀 단위로 하드코딩하고,
나중에 이러한 부분을 담당하는 인원을 배치하여 상수화와 같은 작업을 통해 코드의 통일성을 높이고자 한다.