프로젝트 생성
터미널을 실행한 다음 리액트 프로젝트를 만들어주자.
npx create-react-app <프로젝트명>npm 모듈 설치
npm i react-bootstrap bootstrap@5.1.3 리액트 부트스트랩 설치
npm i react-router-dom@6 라우터 설치
npm i redux react-redux 리덕스 시리즈 설치
npm i redux thunk 리덕스 미들웨어 설치
npm i --save redux-devtools-extension 리덕스 상태관리 용이 툴 설치프로젝트 할 일 리스트업
- 3개 페이지 필요 - 홈페이지, movie 페이지, movie detail 페이지
- 홈페이지에서 배너를 볼 수 있다.
- 3가지 섹션의 영화를 볼 수 있다. (popular, top rated, upcoming)
- 각 영화에 마우스를 올리면 제목, 장르, 점수, 인기도, 청불여부
- 영화를 슬라이드로 넘기면서 볼 수 있다.
- 영화 디테일 페이지에서 영화에 대한 디테일한 정보를 볼 수 있다. (포스터, 예산, 줄거리, 점수, 인기도, 청불 여부, 러닝타임)
- trailer를 누르면 예고편을 볼 수 있다.
- 영화의 리뷰도 볼 수 있다.
- 관련된 영화도 볼 수 있다.
- 영화 검색 가능
- 영화 정렬
- 영화 필터링
문제아