본문 바로가기

내일 배움 캠프/zbase : moviechart

zbase : moviechart 완성

728x90

이 프로젝트는 moviechart 개인 프로젝트에서 팀 프로젝트로 변경되었습니다.

 

- 팀 이름 : 제로베이스(zbase)

- 팀 규칙

(1) 모두가 이해했을 때 넘어간다.
(2) 모르는 부분은 잘 물어본다.
(3) console.log() 를 꼭 찍어 본다.
(4) 밥 먹으러 가기 전에 인사하기
(5) 소통을 잘 하자 (채팅은 Slack으로 통일)

- 초기 와이어 프레임

(필요에 의해 여기서 많이 변형 되었다.)

- 새로운 주요 기능

zbase : moviechart 만의 기능을 소개한다.

moviechart에 원래 있던 기능은 설명을 생략합니다.

1. prev next 

prev와 next라는 버튼을 만들어 상세페이지간 이동이 가능하게 한다.

영화의 순위를 localStorage에 저장하여 key값은 "rankof" + sendid 로  가져온다.

이때 prev는 순위가 1개 더 높은 순위의 차트,

next는 순위가 1개 더 낮은 순위의 차트를 보여 준다. 

let allmovies = []
for (let i = 0; i < movies.length; i++) {
	allmovies.push(movies[i]["id"])
    localStorage.setItem("rankof" + movies[i]["id"], allmovies.indexOf(movies[i]["id"]) + 1)
    localStorage.setItem(i + 1, movies[i]["id"])
    }
function prevfunc() {
  let ranknum = parseInt(localStorage.getItem("rankof" + sendid)) - 1
  if (ranknum > 0) {
    sendid = localStorage.getItem(ranknum)
    detailload()
    pastereview()
  } else { alert("제일 처음 영화입니다.") }
}
function nextfunc() {
  let ranknum = parseInt(localStorage.getItem("rankof" + sendid)) + 1
  if (ranknum < 21) {
    sendid = localStorage.getItem(ranknum)
    detailload()
    pastereview()
  } else { alert("제일 마지막 영화입니다.") }
}

2. delete modal

각각의 댓글마다 delete 버튼을 달아 modal이 열리게 한다.

여기서 id / pw 를 받아 일치하면 삭제한다.

3. 개봉일 알려주기 & 리뷰 막기(개봉일 전일 경우)

개봉일 전일 경우 리뷰 입력 창이 나오지 않는다.

개봉일 전일 경우 개봉까지 남은 일 수를 세어서 표시해 준다.

 

 // 개봉일과 개봉일까지 남은 시간을 계산
      let release = movie.release_date
      let releasedate = new Date(release);
      let lefttime = Math.round((releasedate.getTime() - today.getTime()) / 86400000)

      // 개봉일까지 남은 시간이 반올림 하여 0일이라면 내일로 표시해 준다.
      if (1 > lefttime > 0) { showlefttime = lefttime.toString().replace("0", "내") }

      // 그렇지 않다면 n일로 표시한다.
      else { showlefttime = lefttime }

- 나의 역할

뼈대, 댓글 삭제 기능 구현, prev next 버튼 구현, 개봉일 알려 주기 구현, 주석

- 완성 코드 Github 

https://github.com/verdantjuly/zbase

 

- 팀의 후기

코드 구현이 어려웠습니다.
기능 구현에 대한 추론이 어려웠습니다.
모달창 구현이 어려웠는데 모두와 함께 해결하였습니다. 존경합니다.
모달 구현이 어려웠지만 팀원의 도움으로 잘 해결했습니다~
코드를 짜는거 조차 어려웠는데 팀원들이 많은 도움을 주셨습니다.

 

- 나에 대한 팀의 피드백

팀원들의 동의를 얻어 문장 그대로 옮겨 봅니다!

 

다 잘하셨고 너무 열심히 하시고 고생하셨습니당 개인적으로 생각할때 코드 부분에서 보면 데이터 저장할때 json 메소드를 이용해서 객체로 저장하고 다시 문자열화 하면서 로컬 스토리지에 저장했으면 저 깔끔하지 않았을까 하는 생각입니다

> 같은 생각을 하였으나 그 생각이 떠올랐을 때 이미 프로젝트 중반 시점에서 모두가 기존 로직으로 코딩을 하고 있어 선뜻 이야기를 꺼내지 못했습니다. 감사합니다 다음부터는 중간에 좋은 로직이 생겼을 때 적용할 수 있도록 노력하겠습니다!

 

아무래도 다영님이 만드신거에서 계속 신기능을 추가하다보니 필수 만족사항에서도 다 이해못하신 분들이 있을 것 같아요...잘은 모르겠지만(?)  근데 계속 추가가 되니 힘들었을 수도 있겠다 싶습니다

