영화 웹 서비스 만들기

[영화 웹 서비스 만들기] #2 JSX & PROPS (2) (Key prop , alt, PropTypes)

본 포스팅은 리액트 JS를 다루고 있습니다. #2.3 map Recap Key prop (키 속성) 위의 에러에 따르면 list내의 child는 unique한 key prop을 가져야 한다고 말하고 있다. 즉, 모든 react element들은 유일해야하고있다. 즉, 모든 react element들은 유일해야한다. list 안에 넣으면서 유일성을 잃어버리게 되므로 배열의 각각의 item에 id를 추가하고 component에 key라는 prop을 줌으로써 해결할 수있다. 위의 예시로 설명하면 배열에 있는 정보들은 모두 Food component 함수를 통해 Food component가 되고 우리에게 보여진다. 이렇게 모두 Food component가 되어버려 유일성을 상실한다. 결국 모든 element들이..

[영화 웹 서비스 만들기] #2 JSX & PROPS ( Component, forEach(), filter(), map() )

본 포스팅은 리액트 JS를 다루고 있습니다. # 2.0 Creating your first React Component Localhost Localhost를 게속 유지하고 창을 계속 띄운 상태로 실행시키고 싶다면 npm start 를 하고 console을 종료하지 않아야 한다. x를 눌러서 숨기는 경우는 계속 작동한다. console만 종료시키지 않으면 된다. JSX (1) JS와 HTML의 조합을 JSX라고 한다. React에서 나온 거의 유일한 개념이다. 위의 는 HTML이 아니다. 아래의 return 안에 있는 내용들은 HTML이다. Component 위의 과 같은 것들을 Component라고 한다. react는 component와 함께 동작한다. component를 만들고 보기좋게 만들며 comp..