팀 프로젝트_영화 정보검색 사이트 🎬

안녕하세요! B-11조 코딩햄스터즈 입니다. 🎉🎉

저희는 넷플릭스를 모티브로 하여 블랙 백그라운드에 레드로 포인트를 준 디자인으로 컨셉을 잡았습니다.




⚙️ Github 전략

  • main branch

    • 최종 프로젝트 버전 브랜치
  • dev branch

    • 메인 작업 공간
  • feature branch

    • 각각의 기능 개발 브랜치

✅ 기술 스택




✅ 주요 기능

1. 코딩 햄스터즈가 엄선한 3가지 영화 추천 메인화면 : 저희가 선별한 영화를 슬라이드로 구성하여 사용자에게 소개합니다.

메인화면 캡쳐 이미지



2. 2가지의 카테고리 영화 추천 : 무엇을 찾아볼지 막막한 사용자에게 저희가 카테고리를 추천해드립니다. 슬라이더 라이브러리가 사용되어 있습니다.

메인페이지 캡쳐 이미지



3. 전체영화 리스트 더보기 : 전체 영화를 확인할 때, 많은 전체 목록을 나타내지 않고 더보기 기능을 구현하여 8개씩 추가하여 보여 드립니다.

메인페이지 캡쳐 이미지



4. 디테일 화면 : 영화가 표시된 화면에서 영화 선택시 영화의 상세내용을 나타내주는 상세화면입니다. 상세화면에서는 리뷰 작성이 가능합니다

디테일 페이지 캡쳐 이미지



5. 리뷰 등록 & 삭제 : 유효성 검사에 맞춘 리뷰 등록 시 리뷰 목록에 작성한 리뷰가 추가되고 해당리뷰의 "x"버튼을 누르게 된다면 삭제 팝업이 뜹니다

리뷰 수정 캡쳐 삭제



6. 비밀번호 오류 : 잘못된 비밀번호 입력시 비밀번호는 삭제되지 않고 비밀번호가 일치하지 않는다는 메세지와 함께 비밀번호 입력창으로 포커스가 자동으로 이동합니다

비밀 번호 오류 화면 캡쳐 이미지



7. 검색 화면 : 메뉴바에 보이는 검색창은 사이트내 어디서 검색하던 검색결과 창으로 이동되고, 영화 클릭시 역시 디테일 화면으로 진입합니다.

검색화면 캡쳐 이미지




💻 팀원


팀장 : 국민영


팀원 : 손서영


팀원 : 김성준


팀원 : 한종섭


팀원 : 전하임