팀 프로젝트 최종 점검 (1)

이전 커피챗에서 말씀드렸듯 전체적으로 짧은 시간에 잘 작성해 주신 것 같고, 큰 버그 없이 기능도 완성이 되어있어서 좋았어요!

아래에서는 조금 더 보완이 되면 좋을만한 요소들을 나열해 보도록 하겠습니다.

components 폴더 구조

도메인 별로 좀 더 묶어주고, 나눠주는 연습이 필요할 것 같다고 느꼈습니다.
파일이나 폴더의 수가 너무 많아지면, 나중에 프로젝트를 유지보수하는 것이 어려워질 수 있어요. 그렇기 때문에 이런 부분에 대한 습관을 가지는 것이 좋습니다.
hooks들로 api 통신 등을 분리한 부분은 아주 잘 되어있어요! 다만 hooks라는 별도의 폴더에 모두 몰아놓기보다는 전체적으로 공통적으로 사용할 만한 것들만 공통 폴더에 두고 (useDebounce, useTimeoutFn 같은) ‘인증’ ‘검색’ ‘글 작성’ 등의 도메인으로 컴포넌트들과 colocation(가까이 놓기)를 하는 것도 고려해주시면 좋을 것 같아요.

SWR, React-query(Tanstack query) 같은 data sync 라이브러리 사용

fetch state를 관리할 수 있어 큰 앱에서는 이런 류의 라이브러리가 도움이 많이 되고, 최근들어 많이 사용하고 있는 추세입니다.
이를 사용하면, recoil 같은 라이브러리가 필요하지 않아질 수도 있습니다. (좀 더 앱이 간단해짐)

absolute path 사용하기

https://medium.com/@davidmieloch/tilde-paths-with-eslint-typescript-and-webpack-971f694c9b15 같은 가이드를 참조해보시면 좋을 것 같습니다!
relative path의 장점도 있지만, 트랜스파일러 설정을 조정하여 absolute path를 사용하면 어떤 임포트 패스를 사용하고 있는지가 모든 파일에서 동일하게 나타나기 때문에 좀 더 임포트 상황을 파악하기가 쉬워집니다.

간단한 지적사항들

일부 빌드툴 등 개발환경에서만 사용되는 의존성들을 devDependencies로 정리 (실제 프로그램에 특별히 큰 영향을 주는 것은 아니지만, 늘 정리해 두는 것이 좋아요)

https://github.com/prgrms-fe-devcourse/FEDC3_Tripend_JAEHO/blob/develop/package.json#L23-L34