[회고] 1차 프로젝트 - 인생 첫 프로젝트를 마치고

in Life on Life

프론트엔드 개발자의 길을 걷고 나서 맞닥드린 첫 프로젝트인 프릳츠컴퍼니(Fritz Company)
클론 코딩 아쉬운 점도 크고 부족한 점도 많은 개발자 인생 첫 프로젝트 회고를 해보고자 한다.

본 회고는 KPT 방법론 회고 방식에 따라 작성하였습니다.

과일쥬스 커머스 프로젝트

프릳츠카페
국내 커피 판매사이트 프릳츠 컴퍼니를 모티브

프로젝트 선정이유

  • 깔끔하고 심플한 사이트 UI
  • 시간이 많이 들어갈만한 디자인이 많지 않아 기능구현에 집중 가능
  • 프론트엔드 공부를 위한 필수적인 기능들이 있고 구현하기에 크게 어렵지 않음

개발 기간 및 인원

  • 개발 기간
    • 2022-03-28 ~ 2022-04-07 (약 2주)
  • 개발 인원
    • Front-end : 김동욱, 남용현(PM), 노영완
    • Back-end : 류미류, 한상안
  • 구현 항목
    • 회원가입 및 로그인
    • 로그인 여부에 따른 마이페이지 접근
    • 메인 이미지슬라이드, 드롭다운 메뉴
    • 상품 리스트, 상세페이지 (API)
    • 장바구니
  • 내가 구현한 부분
    • Navbar, Aside 메뉴
      • 토큰 유무에 따른 로그인/로그아웃 메뉴UI 설정
      • 트리구조의 드롭다운 메뉴
    • 로그인여부에 따른 페이지 접근 권한 설정
      • Context API 를 사용하여 페이지별 접근 권한 확인
    • 상품리스트, 상세페이지
      • 쿼리스트링 및 패스파라미터 이용 백엔드 서버와 통신
    • 장바구니 시스템
      • 쿼리스트링을 이용하여 장바구니 추가, 삭제
  • 기술 스택
    • Front-end : React.js, React-Router, SASS
    • Back-end : Python, Django, AWS
    • Tools : Git, Github, Slack, Trello
      -> 리팩토링 이후 Redux toolkit, TypeScript 추가

  • 현재는 백엔드 API 유실로 인해 모든 데이터를 MockData로 변경 하였습니다.

  • 영상 시연

  • AWS EC2 배포

  • Backend Github

Trello

트렐로 우리팀이 관리했던 트렐로

개발 방법론

  • Agile Scrum : 주별 Sprint Meeting, 일별 Standup Meeting
  • 추가 구현 제외 첫 목표율의 95% 완료
  • 따로 회의록을 두지않고 한눈에 볼 수 있도록 트렐로에 카드형식으로 작성

Fruitz Company GIF 시연

Fruitz

KPT

Keep

  • 라이브러리 사용이 제한된 상태에서도 좋은 결과를 만들어 낼 수 있었다는 것에 큰 성취감

  • 리액트에서 기본으로 제공하는 Context API 를 이용 전역 상태 관리
    • 로그인 상태에서 접속이 가능한 페이지를 LoginContext를 만들어
      회원권한이 필요한 페이지 컴포넌트에 간편하게 State 를 전달
    • 이번프로젝트는 실력 쌓기 일환으로 비교적 심플하고 규모가 작은 사이트였지만 추후에
      규모가 큰 프로젝트를 대비해 Redux 나 Recoil을 대신해 써볼 수 있어 좋았다.
  • 하루에 30분, 꼭 필요한 것들로 논의했던 미팅 방식
    • 우리팀은 하루에 한번 30분 이내로 고정적인 미팅을 가졌고, 꼭 필요하지 않으면 추가적인
      회의시간을 갖지 않았다.
    • 서로 동등한 위치에서 각자의 의견을 자유롭게 얘기했던 것이 좋았다.
  • 딱딱하지 않았던 분위기
    • 나름 팀 분위기는 좋았다고 생각한다. 왠만하면 점심, 저녁도 같이 먹으며 소통을 했다.

