시작하는 중
나의 4번째 팀 프로젝트 회고 본문
싸피에서의 마지막 팀 프로젝트가 끝났다. 약 11개월간 많은 일들이 있었다. 웹도 하나도 모르던 내가 웹을 알아가고, 어떻게 하면 취업시장에서 남들보다 앞서갈 수 있을지 고민하며 지낸 시간이었다. 하지만, 결국에는 취업을 하진 못했으니 앞서가진 못한 것 같다. 하지만 개발자로써 어떻게 성장하고 싶은지는 알 수 있게된 시간이었다.
이번 프로젝트에서 한 것들은 다음과 같다.
1. 책을 많이 읽었다.
가고 싶던 회사도 떨어져서, 알고리즘 문제나 CS에는 시간을 덜 써도 되서 책을 많이 읽었다.
쏙쏙 들어오는 함수형 코딩
객체지향의 사실과 오해
이 2가지 책이다. 쏙쏙 들어오는 함수형 코딩은, 배민 스터디 모집에서 우아한 형제들 개발자 분께서 사용하신다고 공지하신 책이었고, 객체지향의 사실과 오해는 ios를 준비하는 친구가 추천해준 책이었다.
이런 책들을 읽으면서 성장한 점은, 로직을 어떻게 코드로 풀어낼까하는 고민을 체계적으로 하기 시작했던 것이다.
아직도 이해했다고 할 수는 없지만, 그래도 인사이트를 넓혀준 시간이었다.
2. 코드리뷰를 해봤다.
시니어, 주니어도 아닌 취준생들끼리 하긴 했어도 꽤나 의미있는 시간이었다고 생각한다. 서로 많이 배우고, 서로의 잘못된 습관들을 고칠 수 있었다.
코드리뷰 + 책을 읽음으로써 나의 코드나, 팀원의 코드에 대해 생각해보기 시작했다. 그래서 여러 영상들도 많이 봤다.
토스 SLASH 2022 Effective Component가 감명깊게 본 영상인데, 정말 좋다고 생각한다.
영상에서는 데이터를 처리하는 것, UI를 렌더링하는 것을 나누라고 해서 해본 코드이다. 개선해야할 점이 많지만, 이때 좋았던 점은 데이터에대한 복잡한 로직을 숨기고, 필요한 데이터만 가져오다보니깐, 편했던 것 같다.
3. 팀원에게 리액트 쿼리를 해보자고 설득해보기도 해봤다.
팀원이 리액트 함수 밖에서 리코일에서 관리하고 있는 토큰 atom을 가져오고 싶어했다. 리코일은 훅을 통해서 데이터들을 제공하기 때문에, 할 수 없었다. 이때 권해본 것이 리액트 쿼리이다. 이를 정리하며 작성한 글은 다음과 같다. 리액트에서 ajax요청 다루기
정리하며 도입한 덕분에, 큰 사고 없이 도입할 수 있던 것 같다.
4. 내가 공부한 것들이 나의 기반이 되는 것을 느꼈다.
매번 느끼지만, 남에게 알려줄 때마다 너무 즐거운 느낌이 든다. 이번에는 useState에 함수를 넣는 것이나, useEffect의 종속성 배열에 대한 것이나, 렌더링 순서에 대한 것, axios의 interceptor에 대한 것도 알려줬는데, 이렇게 자신있게 알려줄 수 있는 것들은 늘 나를 즐겁게 만든다.
5. 웹페이지 구현
이건 너무 당연하니깐
6. 일급 객체 맛보기
위의 쏙쏙 들어오는 함수형 코딩 + 유인동님의 함수형 프로그래밍 2개도 들었는데, 이해하는데는 시간이 걸렸지만 정말 재밌었다.
그리고 이를 적용해보는 것도 재밌었다. 강의만 봤을 때는 뭔가 라이브러리 활용 방법에 대한 강의같았는데, 책까지 같이보고 다시 들으니깐 새로웠다.
그리고 직접 적용해보기도 하였다.
7. "내가 할게"를 줄이기도 하였다.
여태껏 맡아온 프로젝트는 "내가할게"가 좀 많았다.. 할 수 있는 것들이 있으니, 어떻게 할지 머릿속에 그려졌고, 남들이 좀 안한다 싶으면 내가할게가 계속 나왔던 것 같다. 사실 이런 로직을 구현하는 것은 얼마 걸리지 않았다. 문제는 백엔드와의 소통에서 나오는 디버깅에 가까운 행위들이나, CSS를 적용하는 것들이나 데이터를 CRUD를 하는데서 나오는 필요하지만 줄일수도 있던 보일러 플레이트들이다.
이런 것들이 시간을 뺏어가서 오래걸렸던 것 같다. 특히 CRUD를 하는 것들은 반복되다보면, 정신적으로 조금 피곤하게 느껴진다..
8. 라이트 하우스의 ALL 90점 이상을 달성해보았다.
이게 정말 재밌었다. HTTP 2도 적용해보고, GZIP도 적용해보고, NGINX도 맛보기로 만져보고, 브라우저 캐싱도 해봤다. 총 10가지 정도 적용해 본 것 같은데, 그 결과로 성능을 크게 올렸다.
9. 타입스크립트를 적용해봤다.
약간 ERD를 설계하는 느낌이라서 정말 재밌었다. 제네릭에 대한 이해가 아직 부족하지만, 노력하다보면 점차 나아질 수 있지 않을까
10. 리액트 쿼리도 적용해봤다.
리액트 쿼리도 정말 재밌었다. 특히 queryClient 인스턴스 자체를 export/import해서 사용할 수 있다는 것이 진짜 재밌던 것 같고 많은 것들을 할 수 있었다.
아쉬운 점
1. 여전히 반복되던 것들
프로젝트 진행 중에 정말 아쉬웠던 순간이 하나 있었는데, 거의 동일한 기능을 가진 컴포넌트를 나와 팀원이 하나씩 만든 것이다. 다음 프로젝트할 기회가 있다면, 컴포넌트를 어디까지 쪼개고 사용할 것인가에 대한 이야기도 해봐야겠다.
2. 나중가니 수정하기가 힘든 코드들
이전 프로젝트보단 덜해도, 나중가니까 수정하는 것이 쉽지 않았다. 그 예시로, 리액트 라우터 가드를 하나 만들어서 라우트의 navigate에 대한 flow를 하나 만들려고 했는데, 전역적으로 퍼져있는 토큰과 navigate들을 건드는 것이 쉽지 않아서 포기하고 플젝끝나고 하기로 했다... 역시 발전을 조금 했지만, 아직도 아쉬운 것 같다. 디자인 패턴을 알아봐야할 것 같다는 생각이 든다.
3. 아직도 부족한 UI&UX에 대한 생각
따로 하나 책을 읽어봐야할 듯 싶다.. 이게 개발하고 나서 직접 테스트해볼 때 생각나게 된다. 그 때조차도 모를 때도 많다. 역시 UI UX는 어렵다
4. 결국 플젝기간동안 하지 못한 기능
바로 토큰에 관한 것인데, 팀원이 만든 코드에 버그가 있어서 과감하게 버리고 리액트 쿼리로 했다. 내가 하고 싶던 것은 다음과 같다.
- 리프레시 토큰이 로컬스토리지에 없다면 로그인 처리 자체 X
- 리프레시 토큰이 있다면 로그인 처리
- 리프레시 토큰이 유효하지 않다면 로그아웃 처리
근데 자꾸 특정 상황에서 에러가 떳다. 문제는 이게 모바일에서만 발생해서 전혀 감을 잡을 수 없다는 것이다.. ㅠㅠ
5. 결국 하지 못한 에러에 대한 처리
API 응답의 실패 여부에 대한 것들이나, 오류가 어떻게 오는지에 대한 핸들링이라던가, suspense 컴포넌트들도 써보고 싶었는데.. 뭔가 바빴던 것 같다.
나아갈 점
1. 아토믹 디자인 공부
컴포넌트를 어디까지 쪼갤 것인가에 대한 고민을 해봐야겠다.
2. 성장 가능한 컴포넌트
토스 SLASH 영상 보고 좀 더 고민하면서 지금 프로젝트를 리팩토링하려고 한다.
3. 타입스크립트에 대한 공부
타입스크립트도 진짜 재밌다. 제네릭에 대해 공부해보려고 한다.
4. Next.js에 대한 공부
요새 기업에서 원하니깐, 경험용으로 이를 한번 써보려고 한다!
5. 에러 핸들링에 대한 고민
어떻게 해야지 좋은 처리라고 할 수 있을까? 감조차도 오지 않지만 노력해봐야겠다.
6. UI & UX
우선, 리팩토링을 하면서 개선시켜볼 예정이다. 그럼 좀 더 인사이트가 넓어지지 않을까
7. 코드에 대한 고민
이게 제일 재밌는 것 같다. 같은 로직을 더 짧고 간결하게 사용할 수 있다거나, 만들어둔 기능을 그대로 가져다 쓸 때의 기쁨이란 멈출 수가 없는 것 같다.
이번 프로젝트는 상을 타기 위해서, 본인은 BE를 희망하지만 YOLO 모델을 다루는 일이나, FE를 희망하지만 유니티를 공부하는 등의 불상사를 막기 위해 만든 팀이었다. 정말 하고 싶은 공부 + 프로젝트를 병행한 팀이었다. 그만큼 공부할 시간도 많았고, 우리의 성장을 위해 진행했다.
다들 많이 배우고 많이 성장했던 시간이었으면 좋겠다.
'회고' 카테고리의 다른 글
| 싸피 듣다보니깐 들은 생각 (1) | 2022.10.04 |
|---|