우당탕탕 1차 프로젝트 회고록

hwibaski·2021년 10월 20일

개발일지

목록 보기

6/10

thisisnevercode - 프로젝트 소개

1차 프로젝트는 약 한달반동안 배운 것들을 기반으로 하여 특정사이트를 클론 코딩하는 프로젝트이다. 우리 팀은 5명으로 구성되어있고 thisisneverthat 서비스를 클론 코딩하게 되었다. 팀명은 thisisnevercode이다. 본 서비스는 반응형이 구현되어 있고 심플하지만 UI, UX적인 부분에서 생각보다 많은 인터랙션을 가지고 있다. 프로젝트 기간은 10월 1일부터 10월 15일까지 약 2주이다.

thisisnevercode front-end
thisisnevercode back-end
진짜 thisisneverthat

역할 분담

🌈 FrontEnd 구현 기능

메인 페이지

캐러셀
반응형에 따라 컨텐츠 재배치
애니메이션 구현(스플래시 스크린)

리스트 페이지

영역 별 호버 효과
색상 별 이미지 전환
반응형
무한 스크롤
gototopbutton

상세 페이지

캐러셀
반응형

드롭다운 메뉴
브레드 크럼 구현
SORT 및 VIEW 모댤창 구현

회원가입 & 로그인

validation 기능 구현
반응형
약관 동의

🌈 BackEnd 구현 기능

리스트 페이지 API

무한스크롤 구현을 위한 상품 데이터 전달
상세 페이지 API
정렬 API
가격별 주문량에 따라 ordering된 상품 데이터 전달
카테코리 API
카테고리와 서브 카테고리 데이터 전달
회원가입 및 로그인 API
access token를 활용한 회원가입, 로그인과 로그아웃 기능(API)

내가 맡은 부분

정렬 API
Nav, Footer

시연 영상

회고

✅ 무식하면 용감하다.

프로젝트 팀이 정해지고 첫 회의가 생각난다. 초기 세팅을 하고 역할 분담을 했다. 팀원 5명 모두 프로젝트 경험은 전무했다. 어느 정도까지를 구현할 지 얘기를 하고 있었다. 아무것도 모르고 목표 페이지의 모든 것을 클론할 기세였다. 그 자신감은 불과 하루만에 산산조각이 났다. 평소에 아무렇지 않게 쓰고 있었던 dropdown menu, 이미지 슬라이더, 모달창을 끄는 버튼 등등 모든 것들이 그냥 뚝딱하고 되는 것이 아니라는 것을 뼈저리게 느꼈다. 프로젝트 하루만에 자신감은 겸손함과 경솔함으로 변해 다가왔다. 이슈를 대거 줄였다. 장바구니, 주문관련 기능을 구현하지 않기로 했고 UI와 layout 중심으로 프로젝트를 진행하게 되었다. CRUD를 제대로 경험하지 못한 것은 아쉽지만, 첫 술에 배부를 수 있으랴...

✅ 협업, 그리고 github

개발자는 협업 능력이 중요하다. 귀가 닳도록 들어왔다. 피부로 느끼진 못했었다. 프로젝트 중간에 프론트엔드 github에서 첫 merge를 하기 전까지 얼마나 덜덜 떨었는지 모르겠다. 그 날은 정말 merge만 했다. 아무도 코드를 merge해본 경험이 없었고, 행여나 내 코드나 나의 실수로 팀 전체에 피해를 줄까봐 조심스럽기는 너 나 할 것 없이 마찬가지였다. 우여곡절 끝에 모든 팀원의 코드를 front단에서 하나로 합치게 되었다. 하지만 그 후로도 여러가지 문제가 있었다. 커밋 자주 하기, 커밋 메시지 신중하게 작성하기, 브랜치에 따라서 건드리지 말아야 할 코드 건드리지 않기, 커밋 단위, 급해도 깃관리를 소홀히 하지 않기. 위의 5가지가 이번 프로젝트 코드 관리에서 많이 부족했던 부분들이다. 각자의 코드는 지금은 배우는 단계이기 때문에 다를 수 있고, 완벽한 코드를 짤 수 없다고 생각한다. 하지만 git은 더 좋은 방향으로 관리할 수 있었는데 마음이 급해지거나 귀찮거나 하찮게 느껴져서 잘 지켜지지 않은 부분이 많은 것 같다. 이런 안일함이 결국은 칼이 되어 돌아왔다.