Problem

  • 렌더링 사이클의 이해도 부족(?)으로 일어난 이슈
    • Mock Data 혹은 백엔드 API Data 를 받아 해당 데이터의 값을 jsx로 전달
    • 한 두번 잘되다가도 대부분 페이지 렌더링이 안되고 오류가 발생하는 이슈가 많았다.
    • fetch 주소도 잘 되어있고 콘솔로 찍어봐도 데이터는 잘 들어 옴
    • 그러던중 콘솔상에서도 데이터가를 받는데 살짝 딜레이가 있는 것을 발견
    • useState 와 fetch 즉 비동기로 데이터를 받아옴에 있어 아직 데이터를
      완전히 불러오기도 전에 페이지 렌더링이 일어나면 오류가 나는것을 확인
    • 데이터가 없으면 해당 페이지를 렌더링 하지 말라는 예외처리를 해주니 이상없이 동작
    • 보통 다른 사이트들을 보면 자료를 불러올때 로딩같은것을 보여주곤 하는데,
      모두 이러한 이유때문에 이러한 예외처리를 하지 않았나 생각된다.
  • 계획 설정시 과다한 욕심
    • 초반부터 너무 큰 의욕에 넘쳐 목표 설정을 높게 잡았다.
    • 후에 추가 구현으로 미루었지만, 역시나 일정이 빠듯해 하지 못하였다.
  • 백엔드 팀원들과 초반 소통 부재

Try

  • 백엔드와의 소통은 필수! 그리고, 더 나은 협업 방식을 고안해보기
    • 첫 협업이다보니 방법을 잘 몰랐던거 같다. 백엔드와 프론트 서로의 영역이 다르다고 생각해
      기능 구현에 있어 페이지 제작에 대해서 서로 큰 얘기를 하지 않았다.
    • 시간이 지날 수록 각 분야별로 기능 구현의 방향성과 속도의 차이가 발생.
    • 프론트 쪽에서는 어느부분까지 구현할 것이고 그부분에 맞추어 하고있는데,
      백엔드는 저부분까지 할것이고 벌써 저만큼 나아갔다.
    • 다시금 소통의 중요성을 깨닫고 서로 세세히 맞추어 가며 각 페이지를 완성하였다.
  • 협업의 데이터 등은 문서로 남기기
    • 프론트와 백엔드의 소통을 하기위해 필요한것은 각 API 와 DB 들
    • 이것들을 초반에 문서화 한다면 모든 팀원들이 그때그때 필요한부분을 쉽게 참고 할 수 있다.
  • 슬랙 등 커뮤니케이션 툴도 잘 사용해야겠다.
    • 슬랙에서 소통 및 전달을 해도 잘 보지 않는 부분도 생겼다.
    • 중요한 것을 전달하면 고정이 되어 쉽게 되돌아 볼 수가 있는데 이것들을 잘 활용 해야겠다.

첫 프로젝트를 마치며

첫 프로젝트가 끝나고 팀원과 같이 식사를 하며 회고를 하면서도 아쉬운점이 너무 많았다.
PM을 맡은 나로서는 그만큼 더더욱 나 자신에 아쉬운 것이 많았다.

내가 못한점

첫 스프린트 미팅때 팀내 같은 프론트분과 어떻게 작업량을 분배할지가 나에겐 제일 큰 고민이었다.

각자 실력도 다르고 분명 팀원들도 하고싶은 기능 구현 들이 있을것이기에 나 자신을 내려놓고
팀원에게 하고싶은 부분이 있는지 먼저 물어보고 그 부분을 분배한 뒤 나는 자연스레 남는부분을
가져가게 되었다.

당시에는 그 방법이 좋을 것이라고 생각했지만, 전체적으로 넓게 보고 때에 맞는 업무 분담과
작업량 조절을 했어야 했다. 각자 의욕에 앞서 어려운부분부터 하다보니 어느 한 부분의 기능구현도
벅차고 좀처럼 속도가 나지 않았다.

