본문 바로가기

내일 배움 캠프/사전캠프

내일 배움 캠프 6기 미니 팀 프로젝트 [ 무비스코어 ]

728x90

1. 나의 역할

- 삭제 기능

- 더미데이터 10개 작성 

 

2-1. [무비스코어] S.A. 

https://recondite-practice-c33.notion.site/2-A-S-A-6fcf1a476184438e902f10f557b6e4ca

무비스코어

  • 팀과제 소개
    • 영화의 후기를 작성하고 공유하는 서비스
  • 개발 및 결합 과정에 대한 방법 논의
    • 각자가 작성한 코드를 슬렉을 통해 팀장에게 전달하면, 팀장은 전달받은 코드를 결합하여 하나의 결과물로 만듭니다

와이어 프레임

기능

프론트

  • 영화 추천 팝업 띄우기 - 클릭시 영화를 등록할 수 있는 팝업을 띄웁니다. 영화 팝업에는 닉네임, 암호, 영화 url, 별점, 리뷰 를 입력할 수 있습니다.
  • 영화 카드 리스트 보여주기 - 백엔드에서 영화 데이터를 받은 후 영화 카드를 보여준다.
  • 영화 카드 수정 - 클릭시 암호입력 팝업을 띄운 후 암호가 맞다면 수정 팝업을 띄운다

 

백엔드

  • 영화 추천 글 저장하기 - 닉네임, 비밀번호, 영화 url, 별점, 리뷰 데이터를 받아서 데이버 베이스에 저장한다.
  • 추천 리스트 보여주기 - 데이터베이스에서 영화 리스트를 불러와서 프론트로 JSON형태로 보내준다.(보내주는 데이터는 영화 이미지, 영화 제목, 설명, 코멘트가 있습니다.)
  • 비밀번호 확인 - 데이터 베이스에 등록된 영화의 암호와 사용자가 입력한 암호를 확인하여 일치하면 1, 실패하면 0을 JSON 형태로 보내준다
  • 글 수정하기 - 게시글 id,닉네임, 비밀번호, 영화 url, 별점, 리뷰 데이터를 받아서 수정, 성공시 1 실패시 0을 보낸다
  • 글 삭제하기 - 게시글을 삭제, 삭제 성공시 1 실패시 0을 보낸다

 

API

 

2-2. 튜터 님의 S.A. 피드백

1. 와이어 프레임은 상세히 만들수록 좋습니다. 

현재는 기능이 별로 없기 때문에 이 정도로 만들어도 괜찮습니다. 

차후에 기능이 추가되면서 프로젝트가 복잡해질 때, 사용자 플로우를 고려하여 와이어 프레임을 작성하면 더 좋습니다.

간단히 와이어 프레임을 만들려면 draw.io를 이용하시면 되고 

조금 더 전문적인 와이어 프레임을 만들려면 figma를 이용하시면 됩니다.

구글에 "movie app wireframe" 검색해서 다른 사람들이 만든 와이어 프레임을 한번 보시는 걸 추천드립니다.

 

draw.io

https://app.diagrams.net/

 

figma

https://www.figma.com/

 

movie app wireframe 참고 자료 : 

https://www.jasonzhouzilin.com/regal

 

2. 기능쪽도 프론트쪽 기능과 백엔드쪽 기능을 나누어서 하나의 기능마다 설명을 해주면 됩니다. 

 

e.g.

프론트 

- 영화 추천 팝업 뛰우기 - 클릭시 영화를 등록할 수 있는 팝업을 뛰웁니다. 영화 팝업에는 닉네임, 암호, 영화 url, 별점, 리뷰 를 입력할 수 있습니다.

- 영화 추천하기 팝업닫기 - 설명 ... 

- 영화 카드 리스트 보여주기 - 백엔드에서 영화 데이터를 받은 후 영화 카드를 보여준다. 

- 영화 카드 수정 -  클릭시 암호입력 팝업을 뛰웁니다. 

...

 

백엔드

- 영화 추천하기 - 닉네임, 암호, 영화 url, 별점, 리뷰 데이터를 받아서 데이버 베이스에 저장한다. 

