호팍이
article thumbnail

벌써 코드스테이츠를 졸업한 지가 4개월이 지났다.

코드 스테이츠를 졸업하고 바로 원티드 프리온보딩을 거치고, 이력서를 계속 수정하면서 이력서를 제출하고, 과제 테스트를 보고, 면접을 보면서 지냈더니 4개월이라는 시간이 훌쩍 지나갔다.

4개월이라는 시간이 지나다보니 이력서에 제출한 프로젝트가 하나라는 게 공부를 열심히 하지 않은 것처럼 보일 수 있겠단 생각이 들었다. 그래서 새로운 프로젝트를 하나 만들어 보기로 했는데, 완벽하게 끝내지 못한 메인 프로젝트가 걸렸다.

따라서 메인 프로젝트를 제대로 마치고 새로운 프로젝트를 만들어 보자는 생각에 1차 리팩토링을 끝낸 코드를 다시 헤집어 봤는데... 좀 많이 건드려야 할 거 같다는 생각이 들었다.

이번에야 말로 저번에 적용하지 못한 전역 상태 관리와 react query에 대해 더 깔끔하게 적용해 볼 예정이다.

 

수정 or 새로 적용할 스택

1. Redux-toolkit

  • 요즘 쓰기 편하고 좋은 Zustand가 나왔다고 해서 써볼까 했지만 아직 많이 활성화 되어있진 않아서 Redux를 사용하기로 마음먹었다.
  • 아무래도 제일 오래되고, 제일 업데이트 잘되고, 제일 많이 쓰기 때문에 안정적인 redux를 사용하는 게 맞다 생각했다.
  • 클라이언트 단의 데이터만 관리할 것이기 때문에 saga, thunk는 사용하지 않을 예정이다.

2. React-query

  • 간단한 useQuery를 커스텀훅으로 만들어 관리했는데, 재사용을 하지도 않기 때문에 굳이 나눌 필요가 없다 생각했다. 따라서 컴포넌트를 나눈 다음에 useQuery는 어떻게 처리할지 더 생각해 볼 예정이다.
  • 또한 useQuery에서 지원하는 loading 기능을 안 쓰고 있었는데, 이번에 적용할 예정이다.

수정할 부분들

1. 게시글 작성 및 수정 페이지

수정 페이지 및 작성 페이지

  • 게시글 수정 페이지와 작성 페이지의 디자인이 똑같다 보니 한 컴포넌트에 관리했었는데, 아무래도 하나의 컴포넌트에는 하나의 기능만 있는 게 맞는 것 같아서 수정 페이지와 작성 페이지에서 레이아웃 부분만 재사용하는 방향으로 갈 예정이다.

2. 마이 페이지

마이 페이지

  • 마이 페이지의 컴포넌트 분리를 하지 못해서 마이페이지의 페이지에서 거의 모든 걸 다 작성했었는데, 이번에는 나눌 예정이다.

3. 드롭 다운

  • 드롭다운에서 버튼 부분만 재사용 가능하게 끔 적용을 했는데, 리스트 부분에서도 재사용을 할 수 있도록 바꿀 예정이다.
profile

호팍이

@호팍이네