리액트와 리랜더링React변경된 부분만 다시 그린다.React 앨리먼트는 불변객체(immutable)이다.ReactDOM.render(element, rootElement)로 전달할 뿐 변경 판단 및 반영은 리액트가 알아서 한다.React 비교 알고리즘 (Reconciliation)- 비교시 Virtual Dom 활용element 타입이 변경되면이전 element는 버리고 새로 그린다.element 타입이 같으면key를 먼저 비교하고, props를 비교해서 변경사항을 반영한다. 바닐라JS변경으로 인해 element를 다시 그린다. 더보기
멀티 Element 생성- React.Fragment or 를 가지고 여러가지 Element들을 주입 가능// 1.const elementOne = (Hi, // React.createElement("h1", null, "Hi"), Bye, // React.createElement("h3", null, "Bye"), Children, // React.createElement("h5", null, "Children"), ]}/>);// 2.const elementTwo = ( hi Bye Children); Element 찍어내기- Function -> 재사용 가능한 Element- Custom Element -> Upper case- Children 제한 -> 없음con..
JSX란?const element = Hello, world - 문자도 HTML도 아닌 Javascript의 확장 문법- React.createElement 간편 표현식- 모든것을 변수화 할 수 있다. Babel- JavaScript Complier- JSX를 React가 아닌 Javascript로 이해할 수 있도록 바꾸는 컴파일러- 컴파일러: 언어 해석기, 특정 언어를 다른 프로그래밍 언어로 옮기는 프로그래밍 Babel 사용 전 Babel 사용 후 Spread 연산자 const text = "Hello, world!"; const titleClassName = "title"; const props = ..