> 최대한 마지막 멤버에게 맞춰서 도움을 주고 받고 진행해 보려 하였으나 앞선 의견을 제시하는 멤버도 무시하기는 어렵다고 생각했습니다. 하지만 말씀을 모아 듣고 돌이켜 보니 제가 이 부분은 부족했던 것 같습니다. 앞으로 원래 규칙인 모든 사람이 이해할 때 넘어간다를 생각하고 협업을 해 보겠습니다! 팀 프로젝트 중간에 이 기능은 굳이 어렵게 구현하지 않아도 될 것 같다고 사인을 주셨는데 제가 그 부분을 캐치하지 못하였습니다. 앞으로 더 발전하겠습니다. 감사합니다!!!

 

저는 다영님의 열정과 발전하고자 하는 의지를 높게 삽니다 다영님 이대로만 하시면 뛰어난 개발자가 되실듯..

> 감사합니다... 높게 사 주신 만큼 개발자가 될 수 있으면 좋겠습니다.
 
다영님이 만드신 코드를 토대로 시작한 것은 이미 개인적으로 동의 한 바 있었고 이해하긴 어려웠지만 좋은 참고가 되었습니다 제 수준에선 할 게 없어서도 문제였구요;;  제가 협업은 처음인지라 개인적으로 학습해 나가는 것보다는 좋은 경험을 했다고는 생각은 하는 데 혼자 파헤쳐 봐야 하는 부분도 있다보니 다 같이 하는 것에 있어서는 좋은 방향을 제시하기가 어려운 것 같습니다 제가 이것저것 일일히 다 물어볼 수는 없으니까요

> 제가 미리 질문이 필요한 부분에서 설명을 먼저 해 드리면 좋았을 텐데 이 점에 대해 많이 죄송합니다. 저도 남이 작성한 코드를 읽는 게 쉽지 않은데 그 부분에 대한 배려가 부족했던 것 같습니다. 해 주신 좋은 말씀들은 새겨 듣겠습니다. 감사합니다!!!

 

그런데 그것도 도움 많이 되었습니다 화면 공유하고 보는 것?

> 그렇죠! 저도 도움이 많이 되었습니다 화면을 공유하니까 자잘한 오차같은 걸 서로 잡아 줄 수 있어서 좋았던 것 같아요

 

기능 구현에 대한 설계와 추론이 원활히 진행 되었고, 각 메소드의를 적재적소에 잘 사용해서 기능을 구현하셨다고 생각합니다.

> 적재적소에 있었군요! 감사합니다~


예시코드가 보험이 되고 새로운 느낌으로 새로 시작했으면 좋았을거 같은데 이미 정해진 정답을 따라가는 느낌이라 조금 버거웠습니다.

> 다음부터는 개인 탐구 작업을 하는 시간을 조금 더 배치하면 개선되지 않을까 생각합니다! merge 기한인 수요일 저녁까지 완료가 되지 않아 정해진 예시 코드를 많이 따라간 부분이 있는 것 같습니다! 개선하겠습니다~

 

- 팀 과제에 대한 튜터 님의 피드백

PR merge는 잘해주셨는데요! 커밋 메시지와 pr이 어떤내용인지 명확히 작성하는 습관을 가지면 좋을거 같아요! 

> 습관을 잘 들이겠습니다!

프로젝트 폴더 구조를 잘 구성해 주셨어요!

> 감사합니다~

과한주석코멘트는 코드가독성은 오히려 떨어드려요. 불필요한 주석은 제거하면 좋을거같아요

> 적게 적었다고 생각했는데 많았군요!!! 주석을 더 줄이겠습니다~

console.log는 성능에 저하가될수있으니, 불필요한 부분은 제거 해보아요

> 콘솔 로그!! 꼭 지우겠습니다~

 

- 소감

제가 변수명을 바꾸면 다른 팀원들이 liveshare로 전부 바꿔 주셨습니다.

백지장도 맞들면 가볍다! 변수를 바꾸자고 결심하고 많이 고통받을 뻔 했는데 너무 좋았습니다. 

 

제출 이후에 다른 조의 깃헙을 많이 보았는데, 다들 JSON.stringfy 를 사용한 것 같습니다.

그랬더니 코드가 줄어들고 가독성이 좋아집니다.

실제로 프로젝트 이후 피드백에서 해당 의견을 제시해 주신 분이 계셨습니다. 소통을 더 많이 하고 했어야 했는데 부족했습니다.

 

프로젝트 진행이 빠르다는 의견이 대체적으로 많았습니다. 처음에 만든 규칙을 제대로 수행하지 못하였습니다.

완성을 하지 못하더라도 모든 사람이 이해했을 때 넘어가야 하는데 부족했습니다.

 

지금까지 얻은 피드백을 바탕으로 앞으로 더 잘 해나갔으면 좋겠습니다.

이다영 파이팅!