카우치코딩 팀 프로젝트 1차구현 정리 및 회고

1차 프로젝트가 눈 깜짝할 사이에 끝났다. 약 한달정도 되는 기간 내내 매일 성장하는 기쁨을 느끼면서 코딩할 수 있게 해준 우리 팀원분들 모두 고맙습니다~ 💛 여러분들과 함께했기 때문에 프로젝트를 잘 마칠 수 있었어요! 🥳

🏆 프로젝트 소개
최종 결과물 확인 : https://www.camp-us.ga
우리가 진행한 프로젝트는 전국 캠핑장 추천 플랫폼 'CampUs'이다. campUs에서는 전국 3000 여개의 캠핑장 정보를 제공하고, 사용자의 위치에 따라 가까운 캠핑장을 추천해주는 서비스를 제공한다. 각 캠핑장별로 이용 후기를 남기고, 커뮤니티를 통해 캠퍼들간의 유용한 정보를 교류할 수 있다.

⌛ 진행기간
2022.01.18 ~ 2022.03.01 (5주)

📌 팀 구성 (TEAM COOP)
프론트엔드 2명 (김선희, 송창엽)
백엔드 2명 (김상운, 장대영)

Git Repositories

• CampUs Front Git Repository
• CampUs Back Git Repository

🏹 기술스택

FrontEnd

BackEnd

Infra

🎨 칸반보드

• FE 프로젝트 칸반보드
• BE 프로젝트 칸반보드

💡 기획 및 설계 문서

기능 명세서


페이지 기획서


디자인


DB 명세서


API 명세서


Swagger API 문서

✨ 담당 구현 기능

1. Navbar

• navbar UI
• 각 페이지별 route
• user데이터 받아오기
• 안 읽은 알림 갯수 뱃지 표현

2. 메인페이지

• 전국 시군구 데이터 추가
• 검색 시 검색 조건 state로 검색페이지에 전달하기
• 내 근처 캠핑장 추천 UI
• best리뷰 추천순 렌더링

3. 검색페이지

• 모바일 UI (데이터 유무에 따른 컴포넌트 렌더링, 지도맵 렌더링)

4. 상세페이지

• 후기 UI
• 후기 내용 10글자 이상일 시 더보기 버튼

5. 마이페이지

• 로그인 안된 유저 접근 제한
• 닉네임 수정
• 좋아요 클릭한 캠핑장 정보 렌더링 및 목록 삭제
• 작성 댓글 목록 렌더링, 수정, 삭제
• 알림 정보 렌더링
• 알림 개별 읽기, 삭제 / 전체 읽기, 전체 삭제

6. 공통 컴포넌트

• 삭제 모달 UI / 컨펌 시 삭제
• 불러올 데이터 없을 경우 보여줄 notice 컴포넌트 생성
• 날짜 타입 변환(ex. 방금전, 4시간전, 2일전)

🎬 프로젝트 진행과정

Planning meeting!
팀이 정해지고 나서 기획 및 디자인 설계 단계의 약 1주일 간은 거의 매일 slack에서 만나며 다 같이 기획과 디자인을 협의해서 만들어나갔다.

첫번째 Planning meeting (22.01.18)
1. 구현 기능 파악 및 계획

우리는 고캠핑사이트를 레퍼런스로 하여 공공데이터 오픈 API를 활용하여 캠핑장 정보를 제공하는 플랫폼 구축을 처음부터 목표로 하고 결성된 팀이었기 때문에 곧바로 API에서 제공해 주는 정보를 각각 파악하고 그 이후에 API를 활용해서 유저에게 제공할 페이지를 협의하였다.

2. 기획 및 디자인 설계 🎫

먼저 whimsical에서 간략하게 기능을 정리해보았다. 우리팀은 다들 개발욕심이 많아서 하다보니 5주안에 개발하기에 벅찬 양이 되고 말았는데.. 이 부분은 또 이후의 미팅을 통해 1차,2차로 개발 범위를 나누어서 따로 우리끼리 더 진행해보기로 결정했다.

1차 구현 기능 ✨

• 회원가입 / 로그인
• 메인페이지 : 검색, 내 근처캠핑장 추천, best 리뷰
• 검색페이지 : 검색결과 리스트, 검색 결과 검색 및 필터링, 캠핑장위치에 따른 지도에 결과 표시, pagination
• 상세페이지 : 캠핑장 좋아요, 리뷰 작성, 위치정보, 이용안내 및 시설정보
• 마이페이지 : 닉네임 변경, 좋아요한 캠핑장 목록, 내가 작성한 후기 목록, 알림 목록, pagination

