정들었던 이전 팀과 헤어지고 새로운 팀원들과 프로젝트를 시작했다.
프론트엔드 개발자끼리 진행했던 이전 팀 프로젝트와 달리 이번 팀 프로젝트는 백엔드 개발자들과 진행하는 프로젝트이다.
FE 4명 BE 4명으로 팀이 구성되어 있으며 프론트엔드의 주요 기술 스택은 React, TypeScript이며 Turborepo를 이용해 모노레포 환경을 구축했다.
기획
초기엔 데이트 동선 기록 및 추천 어플리케이션을 주제로 프로젝트를 진행하려고 했었다. 그러나 백엔드 측에서 컨셉이 불분명하고 백엔드 측이 얻어갈 것이 적다고 해서 유기동물 보호소와 봉사자를 매칭해주는 어플리케이션으로 주제를 변경했다.
소통
백엔드와 함께하는 두번째 팀 프로젝트라서 기대를 갖고 시작했지만 기대한대로 진행되지는 않았던 것 같다. 백엔드와 프론트가 프로젝트를 바라보는 시각이 달라서 소통을 통해 조정하는 노력이 많이 들어갔다. 원하던대로 진행된 작업도 있고 그렇지 않은 작업도 있었는데 이번 경험을 통해 다른 포지션의 개발자들과 어떻게 소통해야 할지 많이 느낀다. API 명세는 프론트와 백엔드가 함께 해야함을 다시 한번 느꼈다. 이전에 진행했던 프로젝트와는 달리 이번 프로젝트에서는 백엔드가 API 명세를 작성하고 프론트엔드가 검수하는 방식으로 진행되었는데 검토 시간이 생각보다 너무 오래 걸렸다.
기술
프론트엔드 팀원들이 디자인을 진행하는 동안 Turborepo를 이용해서 모노레포 환경을 구축했다. Vite + react를 이용한 예제를 찾지 못해서 구글링을 통해 진행하느라 오래걸렸다. 배포에 대한 자료도 찾기 힘들었다... Turborepo를 vercel을 이용해 배포하는 방법을 찾으려고 Turborepo 공식문서를 한참동안 뒤졌는데 알고보니 vercel 공식문서에 그 방법을 설명하고 있었다.
목표
개인적으로 생각하는 이번 프로젝트에서 얻어가고 싶은 것은 다음과 같다
- turborepo를 이용한 모노레포 환경 세팅
- zod를 이용한 런타임 오류 캐치
- suspense, errorboudnary를 이용한 선언적 에러처리
- msw를 이용한 api mocking
- react hook form과 비제어 컴포넌트
- 채팅, 알림과 같은 서버와의 실시간 소통
- 백엔드와의 api 협의 및 소통
절반만 얻어가도 성공이라고 생각하는데 열심히 해야겠다...!