1. 커밋 자주 하기, 커밋 단위

코딩을 한다. 내 마지막 커밋이였는지 언제인지도 모르겠다. 잘 진행되고 있던 로컬에서 오류가 난다. 마지막 커밋은 되돌리자니 너무 멀고, cmd+z로 되돌리자니 여기저기 손 댄 곳도 많아서 생각처럼 돌아가지도 않는다. 결국 팀원의 코드를 복붙해서 받거나 내가 작업한 코드를 손수 백업해놓고 커밋을 돌리고 붙혀넣고 다시 테스트하고... 시간적, 에너지적 낭비다. 정말 뼈저리게 느꼈다. 정말 간단한 기능을 구현했더라도 그 기능에 대해서는 커밋을 해야겠다. 그리고 생각해보면 간단한 건 없다. 그러므로 커밋을 자주하자.

2. 커밋 메시지 신중하기 작성하기

프로젝트를 진행할 때는 '이게 뭐 얼마나 중요하겠어'라고 생각하고 커밋 메시지를 대충 적었던 기억이 난다. 그리고 프로젝트가 끝나고 회고록을 쓰는 지금 시점에서 commit들을 보니 부끄럽기 그지 없다. 전체적인 흐름이 전혀 읽히지 않는다. 이 부분이 좀 아쉽다. 그래도 나름대로 디테일하게 기록한다고 썼으나 더 디테일 했으면 커밋 메시지만으로도 전체적인 흐름을 파악할 수 있었을 것 같다는 생각이 든다.

3. 브랜치에 따라서 건드리지 말아야할 코드 건드리지 않기

팀원들의 코드를 1차적으로 merge하기 전까지는 문제가 없었다. 1차적으로 프론트, 백에서 각자의 코드를 다 merge하고 프론트, 백을 붙혀보고 수정을 해야했다. 이때 나는 안일한 마음으로 대충 프론트,백 연결이라는 굉장히 넓은 범위의 브랜치를 만들고 여기저기 다 손을 대고 있었다. 사실 결과적으로 에러가 없거나 구동이 잘 됐다면 보기는 싫어도 문제는 없었을 것이다. 하지만 문제가 터졌을 때는 겉잡을 수가 없었다. vscode에 modified mark는 여기저기 불이 들어와있었고 어디가 잘못되었는지 도저히 찾을 수가 없었다. 머리가 하얘졌다. 거기다가 위에서 언급한 커밋도 자주 하지 않았으므로 총체적 난국이였다. 디버깅이 굉장히 힘들었다. 더 작은 단위로 커밋하고 더 세밀하게 브랜치를 파고 작업을 했었다면 가지치기도 좋았을 것이고 에러를 잡기도 수월했을 것이다. 5명의 2주 짜리 프로젝트에서도 이런 경험을 하는데 하물며 현업에서는 얼마나 애를 먹었을까 하며 오히려 가슴을 쓸어내리기도 했다.

4. 급해도 깃관리를 소홀히 하지 않기