- 영화 리스트 보여주기 - 데이터베이스에서 영화 리스트를 불러와서 프론트로 JSON형태로 보내준다.(보내주는 데이터는 영화 이미지, 영화 제목 ... 이 있습니다.)

- 영화 수정 암호 확인 - 데이터 베이스에 등록된 영화의 암호와 사용자가 입력한 암호를 확인하여 일치하면 http status - 201, message - OK , 일치 하지 않으면 400, fail 을 JSON 형태로 보내준다.  

... 

 

3. API는 사실 2번에 기능에 정리 된 것을 api문서로 만든다고 생각 하시면 됩니다. 

개발자들이 주로 사용하는것은 REST api이고 주로 JSON형태로 데이터를 주고 받습니다. 

여러분이 만든 RESTful 하지 않기때문에 조금 수정이 필요합니다.

구글에 "restful api" 검색해서학습해보길 추천드립니다.

http status code 참고 - https://www.moesif.com/blog/technical/api-design/Which-HTTP-Status-Code-To-Use-For-Every-CRUD-App/

REST API 참고 - https://meetup.nhncloud.com/posts/92

 

 e.g. 

기능 | Method | URL | 받을 정보 | 보낼 정보 |

 영화 저장하기 | POST | /movies | 영화 ID -  영화 ID는 db에서 자동 생성 됩니다 프론트나 백엔드에서 생성하지 않습니다., 영화 제목, 설명, 별점, 닉네임, 리뷰, 비밀번호 | 저장 성공시  http status - 201, message - OK 실패시  400, fail  |

 영화 불러오기 | GET | /movies | - | 성공 - 영화 목록, 실패 400 or 500 fail |

영화 수정하기 | PUT | /movies | 영화 ID, 영화 제목, 설명, 별점, 닉네임, 리뷰, 비밀번호 | 성공시  http status - 200 or 204, message - OK 실패시  400, fail |

 

[내 파트]

 영화 삭제하기 | DELETE | /movies | 영화 ID, 비밀번호 | 성공시  http status - 204, message - OK 실패시  400, fail |

 

 

3. 규칙

성공은 1

실패는 0

return

 

4. 삭제 코드

#시도1: 레이아웃

@app.route(“/del”, methods=[“POST”])
def movie_del():
  If 비밀번호 === 입력된 비밀번호,
    db.movies.delete_one({‘게시글ID’:’클릭한게시글ID’})
    return 1
  else return 0

 

#시도2 
@app.route(“/del”, methods=[“POST”])
def movie_del():
  password_receive = request.form[‘password_give’]
  _id_receive = request.form[‘_id_give’]
  If password_receive === true, # 이 부분에서 작동하지 않는다 이유: if의 비교대상이 없다
      db.movies.delete_one({password:password_receive},{_id:_id_receive})
      return 1
   else return 0
# 시도3
@app.route("/del", methods=["POST"])
def movie_del():
    password_receive = request.form['password_give']
    id_receive = request.form['id_give']

    find = db.movies.findOne({_id: id_receive})
	#find를 통해 원하는 자료를 선택한다
    
    if find['password'] == password_receive #find에서 갖고 나온다
        db.movies.delete_one({password:password_receive},{_id:id_receive})
        return 1
    else return 0

 

📌  코드를 적고 나니 리턴 할 때 메시지를 띄우고 싶어졌다.

#시도4
@app.route(“/del”, methods=[“POST”])
def movie_del():
    password_receive = request.form[‘password_give’]
    id_receive = request.form[‘id_give’]

    find = db.movies.findOne({_id: id_receive})

    if find.password == password_receive
        db.movies.delete_one({passwod:password_receive},{_id:id_receive})
        return 1, jsonify({'msg':'비밀번호가 일치합니다. 삭제되었습니다.'})
    else return 0, jsonify({'msg':'비밀번호가 불일치합니다. 삭제가 불가능합니다.'})