2차 구현 기능 ✨

• 게시판 : 게시글 작성, 검색, 뷰페이지, 댓글작성, 좋아요 기능
• 마이페이지 : 내가 쓴 게시글, 댓글 목록, 수정 및 삭제
• 회원가입 : kakao oAuth, Naver oAuth 가입, 자체 회원가입
• 로그인 / ID,PW 찾기 : id,pw 찾기, kakao oAuth, Naver oAuth 로그인

디자인은 또한 1,2차 개발 범위를 구분하였는데 2차 개발은 디자인을 상세하게 구현하지 않아 아직 협의가 필요한 부분이 있다. 디자인은 앤트디자인을 활용하여 프론트엔드에서 UI를 만들어갈 예정이고, 카우치코딩의 은비 디자이너님께서 Figma를 이용하여 우리가 만든 화면기획서를 보고 디자인을 만들어주셨다. (어도비 프로그램은 써봤어도 Figma는 아직 써본적이 없는데.. 다음에 한번 이것도 툴을 배워봐야겠다...)

3. 프로젝트에 기대하는 것

늘 주변에 함께 개발하는 동료가 없는 환경이어서 혼자하는데 어려움을 겪고 있었다. 다들 현직에서 개발자로 일하고 있는 건 아니지만 개발자를 목표로 하는 사람들과 함께 이야기를 하면서 같이 결과물을 만들어가는 것이 기대가 되었다. 또, 한편으로는 항상 프로젝트를 할 때마다 트롤러(?)가 있어서 좀 걱정이었는데 우리팀은 정말 천상의 팀인지 완벽히 이상적인 팀이라 프로젝트 내내 갈등 한 번 없이 클린했다. 이 프로젝트를 계기로 앞으로도 쭉 소통할 수 있는 가까운 개발자 인맥을 만들고 싶은 마음도 있었는데 이건 앞으로도 좀 더 지켜봐야 알 수 있을 것 같다. 그리고 회고를 쓰면서 드는 생각이지만 그냥 slack을 통해서 대화하니 조금 요청사항과 수정완료된 사항에 대해서 정리가 잘 안되는 듯했다. 2차 개발할 때는 개인적으로 회의록?같은거라도 만들어서 기록하는 습관을 들여야 할 것 같다.

멘토님들은 이미 현직 개발자로 일하고 계신 분들이라 다른 회사에서는 코드를 어떻게 짜는지, 코드리뷰는 어떻게 하는지 살짝 엿보고 싶었는데 멘토님들이 직접 개발을 가르쳐주거나 개발하는 것을 보여주는 방식의 수업은 아니어서 아쉽게도 그런 기회는 없었다.

4. 프로젝트를 통해 얻은 것

프로젝트를 진행하면서 창엽님과 프론트엔드 관련하여 소통이 굉장히 많았다!! 대부분은 창엽님이 내가 모르는 부분을 지원해주기 위해서 시작된 것이지만..ㅎ 내가 부족함을 느끼고 자신감 없이 위축되어 있는 상태일 때 창엽님이 굉장히 좋은 말씀을 많이 해주셨는데 마음이 한결 편해지는 걸 느꼈다. 반대로 내가 창엽님의 입장이었다면 어떻게든 문제를 해결하는데 급급해서 그런 대응은 하지 못했을 것 같은데 협업이니만큼 같이 일하는 사람의 멘탈케어도 중요한 부분이구나!라는 생각이 들었다. 사람이 하는 일이다보니 사람의 몸과 정신상태에 따라 진행속도도 퀄리티도 차이가 많이 날 수 있겠다는 생각이 들었다. 그리고 백엔드분들도 굉장히 피드백이 빠르셨는데 뭔가를 슬쩍 의견을 얘기해보면 금방 뚝딱뚝딱 만들어주신다.

또 한가지는 firebase,구글 oauth, aws배포 이런 어렵고 안해본 것들에 대해 내가 기여한 바가 없었는데 그 때문에 창엽님이 굉장히 혼자 힘들었었다.. 내가 도움이 되지 못한 부분에 대해 미안했고 공부를 많이 해야겠다는 생각도 들고 부끄럽기도 했다.

5. 잘한 점 / 아쉬운 점

