리액트 [Movie App]

component에 정보를 보낼 수 있다.재사용 가능한 컴포넌트를 만들 수 있다.

정리 img의 주소는 .jpg로 끝나야 하고,

class React component에서 확장하여 사용한다.(extends가 그 기능을 한다)function이 아니기 때문에 return을 사용하지 않고 render를 사용한다.(render function도 React component가 가지고 있는 기능)rende

constructor는 componenntComponent Life Cycle diagram

javascript로 구현된 비동기 통신 라이브러리이다.(npm, yarn등으로 다운로드)json parsing, stringfy의 번거로움 없이 손쉽게 셋팅하는 부분을 도와준다.비교군으로 ajax, fetch가 있다.ajax: jquery가 있어야 사용할 수 있다.

첫 render(=mount)가 되면 처음에 div태그에 "Loading" text가 뜬다 . 이후 componentDidMount가 실행되면서 data를 가져오고, 가져온 이후 setState를 이용해 data를 state에 추가하고, isLoading을 false로

별점이 높은 순으로 20개 영화를 보여주는게 노마드코더 수업의 끝이었다. 하지만 이렇게 끝내는게 아쉬워 검색기능을 구현해보았다.

리액트는 SPA(single page Application)방식으로써, 여러개의 페이지를 사용하며, 새로운 페이지를 로드하는 기존의 MPA방식과 달리, 새로운 페이지를 로드하지 않고 하나의 페이지 안에서 필요한 데이터만 가져오는 형태를 가진다.예를 들어 로그인과 회원가

영화를 클릭했을 때, Link가 지정 path로 이동하면서 같은 path를 주소로 하는 router에게 정보(props)를 보낸다. (Movie.js에서 구현한) 영화를 클릭하여 Link가 지정 path로 이동하고 동시에 정보(props)를 넘겨주면, 같은 path를

넓은 화면 좁은 화면 영화 클릭 About클릭 ![](https://images.velog.io/images/hyunn/post/a