#시도5
@app.route("/del", methods=["POST"])
def movie_del():
    allmovie = request.get_json()
    reid = allmovie['id']
    repw = allmovie['password']
    db.movies.delete_one({'id':reid,'password':repw})
    return jsonify({'msg': '삭제 완료!'})

📌  프론트엔드 쪽의 코드를 받아 보니 해당 부분이 전부 구현되어 있어 메시지를 띄울 필요가 없어졌다.

그래서 delete_one이 작동하면 원래 규칙인 1을 리턴하는 코드를 적었다. 적용하니 자동으로 메시지가 띄워졌다. 

#시도6 : 최종 완성
@app.route("/del", methods=["POST"])
def movie_del():
    allmovie = request.get_json()
    reid = allmovie['id']
    repw = allmovie['password']
    db.movies.delete_one({'id':reid,'password':repw})
    return jsonify(1)

📌 이렇게 가기로 했다. 

 

5. 더미데이터

 

더미데이터_1

더보기

1 다음

리턴 투 서울

https://movie.daum.net/moviedb/grade?movieId=160426

닉네임 : seoulight

Pw: daum1111!

별점 : 5

대사 하나하나부터 표정까지 모두 연기력이 좋아 몰입감 있었습니다~! ^ㅂ^

 


2 왓챠피디아

물안에서

https://pedia.watcha.com/ko-KR/contents/m5agazq

닉네임 : intodive

Pw: watcha2222!

별점 : 4

영화의 구성이 좋습니다! ^^

 

 

3 네이버

파벨만스

https://search.naver.com/search.naver?where=nexearch&sm=top_hty&fbm=1&ie=utf8&query=%ED%8C%8C%EB%B2%A8%EB%A7%8C%EC%8A%A4#

닉네임 : Steve

Pw: naver3333!

별점 : 5

하고 싶은 일에 온힘을 다해 인생의 의미를 찾아가는 과정이 인상깊었어요 ㅠ ㅠ

 

4 네이버

라이스보이 슬립스

https://search.naver.com/search.naver?sm=tab_hty.top&where=nexearch&query=%EB%9D%BC%EC%9D%B4%EC%8A%A4%EB%B3%B4%EC%9D%B4+%EC%8A%AC%EB%A6%BD%EC%8A%A4

닉네임 : sleep

Pw: naver4444!

별점 : 5

보고 많이 울었습니다…. 의미있고 여운이 남는 영화예요 ㅠ ㅠ

 

5 왓챠피디아

가디언즈 오브 갤럭시: Volume 3

https://pedia.watcha.com/ko-KR/contents/m53NXbn

닉네임 : galaxy

Pw: watcha5555!

별점 : 5

올해 최고의 영화, 말이 필요 없다.

 

6 다음
드림

https://movie.daum.net/moviedb/main?movieId=135762

닉네임 : dreamer

Pw: daum6666!

별점 : 4

나는 이런 코미디가 좋다 ㅋㅋㅋㅋㅋㅋㅋ

 

7 다음

존 윅 4

https://movie.daum.net/moviedb/grade?movieId=162386

닉네임 : zone

Pw: daum7777!

별점 : 4

액션의 연출이 훌륭합니다. 안 보면 후회해요. 

 

8 다음

자전거도둑

https://movie.daum.net/moviedb/main?movieId=1312

닉네임 : bybycicle

Pw: daum8888!

별점 : 5

명작은 세월이 지나도 변하지 않는다.

 

9 네이버

더 웨일

https://search.naver.com/search.naver?sm=tab_hty.top&where=nexearch&query=%EB%8D%94+%EC%9B%A8%EC%9D%BC

닉네임 : sailer

Pw: naver9999!

별점 : 5

감동과 눈물이 있는 영화, 잘 만들었다…. ㅠ ㅠ

 

10 왓챠피디아

이니셰린의 밴시

https://pedia.watcha.com/ko-KR/contents/mO1jGgL

닉네임 : bansh

Pw: watcha0000!

별점 : 4

너무 재밌게 봤다. 러닝타임 순삭. 인간관계를 절묘하게 잘 그려낸 영화이다.

