프로젝트 Recipe 101 회고

Gong Intaek·2021년 6월 9일
0

코드스테이츠

목록 보기
147/151
post-thumbnail

프로젝트가 마무리 된 시점에서 프로젝트가 진행되었던 것을 시간순으로 되집어 보려고 한다.

1주차

4월 26일 프로젝트의 시작 일자이다. 이날 프로젝트를 위해 팀 Recipe Seeker가 결성 되었으며,
프로젝트의 마무리까지 Recipe 101의 완성을 위해 달려나가게 되었다.

시작일자부터 일주일간 우리는 SR에 집중 하였다. 어찌저찌 팀장으로 선출되고 어떤 것을 어떻게 만들 것인지 아이디어를 나누었으나 처음의 아이디어 회의에서는 그다지 좋은 결과를 볼수 없었다. 한때는 그저 주장해본 관측 보조 용도겸 소통 창고로서의 아이디어가 주목을 받기도 하였으나 제작의 난이도도 그렇지만 사용하게되는 유저층의 애매함에 많은 걱정을 하였다. 그러다가 이전 프로젝트였던 퍼스트 프로젝트의 아이디어를 차용 해오기로 하였다.

그때부터 나름 빠르게 진전 되기 시작하였다. 어떤 구조를 가질 것이고 어떤 기능들이 필요할 것이고 기능의 기반도 퍼스트를 참고 해서인지 그것과 유사한방향으로 진행되기 시작하였다. 그래서 해당 프로젝트때에서는 달성치 못한 것들을 이것저것 추가 하기 시작하였고 다음과 같이 정리할 수 있었다.

프로젝트 요구사항

Bare minimum requirements

Features

  • 로그인 기능 (로그인, 로그아웃, 회원 가입 , 탈퇴 )
  • 유저 정보 기능 (정보 요청, 정보 수정)
  • 검색 기능 (레시피 이름, 작성자, 재료 명으로 검색 가능하고, 재료 명의 경우 여러 개의 재료 명으로도 검색 가능 )
  • 레시피 창고 기능 (레시피 저장, 확인, 제거 기능) : 일종의 즐겨 찾기 목록과 같은 기능
  • 레시피 리뷰 및 평점 (리뷰 및 평점 추가 , 삭제)
  • 레시피 기능(추가, 확인, 제거)
  • 이미지 업로드 (레시피 추가시 요리이미지를 업로드함 )
  • 유저 구독(구독한 유저 확인 기능, 구독 추가 , 구독 취소)

Advanced

Features

  • 레시피 정렬 (이름, 평점, 작성된 시간 등 검색된 레시피 정렬 기능 )
  • 친구 추가, 삭제 기능
  • 유저 간 메세지 전송
  • 게시판
  • 앱 구조에 적합한 반응형 구성

Nightmare

Features

  • 유저 레벨링 시스템

    • 활동에 따라 경험치 획득
    • 레벨에 따라 사용 가능한 아이콘이나 꾸미기 용 소품 개방
  • 채팅 공간

    • 개인 채팅
    • 채팅 방

프론트 워크플로우

백엔드 워크플로우

DB 스키마

API 문서 링크

이렇게 대략적인 구도가 잡히었고 본격적인 잡업을 나누기전에 프로젝트내에서 사용하려는 스택을 다음과 같이 정리하였다.

영역의 배분은 나를 제외한 분들은 프론트를 진행하였고 나는 백엔드로 진행하였다.

지금와서 이야기하지만 이때의 SR이 미숙하게 진행된 것을 뒤에서 여실히 깨달을수 있었다.

2주차

각 영역 대로 작업을 진행하기로 하였다. 프론트 분들은 전체 영역을 삼분할하여 영역을 배분 하셨으며, 나는 우선 서버의 얼개를 잡고나서 데이터 베이스의 기초를 잡고 자료를 이송하였다. 그리고나서 API문서에서 배분된 것처럼 서버의 사용 목적에 따라 배분된 주소에 따라 단계마다 작업을 수행하였다. 따라서 기본틀을 유지하면서 부분 부분 기능 구현이 가능하였다.

프론트의 방향은 각자 완성하고 나서 합치신다 였으므로 큰틀에서만 작업을 공유하고 개별 작업을 진행하는 방향으로 작업이 지속 되었다. 하루하루 기능들을 완성해가며 서버를 정상화 시키려고 노력 하였다. 그리고 우선 기본적인 배포도 진행하여 그때그때 완성된 기능은 사용 해볼수 있게 진행하였다. 그렇게 2주차가 끝날 무렵 나는 요구사항의 베어미니엄에 해당하는 분량의 백엔드 작업을 마무리 할수가 있었다.

3주차

그렇게 내 작업을 마무리하고 프론트의 작업상황을 확인하였다. 하지만 생각 이상으로 완성도가 부족한 상태. 솔직히 이대로 쭈욱 진행하면 마무리까지 가능할까 의문이 들었다. 무엇보다 문제는 프론트는 각자 작업 하고 있고 css 적인 부분까지 완성 되는것이 아니었다는 것, 따라서 빠르게 완성하고 합치는동안 생기는 문제를 조율할 시간, css를 꾸미는 시간 그리고 문제점을 보완하는 시간이 필요한데, 개별적인 완성이 이르게 되지 않는다면 뒤에 진행할 시간을 확보 하지 못할수도 있겠다는 생각이 들었다.

