⚠ 새벽 4시, 피폐해진 정신으로 쓰고 있습니다. 문맥이 매끄럽지 못하고 영양가 없는 글이여도 양해 부탁드립니다.
첫 협업 프로젝트
2주간 리액트를 배우고, 처음으로 협업 프로젝트를 진행하게 되었다. 사실 배운지는 모르겠다. 밀려있던 Vue강의와 과제를 해치우느라 실질적으로 공부했던 기간은 일주일 남짓. 강의를 들으면서도 리액트에 대해 전혀 이해하지 못했지만, 늘 그랬듯이 결국 해낼 거라는 위험한 자신감으로 첫 협업 프로젝트를 맞이하게 되었다.
데브코스에서의 첫 프로젝트는 2주간 프론트엔드 수강생 3명이서 프로그래머스에서 제공하는 API를 통해 SNS서비스를 제작하는 것이었다. 백엔드 수강생과 함께하는 다음 프로젝트에 앞서, 협업능력을 기르려는 목적인 듯하나, 형편없는 리액트 실력 탓에 엄청난 난항을 겪고 있는 중이다. (-ing)
프로젝트 환경세팅
React, TypeScript, ContextAPI, styled component, axious, netlify, GitLab flow, Gitmoji
특정 기술을 선정한 특별한 이유는 없었고, 대체로 배웠던 기술 + 배우고 싶었던 기술 위주로 설정하였다.
타입스크립트
프로젝트 환경을 논의할 때 까지만 해도 난 앞서 말한 위험한 자신감에 차있었다. 그렇게 한번도 써보지 않은 타입스크립트를 사용해보자는 제안을 흔쾌히 받아들였고, 알 수 없는 에러와 any로 범벅된 타입스크립트를 사용하면서 고통받게 되었다. 맞으면서 배우는 타입스크립트를 예상했지만, 리액트만으로도 충분히 아팠던 지라, 결국 any 뒤에 숨어 배우기는 커녕 당장의 에러를 감추기 바빴다.
GitLab Flow, Gitmoji
브랜치전략, 전부터 너무 해보고 싶었다! 나는 혼자서 커밋메시지를 작성하는 것은 백업파일을 만드는 것 정도로 생각했었고, 마구잡이로 커밋을 작성하는 안좋은 습관이 생겼었다. 하지만 협업프로젝트를 진행하면서 git의 다양한 기능을 써볼 수 있다는 생각에 들떴다. 하지만 커밋에 오점을 남기지 않으려고 구글링에 많은 시간을 할애하게 되었고, 더 완벽한 커밋을 남기기 위해 커밋을 아끼다가 커밋타이밍을 놓치기 일수였다.
axious, JWT토큰
API 명세서를 봐도 어떻게 불러오는 지 감이 오지 않았고, 예전에 쓰던 코드와 구글링한 코드로 API를 요청했지만 여전히 에러의 향연이었다. 결국 팀원의 도움을 받아 토큰이 뭔지 알게되었고, axious 공식문서를 참고하여 오랜 시간 끝에 API를 불러올 수 있었다.
자식 컴포넌트에서 부모 컴포넌트 state 변경
열심히 댓글을 작성/삭제하는 기능을 만들었지만, 새로고침 하기 전까지는 반영이 되지 않았다. 리액트에 대한 충분한 이해를 하지 못했고, 이미 api로 진이 다 빠져있던 터라 이 문제를 해결하는데 꽤 오랜 시간이 걸렸다. props를 통해 부모컴포넌트의 state를 변경하는 함수를 자식컴포넌트로 넘겨 반영할 수 있도록 하였는데, 좋은 방법인지는 확신하지 못하겠다.
협업프로젝트와 동료
협업으로 프로젝트를 진행하다보니, 다른 팀원에게 누가 되지 않도록 더 열심히 하게 되는 듯 하다. 컴포넌트를 공유하기 위해 가독성 높고 일관성 있는 코드를 작성하여야 해서 확실히 더 많은 것을 배우고 있다.
또, 운좋게도 우리 팀에는 개발경험이 있는 팀원이 있어서 많은 도움을 받을 수 있었다. 내가 오랜시간 힘들게 고생하던 문제를 그 분이 20초만에 해결할 때는 형용할 수 없는 경외심이 든다. 그리고 약간의 억울함까지. 내가 닥친 문제를 해결해주고 설명해주는 모습과, 조급해하지 않아도 된다며 다독여주는 모습이 너무 멋있어 보였다. 빨리 더 잘하는 개발자가 돼서 여기저기 도움을 주고 싶다.