① 개인적으로 잘한 점
최대한 리뷰는 바로바로 반영해서 고치려고 한 것과, 깃 레포를 꼼꼼히 관리한 점은 잘한 것 같다. 깃 PR 관리는 조금 더 잘하고자 하는 욕심도 지금은 있지만 처음 한 것 치고는 꽤 소통이 수월했다는 점에서 다행스러웠다. 공부를 많이 하게 된 것도 이 프로젝트를 하면서 겪은 큰 장점이 되었다. 여러가지 케이스를 많이 구글링해보고 우리 프로젝트에 맞는 레퍼런스를 찾게되고, 리팩토링하는 과정까지 직접해보니 재미있었다.

② 개인적으로 아쉬운 점
코드리뷰할 때 멘토님을 리뷰어로 추가해두지 않았던점!!ㅜ 전혀 생각지도 못했는데 마지막 날 회고하면서 알았다..
두번째로는 내가 적극적이지 못했던 점. 내 실력에 대한 자신감부족이 원인이긴 했지만 2차 구현때는 조금 더 팀원들과 적극적으로 소통하고 의견도 내보고.. 어려운 일에도 참여해보도록 해야겠다.

6. 마치며

데모발표와 회고를 마치고 다른 팀 사람들의 이야기를 들으면서 여러가지 생각이 들었다. 우리는 큰 위기를 겪지 않고 무난히 완주하였구나라는 안도감이 듦과 동시에 우리 팀에 다양한 위기가 닥쳤을 때 우리 각자는 어떻게 대응할 것인지 궁금함도 들었다. 언제까지고 항상 행복하고 평화로우면 좋겠지만 시련은 갑자기 오는 법이니까.

이 때까지 회사에서 했던 프로젝트들을 진행할 때와의 경험과 대조가 되면서어떤 사람과 한 팀이 되고싶은지에 대한 생각도 되짚어보게 되었다. 6주동안 팀원들과 함께 경험을 해본 지금은 단지 실력있는 동료가 같이 협업하고 싶은 동료의 일순위가 되지 않는다는것을 알았다. 우리 팀원들은 진행하는 기간 내내 서로를 많이 배려해줬고 팀 분위기를 위해 많은 노력들을 해줬기 때문에 그 과정에서 모두 만족할만한 결과물을 만들어 낼 수 있었던 것 같다. 막바지에 다다를 수록 자꾸 끝이 난다는 시원섭섭함?이 밀려왔지만 그 들뜬 감정을 바로 밀어버리는 새로운 이슈들 덕분에 긴장감을 끝까지 놓을 수 없었다!

1차로 완료된 결과물을 보니 뿌듯하기도 하고, 기쁘기도 하고 단순 포트폴리오용으로 남겨두기보다 진지하게 기획을 더 고민해서 사업적인 측면을 강화해보고 싶은 욕심도 든다. 팀원들과 이야기해 보지는 않았지만... 우리는 aws로 배포했기 때문에 꾸준히 비용이 발생하는데 각자의 입장 차이가 있다보니 잠재적으로 비용이슈때문에 문제가 생기지 않을까 하는 우려도 생긴다. 그래서 더욱 수익모델을 만들어서 잠재적 문제도 해결하고, 수익이 발생하는 포트폴리오도 만드는 1석 2조의 효과를 누리고 싶은가보다.

그리고 개발을 하면서 기획,디자인 단계에서 미처 발견하지 못한 자잘한 문제점들을 많이 발견하게 되었는데 내가 회사에서 일할 때만큼 기획에 진지하지 않았구나 싶었다. 2차 구현전에는 최대한 아이디어를 짜내어서 다들 납득할 만한 괜찮은 기획을 잡아 진행해보고 싶다.

2차구현 때도, 그리고 그 이후에도 우리 팀원들이랑은 꾸준히 연락하며 지내고 싶다. 가능하면 포트폴리오도 계속 같이 만들어가며 진짜 팀으로 유지하고 싶은데.... 과연 가능할까?..ㅎㅎㅎㅎ 아직은 알 수 없지만 2차 개발이 끝나고 나면 조금 더 윤곽이 잡히지 않을까 싶다.

너무 고생많았던 우리 캠핑팀!! campUs가 잘 되면 좋겠고, 팀원들의 취업도 원하는 곳으로 잘 되었으면 좋겠다.
길면 길고, 짧다면 짧은 기간이었지만 많이 정도 들고 재밌던 시간이었다.
체력적으로는 힘들었지만 정말 손에 꼽을 정도로 내 인생의 보람있고 행복했던 시간을 보내게되어 포트폴리오반에 신청하길 참 잘했다는 생각이 든다.