2차 프로젝트 후기(#METABOX👏)

1. 팀 구성 및 사이트 확정(METABOX👏)

메가박스 홈페이지를 모티브로 한 사이트로, 사이트에 접속한 모든 유저들은 상영중인 영화리스트와 각 영화에 대한 사용자들의 포스트를 볼 수 있습니다. 메타박스 회원은 예매를 할 수 있으며, 관람한 영화에 대해서 포스트를 작성할 수 있습니다.

(1) 팀 구성
Front-End : 김영현, 김동준, 이송현
Back-End : 송치헌, 윤현묵, 주종민

(2) 작업 기간
21.09.13 ~ 21.10.01

(3) 기술 스택
Front-end : HTML, styled-compnents, javascript, react
Back-end : Python, Django, MySQL

(4) 협업도구
-. slack
-. Git & Github
-. Trello
-. Postman

(5) 주요 구현사항

FrontEnd 구현기능
김영현님

• [MoviePost] : pagination, 무비포스트 상세 modal
• [MoviePostWrite], 이미지 파일을 포함한 포스트 작성, 50자 이내 제한
• [Modal] : 로그인/회원가입, 소셜 로그인/회원가입
• [Footer]
• 로고 디자인

김동준님

• [Nav] : 기본 라우팅, 사이트맵, 검색 창 클릭 이벤트
• [Main] : 영화 리스트 pagination / 정렬 (평점/개봉일/보고싶어요)
• [Details] : radar, block, line 그래프를 이용하여 영화 주요 정보 표현
• Libraries : chart.js

이송현님

• [Booking]
• 예매 화면의 상단 캘린더 로직
• 달력 아이콘 클릭 시, 테이블 형태의 캘린더 fold/unfold 로직 구현
• 메가박스의 빠른 예매 기본 프로세스와 동일한 로직 구현
• Libraries : date-fns, React Date Picker

BackEnd 구현기능
윤현묵님

• [Movie]
  -. 영화 목록 조회 기능 구현
  -. Pagenation
  -. 영화 상세 정보 조회 기능 구현
  -. 영화 찜 기능(좋아요 기능)
  -. 영화 목록 정렬 및 검색 기능 구현(최신 순, 평점 순, 좋아요 순 등)
• [DB Upload]
  -. CSV 파일을 이용한 Script DB Uploader 기능 구현

주종민님

• [User]
  -. [Sign up] : METABOX 회원가입 기능 구현
  -. [Sign in] : 일반 로그인 기능
  -. [Social log in] : 소셜 로그인(카카오 로그인) 기능 구현
  -. [JWT] : Json Web Token 발급 및 토큰 만료 기능 구현

송치헌님

• [Booking]
  -. 상영 날짜, 영화, 영화관 별로 상영 시간을 필터링하는 기능 구현
  -. 좌석 설정 기능 구현
  -. 예매 내역 조회 기능 구현
• [Authorization]
  -. python decorator를 이용한 인가 기능 구현(로그인 데코레이터)

공통 구현기능

• [MoviePost](영화 리뷰)
  -. 리뷰 작성 기능 구현(인가된 유저만 작성 가능)
  -. 모든 리뷰 조회 기능 구현
  -. 리뷰 정렬 기능 구현(최신 순, 공감 순)
  -. Pagenation

(6) 프로젝트에 대한 걱정과 기대
1차 프로젝트를 마치고 실력이 조금 향상되었다고 생각하였고, 열심히 하면 더욱 성장할 것이라는 기대감으로 2차 프로젝트를 시작하였습니다. 하지만 1차 때와 같이 걱정도 되었고 기대도 되었습니다.

걱정
1차 프로젝트보다 어려워진 사이트(기능의 복잡도 등)
처음 같이 작업을 진행하는 팀원들(소통, 서로간의 이해 부족 등)

기대
안해본 기능을 공부할 수 있는 기회
새로운 팀원과 작업할 수 있는 좋은 기회

2. 초기 어려웠던 점

1차 프로젝트와 다른 유형의 사이트라 모델링에 대한 어려움으로 초기 모델링 이후 계속해서 모델링이 수정되었습니다. (데이터 추가/수정 및 데이터 유형 수정/추가 등)
Unit Test가 추가되어 초반에 어떤 식으로 작성하는 지 몰라서 힘들었습니다...😭

3. 진행 과정(1주차)

영화 상세 정보 조회 기능

1주차에서 저는 영화 상세 정보 조회 기능을 담당하였습니다. 전체적인 정보를 전달해주는 기능이기 때문에 기능에 있어서 큰 어려움은 없었습니다. 하지만 처음 해보는 Unit Test를 진행하는 것이 어려웠습니다. 공부도 하고, 예제 파일을 따라하며 저의 코드 중 예외처리를 일부 추가하여 기능을 구현하였습니다.

4. 진행 과정(2주차)

영화 목록 조회 기능 구현(페이지네이션, 정렬, 검색, 찜(좋아요) 기능)
DB 업로드

2주차에는 메인페이지에서 영화 목록을 조회하는 기능을 구현하였습니다.
영화 목록이 4개씩 보여지고, 더 보기버튼을 누르면 4개씩 추가적으로 보여지는 기능, 그리고 영화 개봉일순, 평점순, 좋아요순으로 정렬하는 기능, 영화이름 검색 기능이 포함되어있는 기능이었습니다. 처음해보는 기능이었지만 order_by 공부도 하고, 페이지네이션의 로직도 알 수 있어서 좋았습니다. 또한 DB를 한번에 업로드할 수 있도록 db_uploader.py를 작성하였는데, 1차 때도 안해본 기능이어서 새로 공부할 수 있었습니다.

5. 프로젝트 결과 페이지

6. 좋았던 점(+배운점)

저희팀은 일부러 서로 안해본 기능을 담당하여 공부할 수 있도록 하였습니다. 그래서 더 많은 공부를 할 수 있었고, 성장한 느낌을 받았습니다. :)
또한 모르는 부분이 생기면 즉각 소통을 하여 서로 가르쳐주며 같이 공부하는 분위기가 형성이 되어 좋았습니다. 그리고 팀원들 모두 항상 늦게까지 공부하며 기능을 구현하기 위해 노력하는 모습을 보여주어서 너무 좋았습니다.

배운점
어떤 방식으로 공부를 하며 기능을 구현해야 하는 지 (from 치헌님)
다른사람들과 소통하며 부족한 부분에 대한 학습 방법 (from 종민님)
상호간의 소통을 통해 서로 맞춰보고 수정하는 협업 방식 (from 영현님, 송현님, 동준님)
이제 진행할 기업협업에서도 배운점을 바탕으로 많은 것을 배워 성장하고 싶습니다.

7. 아쉬웠던 점

프로젝트 중간에 서로 소통한 부분에 대한 이해가 조금 부족하여 통신이 원활하지 않았던 점이 조금 아쉬웠습니다. 페이지를 어떤식으로 수정할 지에 대한 내용, 페이지 구성에 대한 내용 등 백엔드-프론트엔드와의 소통이 조금 부족하여 최종 구현이 지연된 점이 조금 아쉬웠습니다. 하지만 끝까지 잘 해결하여 무사히 페이지를 완성한 것에서 만족할 수 있었습니다. 또한 이런 부족한 부분을 바탕으로 향후 프로젝트를 진행할 때는 좋은 방향으로 진행할 수 있겠다는 생각 등 많은 것을 배울 수 있었습니다.