원티드 프리온보딩 프론트엔드 코스 회고

원티드 프리온보딩 프론트엔드 코스에 참여하면서 얻은 것들

|4분 읽기
ReactTypeScriptTeam ProjectRetrospectiveWanted PreOnBoarding Frontend CourseReduxRedux Toolkit협업코드 리뷰GitCommit Message페이지네이션Pagination무한 스크롤Infinite ScrollCustom Hook회고프론트엔드

시작

부트캠프가 끝난 이후 잠깐의 휴식 시간과 취업을 위한 기반을 정비하고 있을 때였다. 채용 공고에 나오는 기술 스택이나 우대 사항에는 미치지도 못하고 부트캠프에서 진행한 두 개의 프로젝트 밖에 없었기에 불안감과 조급함을 항상 가지고 있었던 것 같다.

그 와중에 채용 공고 사이트와 페이스북의 개발 관련 그룹 게시글들, 수많은 오픈 카톡방을 매일 들락날락거리며 어떤 식으로 준비할 지를 고민하던 찰나에 광고를 보게 되었다.

커리어 시작을 위해 무엇이더 필요한가요? 그동안 배운 내용과 기업의 기술 과제는 무엇이 다른가요?

채용 공고들 중 절반 정도는 과제를, 절반 정도는 코딩 테스트를 채용 프로세스에 포함하고 있었기에 둘 모두 준비를 해야할 것 같다는 생각이 들었다. 그런데 마침 기업의 기술 과제를 동료들과 함께 학습할 수 있다고 해서 지원을 마음 먹었다.

사전 과제 준비

사전 과제가 선발 기준에 있었기 때문에 과제를 수행하고자 확인해보니, 가장 단순한 형태의 인증/인가, 즉 Auth와 가장 단순한 형태의 CRUD가 주제였다.

사실 직접 Todo List를 혼자 처음부터 끝까지 만들어본 경험도 한 번 정도밖에 없었고, 당시에는 JavaScript로 진행하고 API도 없이 진행했기 때문에 Todo List를 배열에 넣고 map, filter, push 등의 메서드로 쉽게 구현했었기에 이번에는 CRUD와 Auth를 학습하는 기회로 삼아야 겠다고 생각했다.

Todo List 만들기 링크 첨부

합격과 오리엔테이션

Untitled

결국 합격하게 되어 프리온보딩 프론트엔드 코스에 참여하게 됐다! 열심히 참여해서 취업에 한 발 더 가까이 다가갈 수 있으면 좋겠다.

전체적인 코스에 대한 오리엔테이션과 멘토님의 오리엔테이션이 진행됐는데, 역시 팀으로 동료들과 함께 머리를 맞대고 피드백을 주고 받으며 코드를 개선하는 방식으로 진행되는 것이 너무나 마음에 들었다. 여러 동료 개발자를 알게 되는 것부터 남들이 보는 내 코드에 대한 피드백과 그로 인해 코드를 개선하고 더 좋은 코드를 작성하는 것은 언제나 환영이다.

심지어 매일 확인하는 여러 테크 뉴스레터나 페이스북에서 보며 협업 기술, React 렌더링 최적화, Clean Code 등 여러 프론트엔드 토픽들에 대해 관심을 가지고 있었는데, 그런 주제들 세션 주제로 있어서 더 마음에 들었다.

협업 기본기를 닦는 시간

원래 Commit message나 README.md, Commit History 등에 대해 지저분하다고만 생각했지 반드시 개선해야 한다는 것까지는 느끼지 못했다.

Untitled

Untitled

지난 팀 프로젝트를 수행할 때 심지어 시간도 부족한데 에러도 지속적으로 발생해 급하게 작업을 진행하느라 Commit message가 아주 지저분하고 결국 뭘 수정했는지 확인하려면 Commit한 코드를 뜯어봐야 했다. 이러한 부분은 개발자와 협업을 위해 개선해야 하므로, 이후 프로젝트에서는 Commit message도 신경써서 작성하고, 컨벤션을 철저히 설정하여 준수하고 있다. Commit message만으로 어떤 작업을 진행했는지 확인이 가능하게끔 작성하고자 노력하고 있다.

Untitled

Untitled

Untitled

어떤 작업을 진행했는지를 추가적으로 작성하거나, 코드의 목적을 명시하는 등으로 Commit message를 작성하려고 노력했고, 지속적으로 적용하는 중이다. 정말 좋은 협업 방식을 배워서 좋았다.

여러 기능을 구현한 시간

협업 기본기만 갈고 닦은 것은 아니고, 기업 과제를 수행하면서, 세션 강의를 학습하면서 여러 기능을 구현해보면서 부족했던 부분을 채울 수 있는 좋은 시간이었다.

특히 이런 기능을 구현하면서 조금이나마 성장했다고 생각했다.

  • 지난 팀 프로젝트에서 문제가 됐던 Search와 무한 스크롤의 공존시키는 방법과 Redux, Redux-Toolkit을 활용하는 방법
  • 페이지네이션 기능, 로그인 유지 기능
  • 상세 페이지의 UI를 깔끔하게 재사용하는 방법, API 호출 코드를 분리해 깔끔하게 관리하는 방법

Redux로 Store를 구현해보고, RTK로 다시 구현하면서 밤을 새서 페어 프로그래밍을 해보기도 하고, 페이지네이션이나 무한 스크롤 기능을 Custom Hook으로 분리하여 재사용성을 높이는 코드를 작성해보기도 하고, API 호출 코드를 깔끔하게 관리할 수 있도록 분리하기도 하면서 협업을 하는 소프트 스킬뿐만 아니라 하드 스킬, 즉 개발 역량의 기초를 닦을 수 있어서 정말 참여하기 잘했다고 생각했다.

코드 리뷰와 피드백

가장 좋았던 것 중에 하나이다. 팀으로 과제를 수행하며 하나의 과제를 파트별로 나누어 개발하기로 했다. 개발이 완료되면 PR을 하고 코드 리뷰를 받았는데, 팀원들이 모두 좋은 실력을 가지고 있으셔서 코드에 대해 좋은 피드백을 받아 반영하면서 코드를 개선할 수 있었다.

특히 처음에는 단순한 변수명도 명확하게 작성하지 못해 많은 피드백(예시)을 받았지만, 이후에는 초반에 피드백 받은 내용을 꾸준히 상기하면서 작업을 진행해서 그러한 부분에 대한 피드백은 점차 줄어들어서 뿌듯했었다.

물론 내 코드에 대한 피드백(예시)만 좋았던 것은 아니다. 다른 팀원들이 내게 준 여러 피드백이 고마워서 팀원들의 코드를 수십번을 보면서 피드백을 주려고 노력했다.(물론… 시간이 부족했던 과제에서는 약간 미흡했다) 팀원들의 코드를 보는 것만으로도 충분히 시야가 넓어지는 것 같았고, 특히 API 코드 관리나 Custom Hook 코드 등은 많은 도움이 되었다.