본문 바로가기

토이프로젝트/리뷰어(영화 리뷰 사이트)

1일차 - 주제선정과 스토리보드

풀스택 공부를 좀더 해보기 위해서 토이프로젝트를 하나 시작해보기로 했다.

vue.js로 간단하게 프론트엔드를 구현하고, springboot로 백엔드를 구현할 틀을 정해두었다.

 

주제는 영화 리뷰 작성 페이지로 결정했다.

open api를 이용해보면 좋을 것 같아서 선정했다.

 

영화 리뷰 프로젝트 제목은 

 

기능

구현할 기능들은 아래 기능들이다.

 

- 사용자 관련 기능

   - 소셜 로그인(카카오)

   - 회원가입, 로그인

   - 프로필 관리

- 영화 정보 가져오기(open api)

- 영화 조회

- 영화 정보 조회

- 영화 별점, 리뷰작성, 댓글

- 리뷰 작성, 댓글, 좋아요

- 게시글(리뷰) 조회

- 영화 즐겨찾기

 

vue.js를 처음 사용해보기 때문에 간단한 기능 구현에서 시작해 확장시켜 나가야될 것 같다.

 

 

스토리보드

파워포인트를 사용해 설계했고, 대부분의 디자인은 왓챠를 참고해서 만들었다.

 

 

로그인

로그인

 

회원가입

회원가입

 

메인화면

메인화면

 

영화 상세정보

영화 상세정보
영화 상세정보2

 

영화 검색

영화 검색
영화 검색 결과

영화 리뷰 목록

리뷰 목록 조회

리뷰 상세조회

리뷰 작성

리뷰 작성

리뷰 작성

프로필 조회

프로필 조회

프로필 편집

프로필 편집

 

 

 

 

기능 명세

스토리보드를 기초로 구현해야 할 기능을 명세했다.

 

- 사용자

 - 회원가입

 - 로그인

 - 소셜 로그인(카카오, 구글)

 - 비밀번호 찾기

 - 닉네임 중복 검사

 - 프로필 조회

 - 프로필 수정

 

- 정보 수집

 영화명, 장르, 국가, 러닝타임, 감독, 배우, 영화 이미지

 

- 영화

 - 영화 전체목록

 - 종류 별 정렬 (장르, 국가) (별점 순, 별점 인원 순, 리뷰 순, 러닝타임 순)

 - 영화 상세정보 조회

 

- 코멘트(영화 댓글)

 - 영화별 코멘트 조회

 - 사용자 별 코멘트 조회

 

- 리뷰

 - 영화별 리뷰 조회

 - 사용자별 리뷰 조회

 - 리뷰 작성

 - 리뷰 수정

 - 리뷰 삭제

 - 리뷰 별 댓글 기능

 

 

-

간단하게만 하고자 했는데 하나씩 기능을 집어넣다보니 꽤 많은 기능을 넣게 됐다.

초반부터 모두 구현하기 보다는 조금씩 해나가는것을 목표로 해야겠다.

프론트엔드는 디자인 적으로 신경쓰기보다는 기능이 동작하는 것을 목표로 최대한 부트스트랩에서 당겨올 생각이다.

그리고 open api로 영화정보 수집 부분을 한번도 해본적이 없어서 걱정된다...! 잘 할수 있어야할텐데