📌 더미데이터_1을 작성하여 DB에 집어 넣고 페이지로 가져온 결과, 더미데이터 url의 통일이 필요해 보였다.

 

📌 상의한 결과 네이버와 왓챠피디아는 더미데이터에서 제외하기로 하였다. 다음으로만 간다.

 

더미데이터_2

더보기

📄 더미데이터 10개

 

1 리턴 투 서울

https://movie.daum.net/moviedb/grade?movieId=160426

 

닉네임 : seoulight

Pw: movie1111!

별점 : 5

대사 하나하나부터 표정까지 모두 연기력이 좋아 몰입감 있었습니다~! ^ㅂ^

 


2 물안에서

https://movie.daum.net/moviedb/main?movieId=167355

닉네임 : intodive

Pw: movie2222!

별점 : 4

영화의 구성이 좋습니다! ^^

 

 

3 파벨만스

https://movie.daum.net/moviedb/main?movieId=163275

닉네임 : Steve

Pw: movie3333!

별점 : 5

하고 싶은 일에 온힘을 다해 인생의 의미를 찾아가는 과정이 인상깊었어요 ㅠ ㅠ

 

4. 라이스보이 슬립스

https://movie.daum.net/moviedb/main?movieId=163516

닉네임 : sleep

Pw: movie4444!

별점 : 5

보고 많이 울었습니다…. 의미있고 여운이 남는 영화예요 ㅠ ㅠ

 

5 가디언즈 오브 갤럭시: Volume 3

https://movie.daum.net/moviedb/main?movieId=129156

닉네임 : galaxy

Pw: movie5555!

별점 : 5

올해 최고의 영화, 말이 필요 없다.

 

6 드림

https://movie.daum.net/moviedb/main?movieId=135762

닉네임 : dreamer

Pw: movie6666!

별점 : 4

나는 이런 코미디가 좋다 ㅋㅋㅋㅋㅋㅋㅋ

 

7 존 윅 4

https://movie.daum.net/moviedb/grade?movieId=162386

닉네임 : zone

Pw: movie7777!

별점 : 4

액션의 연출이 훌륭합니다. 안 보면 후회해요. 

 

8 자전거도둑

https://movie.daum.net/moviedb/main?movieId=1312

닉네임 : bybycicle

Pw: movie8888!

별점 : 5

명작은 세월이 지나도 변하지 않는다.

 

9.왓챠피디아

더 웨일

https://movie.daum.net/moviedb/main?movieId=162616

닉네임 : sailer

Pw: movie9999!

별점 : 5

감동과 눈물이 있는 영화, 잘 만들었다…. ㅠ ㅠ

 

10 왓챠피디아

이니셰린의 밴시

https://movie.daum.net/moviedb/main?movieId=162469

닉네임 : bansh

Pw: movie0000!

별점 : 4

너무 재밌게 봤다. 러닝타임 순삭. 인간관계를 절묘하게 잘 그려낸 영화이다.

 

 

피드백

파트별로 익명처리 하였다!

Q.

/del 제가 이번 프로젝트 하면서 다른 파트에 조금 개여했던 적이 있는데 괜찮을까요? 아니면 자기 파트만 하는 게 좋은가요?
 

A.

/update 오잉 같이 보는게 ㅂ좋아요

/save 사람마다 다르겠지만 저같은 경우에는 당연히 다 같이 해보는게 좋다고 생각해요 !!

 
 
 

완성 코드 Git Hub

https://github.com/verdantjuly/moviescore

 

소감

다같이 무언가를 만들 수 있다는 사실이 좋았다. 모두 같은 코드를 이해하려고 노력하고 열심히 지내는 게 좋았다. 내가 한 일은 작았지만 작은 일도 조원들 덕분에 해낼 수 있는 사람이 되어서 즐거웠다. 다음에는 조금 더 용기를 내서 범위를 넓혀 가는 것도 좋을 것 같다. 민폐가 될까봐 제일 간단한 일을 추천해 줬으면 좋겠다고 했는데 하면서 보니 나도 조금 더 할 수 있을 것 같다. 파이팅 하자!