우리 팀에게는 merge가 하나의 큰 event였다. 모두가 깃에 익숙하지 않고 걱정이 되다 보니 merge할 때 모두 디스코드에 모이거나 오프라인에서도 원탁에 둘러 앉아서 merge를 진행했다. 평소에는 각자의 코드를 merge하지 않았고 모두가 각자의 code를 한 번에 merge하려다보니 시간이 오래 소요되고 merge자체에 큰 시간을 할애하게 되었다. 이는 merge과정에서 피곤함을 느끼게 했고, merge할 코드를 세심하게 리뷰할 기회를 앗아갔다. PR에 올라온 코드들은 결국 merge해야하는 대상들에 지나지 않았고, 경각심을 잃기에 충분한 환경이 조성되었다. 그렇다 보니 PR도 대충 작성하게 되었다. 이것들은 결국 우리들의 민낯이 되어서 github에 그대로 남아있다. 차라리 첫 프로젝트에서 이런 것들을 느끼게 되어서 다행이라는 생각을 한다. 모두가 모여서 merge를 한 것 자체는 사실 문제가 되지 않는다고 생각한다. 하지만 그 과정에서 코드들을 신중하게 뜯어보지 않고 소홀히 여겼던 것은 문제가 됐다.

✅ 니가 그렇게 코딩을 잘해?

코딩을 잘하는 게 무엇일까? 좋은 코드란 무엇일까? 개발을 처음 공부할 때는 의미를 알 수 없는 길게 쓰여져 있는 코드들... 이런 것들에서 뭔가 대단함을 느껴었던 것 같다. 하지만 프로젝트를 진행해보니 최대한의 간단하고 알아보기 좋은 코드가 좋은 코드라는 것을 느꼈다. 설명이 필요한 코드는 좋은 코드가 아니다. 알고리즘 문제를 풀듯이 이 코드를 설명을 해야한다면 그건 좋은 코드가 아니라고 생각한다. 단적으로 내 코드를 팀원들이 알아보지 못한다면 주석을 달거나 시간을 내어서 설명을 해야한다. 이는 결국 에너지적, 자원적, 그리고 시간적인 로스이다. 회사에서는 결국 전체의 경제적 손해이다. 그러므로 최대한 알아보기 쉽고 읽히기 좋은 코드를 작성하도록 노력하자. 물론 한 번에 그렇게 하기는 쉽지 않을 것이다. 지금 단계에서는 구현 자체가 굉장히 힘들기 때문이다. 하지만 리팩토링을 하거나 의식적으로 쉬운 코드를 쓰려고 노력을 해야겠다.

✅ 문서화와 정확한 역할 분담

이번 프로젝트에서 목표한 것이 개인적으로는 개발일지를 매일 쓰는 것이였고, 팀적으로는 회의록과 우리가 개발하는 것들을 일련의 문서로 잘 정리하는 것도 목표였다. 하지만 목표만 있고 구체적인 계획은 없었다. 개인적인 목표인 개발일지는 개발에 밀려서 프론트쪽만 남게 되었고, 문서화는 정확한 역할 분담이 없었기에 어느 날은 내가 하거나, 어느 날은 팀원 분이 하거나 하다가 결국은 아무도 하지 않게 되었다. 돌이켜보면 우리는 개발에 너무 집중한 나머지 또 다른 중요한 부분을 놓친 것들이 많다. 누군가의 개발에서 막히거나 잘 안되는 것이 있으면 거기에 모든 팀원들이 붙어서 같이 고민하고 해결하고 했던 적이 굉장히 많다. 물론 이것을 좋지 않다고 말할 수는 없다. 하지만 전체적인 프로젝트 관점에서는 누군가는 그 시간에 문서화나 시간 관리 같은 것들을 하고 있었어야 될지도 모르겠다.

✅ 그럼에도 불구하고...

2주를 열심히 불태웠다. 거의 매일 새벽까지 회의를 하기도 했고, 각자의 자리에서 열심히 무언가를 했다. 프론트와 백의 코드를 서로 붙혔을 때의 희열감, 돌이켜보면 아무것도 아닌것을 모두가 같이 고민하던 것을 누군가 해답을 제시했을 때 나오던 환호성. 고생했던 기억보다는 즐거웠던 기억이 많다. 결국은 커뮤니케이션이 중요하다. 사람과 사람 사이의 관계가 매끄럽고 좋아야만 커뮤니케이션이 잘 오갈 수 있다. 사실 이건 개발분야에서만 중요한 것은 아니다. 개발 분야에서도 중요한 것이다. 결국은 사람이다.