View

반응형

PliP 메인 화면

프로젝트 회고

 7월 29일 데모데이를 끝으로 부트캠프의 꽃인 메인프로젝트가 끝이 났습니다. 2월부터 시작해 길게만 느껴졌었던 6개월의 부트캠프 과정도 곧 수료하네요. 많은 것을 배웠고 좋은 사람들을 만나 새로운 인연도 생기고 함께 재밌는 시간도 보내며 2023년 상반기는 많은 추억을 남기고 가네요.

 

이번 포스팅에서는 메인 프로젝트에 대한 회고를 해볼까해요. 저는 이번 프로젝트에서 프론트엔드 팀 리더이자 부팀장을 맡았었는데요, 부트캠프에서 팀을 결정하는 방식이 크게 2가지가 있는데, 한 팀당 최대 6명 최소 4명씩 팀을 구성하며, 사전에 미리 팀을 구성하거나, 주어진 팀 빌딩 시간이 따로 있는데 해당 시간에 팀을 구성하는 방법이 있었어요. 팀 빌딩 시간에서 조차 팀을 구성하지 못하였다면 랜덤으로 인원이 부족한 팀에 배정되었습니다.

 

부트캠프 규칙 상 거의 6명으로 프론트 3명, 백엔드 3명 팀으로 구성했어야 했어요. 4명, 5명 팀은 정말 인원이 모자라서 어쩔 수 없이 구성된 팀이었어요. 저희 팀은 6명으로 사전에 미리 구성된 팀원들로 평소 부트캠프에서 수강생들끼리 따로 운영한 스터디나 부트캠프 내에서 열정적으로 참여하시는 분들을 기준으로 팀원들을 구성하였어요!

 

그래서인지 저희 프론트 팀원들 뿐만 아니라 백엔드 팀까지 정말 개개인이 책임감이 강하고 적극적으로 커뮤니케이션을 해주셔서 솔직히 팀장, 부팀장의 역할은 의미가 없었던 것 같아요. 정말 한명 한명이 전부 팀장이었어요. 영화 “어벤저스”에서 나오는 히어로들처럼 팀원 한 분 한 분이 고유한 개성을 지니셨고 맡은 역할은 끝까지 책임지고 완수하였습니다. 사실 저희 기획단계에서 부트캠프 내에서 저희 팀이 가장 최고다 라는 자부심이 있었습니다. 그래서 팀명이 코딩 + 어벤저스 합쳐서 코벤저스였어요…ㅎ_ㅎ

 

회고는 아래의 목차와 같은 순서로 진행해볼까합니다.

 

목차

  • 프로젝트 소개
  • 좋았던 점, 배웠던 점
  • 아쉬웠던 점
  • 마무리

프로젝트 소개

저희 팀의 프로젝트 주제는 여행 계획을 손쉽고 효율적으로 계획할 수 있게 도와주는 서비스를 기획해봤어요.

 

여러분들은 여행을 가실 때 어떻게 계획하시나요? 엑셀 혹은 노션 등과 같은 애플리케이션을 이용해 여행 계획을 작성하시나요? 또 다녀온 여행의 추억이 담긴 사진들이 날아가지 않게 백업해두시지는 않나요? 그리고 특정 여행지의 좋은 경험과 추억들을 오랫동안 기억하고 싶어 블로그와 같은 곳에서 기록을 남기기도 하죠.

 

이로써 우리는 여행 계획부터 사진 백업, 블로깅과 같은 작업을 하며 많은 시간을 투자합니다. 이러한 시간 비용을 한 번에 줄일 수 있다면 얼마나 좋을까요?

 

저희는 이런 고민을 해결하고자 PliP(Plan your TriP)이라는 서비스를 기획했습니다! 저희 PliP은 여행 일정 계획부터 방문한 장소 혹은 방문 예정인 장소에 대해 ‘일지’라는 기록을 남길 수 있습니다.

 

더 나아가 서비스의 확장을 고려해 좋아요, 팔로워, 팔로잉 등과 같은 SNS적인 기능들을 추가해 여행이라는 카테고리에 집중하는 SNS 서비스까지 생각하고 있었어요! 비록 지금은 3주라는 짧은 기간동안 SNS 요소들이 전혀 포함되어 있지 않으며 회원 가입, 여행 일정 계획, 일정에 대한 일지 기록 정도의 최소 기능만 제공하고 있습니다.

 

