til

Next.js 심화 6일 차(完) @KPT 회고, 개선할 점들

fpzmfks 2024. 10. 17. 21:45

오늘은 프로젝트를 종료하며(그리고 부족한 시간으로 인해 발표 직전까지 계속 코드를 고치며) 프로젝트를 회고하고 지적받은 점들을 기록해두려고 한다. 

 

우선 아래는 팀에서 작성한 회고이다. 

Keep - 현재 만족하고 있는 부분

  • 필수 구현 사항을 기한 내에 구현해서 프로젝트를 잘 마무리할 수 있었다.
  • 팀 내에서 의논할 것이 있으면 의사소통을 통해 문제를 해결할 수 있었다.
  • 다양한 상황에 맞춰 유연하게 문제를 해결하고 대처할 수 있어서 좋았다.

Problem - 불편하게 느끼는 부분

  • 의사소통 과정에서 이야기가 너무 길어지는 경우가 있었다.
  • 팀원들과의 기획 단계에서 어떤 기술을 사용할 것인지에 대한 내용을 미리 더 생각했으면 좋았을 것 같다.

Try - Problem에 대한 해결책, 당장 실행 가능한 것

  • 되도록 사실 관계를 확실히 하고 스스로의 생각을 정리한 뒤에 의논을 시작하자.
  • 기획 단계에서 정리해야 하는 부분들을 미리 정리하고 차근차근 단계를 밟아가기

 

이번에는 촉박한 시간과 Next.js프레임워크에 익숙해지지 못했다는 점 때문에 내가 봐도 전체적으로 개선할 점이 눈에 띄었다. 튜터님이 프로젝트 발표 피드백을 하며 이러한 개선점들을 명확하게 짚어주셔서 이를 기록하여 다음 프로젝트들에 적용하고 시간이 될 때 이번 프로젝트를 개인적으로 리팩토링 해보고자 한다. 

 

  1. 폴더 구조(상세페이지)(예시 :  list/[id]===>detail/[id])
    • 프로젝트 세팅할 때 상세페이지가 여러 곳에서 접근한다는 점 때문에 상세페이지 폴더의 위치를 어디에 두어야 할지 고민했었는데, 결국 list/[id]로 경로를 설정하기로 결론이 났었다. 
    • 하지만 피드백 시 이를 지적받았는데, 상세페이지는 여러 곳에서 접근하기 때문에 경로 설정을 좀 다르게 해주는 것이 알맞다는 것이었다. 
    • 그래서 다시 생각해보니 상세페이지 경로를 지정해주기 위해서 바로 '/[id]'를 사용하는 게 아니라 비어있는 폴더를 배정해주는 게 어떻겠냐는 생각이 들었다. 
    • 이전에 생각했다가 실패한 해결법 : '/[id]'
    • 이번에 생각한 해결법 : '/detail/[id]'
    • 여기서 파일 구조는 비어 있는 detail 폴더 안에 [id] 폴더를 집어넣는 것이다. 
    • 아직 테스트는 하지 못했지만 이번에 사용한 폴더 구조보다는 이렇게 폴더 구조를 짜는 것이 더 직관적일 것 같다.
  2. 타입 통합
    • 이번 프로젝트에서 프로젝트 세팅 시에 타입을 통합하지 않고 바로 시작했기 때문에 각자의 파트에서 따로 타입을 지정하거나 타입 파일을 만들었어도 나만 사용하거나 하는 일이 있었다. 
    • 분명 같은 데이터 타입을 사용해야 하는 부분이 있었기 때문에 이를 소홀히 한 부분은 확실히 반성할 만 했다.
    • 나는 타입 파일을 만들었지만 나만 사용한 경우였는데, 타입 파일을 만들었을 때 다른 팀원들에게 공유하여 논의를 통해 타입을 통합하는 과정이 있었어야 했다. 
    • 아마 다른 팀원분도 생각했겠지만, 이번 프로젝트 기간이 촉박하여 그러지 못했고, 다음 프로젝트 진행 시에 이러한 부분을 잘 고려해야겠다.
  3. 클라이언트 컴포넌트 다용
    • 이번에 내가 맡은 기능은 마이페이지였기 때문에 큰 고민 없이 클라이언트 컴포넌트들을 사용했는데, 튜터님께 지적 받은 뒤 살펴보니 확실히 클라이언트 컴포넌트를 사용하지 않아도 되었던 부분들이 보였다.
    • 애초에 마이페이지인지 어떤지랑 클라이언트 컴포넌트는 별로 상관이 없고, 나는 이번에 탭과 필터링 기능을 위해서만 클라이언트 컴포넌트를 사용할 필요가 있었던 것이지, 마이페이지의 헤더 같은 것들은 단순히 데이터를 불러오는 것이기 때문에 SSR을 사용하는 것으로 충분했었던 것 같다. 
    • 이 부분도 프로젝트 기획이나 세팅 시에 충분히 의논해서 결정할 수 있었던 사항이기 때문에 약간 아쉬움이 남았다. 하지만 아직 다들 Next.js에 익숙하지 않고 개념들을 완전히 이해하지 못했기 때문에(사실 나도 아직 클라이언트 컴포넌트를 지양해야 하는 정확한 이유는 잘 모르겠다.) 이번에는 어쩔 수 없었던 일이고 이번에 지적받은 것을 토대로 다음에 잘 적용해보자는 생각이 들었다. 물론 시간이 될 때 개인적으로 리펙토링도 진행해볼 예정이다. 
  4. 편의 기능? 사용
    • 프로젝트 시작 전 받은 강의에서 조드, 리액트 훅폼에 대한 설명을 들었지만 이번에 사용하지 못했다. 기능 구현에 급급해서 쓸 틈이 없었던 것도 맞지만 아직 제대로 이해하지 못했기 때문에 적용하지 못한 것이기도 했다. 앞으로는 이러한 추천받은 기능들을 사용하고 왜 이런 기능을 사용하면 좋은 것인지도 잘 알아보고 생각해보아야겠다.