왓챠피디아를 레퍼런스로 하여 클론 코딩하기. 간단히 말해서 컨텐츠의 범위를 디즈니 플러스에서 이용할 수 있는 컨텐츠로만 축소한 버전이라고 생각하면 되겠다.
실제 구현 페이지 >> 디즈니 피디아
(현재 회원가입은 막아놓은 상태. ID/PW : boochoo로 로그인하여 조회만 가능)
깃허브 >> 깃허브
프로젝트 개요
🛠️ 개발 환경
- Tool : eGov Spring Framework
- DBMS : Oracle 11g
- Server : Apache Tomcat v9.0
- Language : JAVA / SQL / JSP / jQuery / JavaScript / HTML / CSS
🔥 프로젝트 진행
- 진행 기간 : 2022/03/15 ~ 2022/04/11
- 2022/03/15 ~ 2022/03/18 : 주제 선정 및 테이블 설계, Git Hub 연동
- 2022/03/19 ~ 2022/04/03 : 기능 및 화면 구현
- 2022/04/04 ~ 2022/04/10 : 오류 수정, UI 정리, 발표 준비
- 2022/04/11 : 발표
🎥 왓챠피디아 클론 기능
- '디즈니 플러스'에서 제공하는 컨텐츠의 정보를 확인할 수 있습니다.
- 해당 컨텐츠에 평점과 코멘트를 작성할 수 있습니다.
- 다른 사람들이 작성한 평점과 코멘트를 열람할 수 있습니다.
- 다른 사람들이 작성한 코멘트에 좋아요를 할 수 있습니다.
- 보고싶어요와 평점, 코멘트 기능을 통해 내가 아직 시청하지 못한 컨텐츠와 이미 시청한 컨텐츠를 구분하여 확인할 수 있습니다.
- 프로필에서 내 정보 및 타유저 정보를 확인할 수 있습니다.
🆕 새롭게 추가된 기능
- 캘린더 기능을 통해 언제 해당 컨텐츠를 시청했는지 확인할 수 있습니다.
- 채팅 기능을 통해 디즈니 플러스를 같이 이용할 사람들을 모집할 수 있습니다.
- 내가 작성한 코멘트 뿐만 아니라 타유저가 작성한 코멘트 및 타유저가 좋아한 코멘트를 열람할 수 있습니다.
🌿 내가 구현한 기능
프론트 엔드
거의 모든 페이지 프론트 엔드 제작 및 수정에 참여했기 때문에.. 처음부터 끝까지 담당했던 페이지는 아래와 같다.
✔️ 헤더, 푸터, 메인, 검색, 컨텐츠 디테일 페이지
로그인, 로그아웃
✔️ 로그인 시 해당 페이지에 머물 수 있도록 설정
✔️ 로그아웃 시 페이지별로 리다이렉트 페이지 별도 설정
메인 페이지
✔️ TMDB API를 활용하여 컨텐츠 정보 출력
✔️ 컨텐츠 타입, 평균 평점, 코멘트 수(자체 DB 활용) 등의 기준으로 데이터 필터링
✔️ 버튼으로 조작하는 횡스크롤
검색 페이지
✔️ 데이터 필터링
✔️ 검색 카테고리 별로 다른 화면 출력
컨텐츠 상세 페이지
✔️ 컨텐츠 정보 출력
✔️ 보고싶어요 기능
✔️ 캘린더 기능
✔️ light box 플러그인을 활용한 이미지 캐러셀 팝업기능
✔️ 코멘트 좋아요 기능
코멘트 상세 페이지
✔️ 컨텐츠 정보 및 코멘트 정보 출력
✔️ 코멘트 좋아요 및 댓글 기능
채팅 페이지
✔️ ajax로 구현한 채팅 메시지 입출력 기능
✔️ ajax로 구현한 모집현황 변경 기능
마이 페이지
✔️ 내 프로필 및 타유저 프로필 열람 기능
✔️ 캘린더 기능
✔️ 마이 컨텐츠 조회 기능(보고싶어요 및 평가)
✔️ 내가 작성한 코멘트 조회 및 수정,삭제 기능
✔️ 내가 좋아한 코멘트 조회 및 좋아요 취소 기능
이 외에도 전반적으로 자잘한 기능 구현 및 오류 수정 담당..
💪 후기 및 소감
- 소통, 소통, 소통.. 프로젝트 초반 제일 힘들었던건 파이널때 갑자기 변경된 팀이었다. 두번의 프로젝트 동안 맞춰온 팀워크가 있었는데 이제와서 새롭게 합을 맞추려니 조금 어려움이 있었다.
- 빠른 상황 판단과 과감한 포기의 중요성 내가 얼마나 이 기능을 구현하기 위해 많은 시간과 노력을 쏟았는지와는 별개로 프로젝트의 진행과 완성을 위해서 과감히 포기할 줄도 알아야 한다는 점을 다시한번 느꼈다. 이를 위해서는 제대로 된 상황 판단이 받쳐줘야 가능하겠지. 본인이 판단이 서지 않는다면 다른 사람에게 도움을 청해서라도 판단을 내려야 할 필요가 있다.
- 기능 구현 관련 개념조차 모호했던 '데이터 분석', '데이터베이스 모델링'의 중요성
각자가 그동안 배우고 해왔던 프로젝트의 방향과 방법이 다르다보니 처음에 이를 서로 공유하고 의견을 합치하는 데에도 꽤나 시간이 걸렸다.
큰 틀이든 세세한 부분이든 뭐든 확실히 정하고 진행해야 하는 나와, 일단 진행 먼저 하고 세세한 부분은 담당자가 알아서 하자는 다른 조원들간의 의견 불합치.. 다행히 팀원들이 내 의견을 따라줘서 적어도 '나'는 만족스럽게 진행할 수 있었다.
API 활용 가능 여부도 불분명했고 마음이 급해서 초반에 제대로 데이터 분석을 못했던 것이 아쉽다.
좀 더 마음의 여유를 갖고 제대로 분석한 뒤 진행했다면 계속해서 테이블을 수정할 필요도 없었을 터.. 다음 프로젝트(가 있다면) 때는 좀 더 여유를 갖도록 하자.
배움에는 끝이 없고 의미없는 실수와 과정은 없다.
지난 세미 프로젝트때 엄청난 고생을 했던 '정렬'기능.. 비록 내가 담당했던 기능은 아니지만 해당 조원에게 도움을 줄 수 있어서 너무 뿌듯했다. 이래서 여러번의 프로젝트 경험이 중요한 거구나 다시한번 느꼈다. 계속해서 쌓여가는 지식들. 까먹지 않도록 잘 정리해놔야지
처음 해보는 코드 리뷰
지난 두번의 프로젝트를 같이 해왔던 팀은 다들 개인적인 성향이 강해서 본인이 맡은 담당한 부분만 구현하고 담당하지 않은 부분의 코드분석은 개인적으로 알아서 진행해왔었다. 물론 이해가 어려운 부분이 있다면 담당자에게 개인적으로 물어보긴 했었지만..
이번 팀은 그런 지난 팀 프로젝트 경험에서 얻어가는게 없었다는 의견이 있어서 각자 새롭게 구현한 기능이 생길 때 마다 코드리뷰를 하며 설명하는 시간을 갖자고 했다. 비록 그 코드리뷰는 거의 내 담당 발표시간이 되어버리긴 했지만 ㅎ..
코드 리뷰는 처음 해보는거라 초반에는 어떤식으로 해야할지도 막막하고 청자도 이해하기 힘들어 했었는데 역시나 해봐야 는다고 점점 실력이 좋아지는게 스스로 느껴졌다.코드 리뷰를 준비하면서 왜? 라는 질문을 스스로 끊임없이 했다. 팀원들의 쉬운 이해를 위해 텍스트도 정리해보고 그림도 그려보고.. 솔직히 당시에는 이게 웬 고생이냐 싶었지만 결론적으로는 내가 더 얻어가는게 많았던 시간이었다. 너무너무 좋은 경험이되었다.
.jpg)