저희 팀원들은 전반적으로 분위기가 정말 좋았고, 개개인의 정성과 들인 노력이 있어서 그런지 메인 프로젝트가 끝났음에도 불구하고 추가적으로 개선해 나가고 싶어했으며 코드 리팩토링은 당연하며 초기 기획이었던 SNS 서비스 확장까지 고려하고 있습니다.

 

아이디어가 정해지고 기획을 하면서 크게 회원(로그인, 회원가입), 여행 일정, 여행 일지 이렇게 3가지의 카테고리로 나눌 수 있더라고요! 그래서 각각 하나의 카테고리를 맡아 개발하였습니다. 저는 여행 일지 부분을 맡게 되었어요!

 

저희 프론트의 프로젝트 스택은 다음과 같아요.

 

좋았던 점, 배웠던 점

  • 팀원들로부터 많은 것을 배울 수 있어서 정말 좋았어요!
    • 회원 부분을 맡은 팀원분이 정말 잘하시는 분이세요. 코딩 실력도 실력이지만 탐구심과 호기심이 정말 엄청나신 분입니다. 덕분에 react-hook-form, zod라는 유효성 검사 라이브러리에 대해 알게 되었어요. 그리고 로그인 관련 구현하는 부분에서 프론트에서 할 수 있는 보안에 대해 무척 신경쓰셨어요, 엑세스, 리프레쉬 토큰을 로컬 스토리지에 저장하지 않고 HTTP Only 쿠키에 담아 로그인을 구현하는 시도를 하셨어요. 거의 프로젝트 기간 내내 붙들고 계셨던 것 같아요. 로그인 구현이 정말 중요한 부분이잖아요. 그러면서도 정답이 없는 것 같아요. 어떻게 구현해야 될지를 프론트에서만의 고민이 아니라 백엔드와의 소통이 정말 많이 필요하다는 것을 느꼈어요. 또 타입스크립트에 대해 어느 정도 지식을 가지고 있어서 작성한 코드를 보면서 정말 많이 배웠어요.
  • 써보지 못한 프레임워크와 라이브러리들을 시도해봤어요!
    • 타입스크립트를 어느 정도 기초적인 지식만 알고 있었지, 제대로 써본적이 없었던 것 같아요. 그래서 이번 메인 프로젝트를 통해 제대로 써보았어요! 처음에 타입스크립트에 익숙하지 않아서 개발하는 시간이 정말 느렸어요… 특히 DOM 요소, 이벤트, 리액트의 Ref 타입을 주는 것이 굉장히 어려웠어요. 차츰 익숙해지니 타입스크립트의 장점들이 보이기 시작하더라고요. 다른 팀원이 api 속성들을 미리 타입으로 정의해 두셔서 제가 관련 api를 사용할 때 백엔드 명세를 볼 필요 없이 바로 코드 상에서 확인할 수 있어서 정말 좋았어요. 이래서 타입스크립트가 협업에서 유용한가봐요.
    • 그 외 react-query와 axios에 대해 조금 더 깊게 공부하게 되었어요. 아직 조금 더 공부를 해야될 필요성이 있지만 리액트 쿼리의 캐싱 기능과 axios의 인터셉터에 대해 새롭게 알게 되었어요.
  • 기획의 중요성을 알게 되었어요.
    • 프로젝트의 주제가 정해지고 주제에 대해 기획을 할 때 아무 백지 상태에서 떠오르는 기능들을 막 나열하며 요구사항와 기능 명세서를 작성했던 것 같아요. 그러다가 문득 사용자 입장에서 서비스를 이용할 때 흐름(?)이 잘 그려지지 않았어요. 그래서 저는 피그마를 키고 어느 정도 완성된 화면을 그려보자고 팀원들에게 제안했어요. 그렇게 화면을 디자인을 하게 되었고 여기서 저희 프론트 팀의 홍일점인 여행 일정 개발 부분을 맡은 팀원분이 거의 하드 캐리해주셨어요. 그렇게 완성된 피그마의 디자인을 바탕으로 다시 요구 사항과 기능 명세서를 작성하니 확실히 어떤 페이지 어떤 기능이 들어가야 되는지 명확하게 파악이 되어서 정말 좋았어요. 백엔드 분들도 API 명세를 작성할 때 피그마의 디자인을 많이 참고하셨다고 하더라고요. 실제로 디자인이 어느 정도 완성되고 서비스의 흐름이 파악되니까 정말 좋았던 것 같았어요.
    • 그만큼 화면을 디자인하는데 투자한 시간이 많았어요. 총 프로젝트 기간 3주 중 거의 1주를 기획을 하는데 사용했어요. 하지만 투자한 시간이 전혀 아깝지 않았어요. 화면이 잘 디자인되어 있으니 UI를 코드 상으로 작성할 때도 그냥 똑같이 만들면 되니까 오히려 편했어요. 더군다나 공통적으로 사용될 컴포넌트를 미리 정의하고 가니까 UI가 일관성 있게 짜여지는 것도 정말 좋았어요! 솔직히 이번 메인프로젝트의 최소 기능 구현 사항까지 마무리를 할 수 있었던 가장 큰 핵심은 아마 기획에 많은 시간을 투자해서 만든 잘 기획된 요구사항, 기능 명세서, 피그마 화면 디자인이라고 생각합니다!
    • 저희 피그마 페이지에요! > 피그마 페이지
  • 도와줘요. 팀원들!
    • 이번 프로젝트를 하면서 집단 지성의 힘은 정말 대단하다는 것을 느꼈어요…! 저희 팀원들은 저를 포함해서 모두 어떤 어려움을 만났을 때 끝까지 고민하고 최대한 혼자서 해결하시는 성향이 강했어요. 그러다가 끝내 혼자 해결하기 힘들면 디스코드로 호출하면 언제든지 달려와주셔서 함께 고민해주세요. 보통 이 과정에서 모든 고민들이 해결되었어요. 간혹 3명의 두뇌를 합쳐도 안되었을 때는 멘토님에게 질문을 남겼어요. 아 그리고 팀원의 추천으로 비주얼 코드에서 “Live Share”라는 익스텐션을 적극 활용했어요. “Live Share”를 실행시키고 주소가 주어지는데 해당 주소를 팀원들에게 공유를 하면 링크를 타고 팀원들이 들어와 나의 비주얼코드에서 코드를 직접 작성하며 협업할 수 있어서 너무 신기했고 이렇게 고민이 생기는 경우 정말 유용하게 사용했어요!
  • 커뮤니케이션의 중요성
    • 커뮤니케이션이 정말 중요하다는 것을 알고 있었지만 이번 프로젝트를 통해서 다시 한 번 중요성을 느끼게 되었어요. 개발을 하며 백엔드 명세 부분에서 의문이 들거나 혹은 서버에서 받아오는 데이터의 수정이 필요할 때 적극적으로 백엔드 분들을 호출해서 논의했어요. 특히 제가 맡았던 작업이 백엔드 팀장님이 맡았던 부분과 의존성이 많은 부분이라 백엔드 팀장님과 정말 많은 커뮤니케이션을 진행했고 더욱 친해지게 되었어요. 그래서 디스코드에 “모각코”라는 음성 채널을 하나 만들어서 거의 둘이 살다시피 상주해 있었어요. 평소에는 그냥 이런 저런 이야기 하다가 개발하다가 문제 터지면 바로 피드백을 주셔서 정말 편안했어요. 이처럼 백엔드와 프론트가 같은 공간에서 함께 작업이 이루어진다면 더욱 좋은 시너지를 낼 수 있다는 것을 느꼈어요.
  • 부트캠프 기간 중 가장 유익한 시간 멘토링
    • 6개월의 기나긴 부트캠프 기간 중 가장 유익한 시간이 무엇이냐고 묻는다면 메인 프로젝트를 하면서 가졌던 멘토링 시간이라고 할 수 있을 것 같아요. 부트캠프에서 프론트 멘토 1분, 백엔드 멘토 1분 팀당 2명의 멘토분이 총 4번의 멘토링을 진행해요. 저희 멘토님은 정해진 4번의 시간 말고도 개인적으로 헬스 체크 멘토링을 추가로 4번 진행해주셨어요. 그래서 저희는 총 8번의 멘토링을 받게되었어요. 멘토링을 진행하면서 평소 개발하며 궁금했던 점, 취업 준비, 실제 현업에서 어떻게 일을 하는지 등 궁금한 점이 많았는데 가려운 부분을 속 시원하게 긁어주셨어요! 마지막 멘토링 시간 때 멘토님께서 저희 팀에 대해 칭찬을 많이해주셔서 정말 좋았어요. 멘토님께서는 멘토링을 진행하면 항상 걱정되시는게 있으셨데요, 멘티들이 질문이 없으면 어떡하지, 질문이 없을 것에 대비해 멘티들에게 알려줄 내용들을 준비를 하신데요. 그럼에도 불구하고 정적이 흐르는 시간들이 항상 있었다고 합니다. 하지만 저희팀은 매번 질문이 끊이질 않았고, 따로 무언가 준비할 필요가 없어 편하셨다고 해요. 그리고 가끔 질문들 내용 중에 좋은 질문들이 많아서 멘티들에게서 배운 내용도 많았다고 하셨어요. 현재까지 맡았던 팀들 중 가장 잘했다고 하셨고 프로젝트 막바지에 접어들면 멘티들이 엄청 멘토님을 찾을 때가 많았다고 하는데, 저희 팀은 한 번도 멘토님에게 도움을 요청하지 않았었요. 저희 팀원들은 어려움을 만났을 때 최대한 고민하고 다함께 고민하니 대부분의 고민들이 해결되었어요. 그런 부분들이 멘토님으로부터 좋은 평가를 받았던 것 같아요.

