리팩토링을 다시 시작하는 도중 내 코드는 손을 댈 수 없다는 것을 깨달았다. 폴더 구조도 뒤죽박죽이고 모듈화를 진행한다고 해도 답이 없고 css 네이밍도 의미없이 지었다. 추가적으로 페이지네이션과 무한 슬라이드, 지도 api 사용 등도 내가 직접 짠 코드 보다 복사 붙여넣기 한 코드가 훨씬 많았다.
그래서 아예 갈아엎는 기념으로 리액트로 바꾸기로 했다. 리액트로 바꾸면서 자바스크립트로 구현한것과 리액트로 구현하는 것의 차이점을 생각해보고 직접 느껴봐야겠다.
프로젝트 시작 전에 고려해볼점
- 폴더와 파일 기능별로 나누기. 하나의 파일에 하나의 기능이 들어가게 하고, 그 기능의 공통점으로 폴더를 나누자.
- npm vs pnpm 과 vite로 할 지 create react app 만드는 걸로 할지 생각해보기.
-> 현재 진행중인 프로젝트는 pnpm vite 로 진행하므로 리팩토링은 npm create react app 으로 진행하기로 했다. 사실 작은 프로젝트라 체감은 되지 않겠지만 둘 다 배워보자.- 상태관리 툴을 사용할 지 생각해보자.
- 사진은 어떻게 처리할 지, 네트워크 비동기 처리는 어떻게 처리 할 지 등 최적화 생각해보기.
- 추가로 api 키나 경로 env로 숨기기
