MovieApp프로젝트
-
MovieApp 만들기) 4.Favorite Button 만들기NODE.JS 2021. 4. 27. 22:09
이번 시간에는 영화 디테일 장면 위에 좋아하는 영화에 대한 추가버튼을 만들도록 하고, 옆에는 몇명이 좋아요를 눌렀는지 확인하도록 하자. 순서는 1. favorite model(userFrom, movieId, movieTitle, moviePost, movieRunTime)을 만들고 , 2. Favorite button UI 만든 후, 3. 몇명이 영화 좋아요를 눌렀는지 정보를 얻고, 4. 내가 좋아요 리스트에 넣었는지 정보를 얻은 후에, 5. 데이터를 화면에 보여주는 순으로 진행한다. 가장먼저 server쪽의 ->models->favorite.js 파일을 만든다. const mongoose = require('mongoose'); const Schema = mongoose.Schema; const fa..
-
MovieApp 만들기) 2.Landing Page 만들기NODE.JS 2021. 4. 26. 22:20
이번에는 사이트에 접속하면 바로 나타나는 랜딩페이지를 만들어 본다. 순서는 1. 전체적인 template을 만들어 놓기 2. Movie Api 에서 가져온 모든 데이터를 STATE에 넣기 3. Main Image Component를 만들기 4. Grid Card Component 만들기 5. Load More Function 만들기의 순이다. 먼저 LandingPage.js파일에 state를 이용해서 모든 데이터를 가져온다. 가져올때는 리액트의 useState를 이용한다 . import { json } from 'body-parser'; import React , {useEffect, useState} from 'react' import { FaCode } from "react-icons/fa"; imp..