결과적으로 봤을때 우리가 목표로 한 프로젝트의 계획은 달성하였지만, PM으로서는 과연 잘했을까?
라는 의문점을 남겼다.

괜히 내가 이렇게 저렇게 하자고 한다면 팀원들이 괜히 날 싫어하는 것이 아닌가?
라는 두려움도 있었던 것도 사실이다.

그리고 초반에 혼자 달리고 결과를 내기에 조급했었다. 아마 그런 나때문에 팀원들도 분명
영향이 있었을것이다. 2주차때에는 잘못된 것을 깨닫고 그러지 않았지만, 팀은 나 혼자가 아니란것을
알게되었다.

내가 잘한점

내가 맡은 기능구현 부분은 어떻게 해서라도 하겠다는 것과 PM 이라는 책임감이 있었다.
팀에게 불리한 상황이 있으면 PM으로서 해결하려고 Github PR 관련해서도 어필 하기도 했다.

그리고 분명 내가 하면 잘 할수 있고 돋보일 수도있는 부분이 있었지만, 욕심을 부리지 않고
팀원들에게 기회를 주려고 항상 먼저 권하고 의사를 물어보며 노력했다.

회의때 분위기를 위해 간식과 커피를 사간적이 있는데 정말 너무나 좋아하셨다.
이럴줄 알았으면 자주 사갈껄 했다.

마무리

앞으로 어떤 개발자가 되어야할지 나 스스로의 생각을 많이 하게 되었고,
개발에 대한 재미를 더더욱 느끼게 한 프로젝트였다.

각자 1인분을 해야하는 팀이 아닌 팀원 전체가 모여서 1인분이 되는 것
바로 ‘팀’ 이라는 것도 무엇인지 알게 되었다.

고맙게도 첫 프로젝트에서 PM 을 맡게되면서 내가 성장하기 위한 큰 경험이 되었고,
팀원들에겐 PM 보다는 좋은 팀원이었다는 것이 남았으면 좋겠다는 생각도 한다.

거칠게 달려왔던 2주였지만, 너무 재미있었고 이러한 팀을 다시 또 만날수 있을까?

발표를 할때도 마지막 부분에 회고부분에서 갑자기 울컥해서 하고싶었던 얘기도 못한 채
급히 마무리 했고, 회식때도 뭐랄까.. 기분이 이상했다.


presentaion 발표했을때 썼던 노션 자료 그래도 다들 잘했다고 해줘서 뿌듯했다.


team
이번 프로젝트를 같이 했던 천지창조 팀

초반부터 큰 열정으로 시작했던 우리팀 '천지창조'
백엔드와 프론트엔드의 만남이라고 해서 정했던 팀명. 팀명을 정할때가 엊그제 같은데
벌써 시간이 2주가 훌쩍 지나 이제 헤어지게 되었지만 잊지 못할 것 같다.

팀원 분들 덕분에 개발자라는 것에 큰 한걸음을 내딛고 방향성을 알게 되었다.

기능구현의 문제가 아니라 서로를 믿고 사소한 의견충돌이나 잡음 하나 없이
짧은 2주의 시간동안 이 모든것을 다 해내서 너무 대단하다고 느꼈다.

수시로 서버 열어 달라고 하고, 맨날 key 값이 무엇이냐고 물어봐도
불평이 없으셨던 백엔드의 미류님, 상안님.

저 스스로의 압박감과 조급함에 옆에서 같이 분위기에 짓눌려 힘들어 하셨을
프론트의 영완님, 동욱님.

서로 서로 많이 의지가되고 많이 가르쳐주고 희생해주셔서 너무너무 감사하게 생각합니다.
우리 모두 훌륭한 개발자고 될 것이고 어디 가서도 잘 하실거라 믿어 의심치 않습니다.

추가로 정신이 번쩍 들게 했던 멘토님의 PR 코멘트

pr

© 2022.02 by sunnyfterrain