아쉬웠던 점

  • 제가 투자했던 시간보다 아웃풋이 많이 없었던 것 같아요. 저는 여행 일지에 대한 CRUD 관련 UI 디자인과 기능 구현을 주로 맡았는데요. 다른 팀원들에 비해 투자한 시간들이 적지는 않았는데 뭔가 한게 없다고 느껴졌어요… 더욱 더 많은 시도를 해보지 못해 아쉬워요.
  • 미처 구현하지 못한 기능들이 남아있어요. 3주면 짧으면 짧고, 길면 정말 길다고 느낄 수 있을텐데 저한테는 3주는 정말 짧았어요. 그래도 최소 요구했던 기능까지 전부 구현할 수 있어서 다행이었어요. 하지만 구현하지 못한 기능들이 조금 남아있어 아쉬웠어요.

마무리

데모데이 때 여러 팀들의 결과물을 탐방하며 어떻게 구현했는지 궁금하거나, 발표를 보고 싶은 팀을 투표하는 시간이 있었어요. 저희팀은 2등과 3등을 다투다가 결국 3등을 했어요. 총 36팀 중에 3등이면 나쁘지 않은 결과라고 생각해요. 최종적으로 1, 2, 3등 팀이 발표하게 되었고, 하필 저희 팀장님께서 당일에 부재로 인해 제가 발표하게 되었어요. 지금 생각해도 심장이 바운스 바운스되네용…

 

그리고 신기하게 1, 2 등 팀의 팀장분들 이름 가운데에 ‘진’이 들어가요. 제 이름 가운데에도 ‘진’자가 들어가는데요, 부트캠프 기간 중에 1, 2등 팀장분들께서 부산에 놀려오신적이 있어 셋이서 이곳 저곳 당일치기로 놀았던 적이 있는데, 그때 삼진스라면서 막 저희들끼리 그랬단 말이에용? 그런 삼진스들이 1, 2, 3등으로 발표했던게 신기하더라고요…ㅎ

 

아무튼 이렇게 프로젝트 회고에 대해 마무리를 하며 다음 글부터는 메인 프로젝트를 진행하면서 만났던 고난과 시련들, 그리고 어떻게 그 시련들을 극복했는지에 대해 다뤄보려고 해요. 긴 글 읽어주셔서 정말 감사합니다!

 

아! 생각해보니 저희 팀 프로젝트를 안보여드렸네요! 저희 팀 배포 주소와 깃헙 링크입니다!

 

배포링크: https://plip.netlify.app/

깃헙링크: https://github.com/codestates-seb/seb44_main_012

반응형
Share Link
reply
«   2024/09   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30