진행속도가 적당했다면 좀더 깊게 들어가거나 전체적으로 보완을 시도 하는 시간이 있었겠지만 현재상태로는 그조차도 사치, 프론트 업무에 끼어들기 시작하였다. 그로 인해 초기에는 계획에도 없던 스타일드 컴포넌트가 프로젝트에 끼어들게 되었다.(그래서 프론트분들은 생각지도 않던 스택하나를 배우게 되신점에는 깊은 사과를...) 우선 개별 작성하던 것은 그대로 유지한채 클라이언트의 프레임 워크를 짜기 시작하였다. 깊게 공부 해본적이 없는(퍼스트에서는 순전히 백엔드만 집중한 편이었다.) react-router-dom 을 사용하여 시행착오를 겪어 가면서 클라이언트의 프레임을 구축하기 시작 하였다.

주 페이지별로 라우팅되는 주소를 제공하고 메인페이지 내에 래딩페이지와 서치 결과 페이지를 구분하여 전환되게 제작하고 라우터로 로그인이 모달처럼 나타나게 구성하고 외부 요소가 동작되지 않게 css 적인 방식으로 모달을 완성 하였다. 그리고 나머지 페이지들이 연결될 구조 배분을 진행하였고 현재 작업을 맡고 있는 랜딩페이지의 세부요소나 마이페이지의 경우는 연결되는 부분만 남기고 나머지부분의 기본적인 기능들을 구현 하기 시작하였다.

검색 , 검색 결과, 추가레시피 작성등 기본적으로 가동 가능한 뼈대를 완성하였다. 또한 자룐 전송이 훅스만으로 유지하기는 버겁다고 판단 프레임 구축 초반에 react-redux를 적용 리듀서로 로그인 정보와 토큰을 사용 하는것부터 시작하여 여러 부분에서 리듀서로 자료를 전송하기 시작하였다. 특히 검색 부분에서 검색 결과가 페이징 방식으로 전환됨에 따라 리듀서로 자료를 전송 하는 방식이 매우 유익함을 증명하게 되었다. 그리고 이 모든 작업을 진행하면서 서버 구축에서는 느끼김 힘들었던 타입스크립트만의 이점과 강점을 확인하는 시간이 되었다. 그리고 제작된 프레임은 서버와 함께 배포 된상태로 테스트를 해볼수 있게끔 구성하였다.

4주차

비록 완성되지는 못했지만 이후 작업은 통합 시키고 진행하는 것이 나을거라 생각 각자 현재 진행된 것을 받아서 작성했던 프레임에 합치는 과정을 거치고 그렇게 합쳐진 것을 다시 배분하여 css 적인 작업을 진행하게 하였으며 그동안 나는 아직 기능하지 못하는 부분을 가동가능하게 구성하며 서버의 유지보수를 병행해 나갔다. 프론트의 요청에 따라 기능에 적용 방향성이 달라지면 그에 대한 보강을 진행하였으며 완성된 기능을 테스트 해보면서 서버와 클라이언트의 조율도 같이 진행하였다. 하지만 여전히 진행속도가 나지 않는 편이었기에 우리는 반응형으로 완성되는 그런 편의성은 꿈꿀수가 없었다.

그렇게 마지막까지의 길은 끝의 끝의 끝까지 보가하고 작업하는 과저을 거치게 되었다. 결과물의 랜딩페이지와 검색 기능만 아래에 첨부 하였다.

메인 페이지

검색

Recipe 101 링크

마치고

아쉽다. 많이 아쉽다. 계획대로 진행된 것이 하나도 없는 터라 본래 업무에 집중할수 없었다는 것이 단순히 기능구현으로끝내는 것이 아니라 개선점을 찾아 개선 해보고, 계회겡 잡힌것처럼 더많은 기능을 구현 해보는 기회를 잡지 못했다는 것이 아쉽다. 물론 프론트 업무의 일부를 담당하였기에 그에대한 경험을 가진 점은 나쁘지는 않으나 프로젝트를 진행하는 입장에서는 마냥 좋은 일만은 아니라고 생각한다.

또한 팀장이라는 직책이 버거웠는지도 모르겠다. 시작 초기에는 백에서 주어진 업무만 충실하게 하는 방향을 생각하고 있었는데, 어느 순간 백, 프론트 상관없이 다 내손에서 제작 되는 있는 순간이 어떤의미에서는 허탈하기도 했다. 제대로된 결과물을 낼수 없을 지도 모르겠다는 생각이 크게 들어서 인지도 모르겠다. 한편으로는 그냥 백만 했으면 이마저라도 만들수 있었을까 라는 생각도 들고. 뭐가참 씁쓸한거 같다.

여하튼 아쉬움이 많기에 혼자서라도 이 프로젝트는 재구성을 실시해볼 예정이다. 구매한 도메인에 새로운 주소를 만들어서 두번째 클라이언트를 제작함과 동시에 현재 서버를 좀더 개선하는 방향으로 차근차근 리팩토링을 진행하면서 프로젝트내에서 사용한 스택을 다시금 공부해보는 시간을 가지려 한다.

profile
개발자가 되기위해 공부중

0개의 댓글