목차 Components란? 컴포넌트는 재사용할 수 있는 단위를 말한다. 레고로 자동차를 만들 때, 다양한 크기의 블럭을 조립하여 만들 듯이 공통되는 UI를 조각내고 다양한 곳에서 조립하듯이 앱을 만들 수 있도록 나누는 것이 컴포넌트이다! //리액트 컴포넌트 예시 //클래스형 class App extends React.Component { render() { return Hello world! } } ▶ 컴포넌트 //함수형 function Head(){ return ( 제목1 제목2 ); } ▶ 컴포넌트 우리는 이미 리액트 컴포넌트를 사용해봤다. 리액트 컴포넌트는 HTML에 정의된 태그가 아닌 , 와 같이 사용자 정의 태그를 만드는 것이라 생각해도 될 것 같다. 클래스형 컴포넌트 React.Compone..

목차 Element const element = Hello, world; 리액트의 가장 작은 단위이다. Component와는 다르다! Element는 Component의 구성요소이며 화면에 렌더링할 DOM 정보를 React에 알려주는 객체이다. Element가 있기 때문에 값이 변경된 부분만 다시 렌더링 할 수 있다. 어떻게 가능할까? JS의 경우 변경점은 시간 뿐임에도 불구하고 root부터 모든 태그가 전체적으로 다 변경된다. React의 경우 //root 아이디를 가진 태그를 찾아서 루트로 선언한다 const root = ReactDOM.createRoot( document.getElementById('root') ); //현재 시간을 보여주도록 jsx 작성 function tick() { //ele..