React 컴포넌트 만들기

순서

/*리액트를 불러와서 사용하겠다.*/
import React form 'react' 

• 컴포넌트를 만드는 방법은 1. 함수 2. class

1. 함수로 만들어 보기

    function Cell () {
    	return (
    		<div>안녕하세요<div>; /*JSX 형식을 불러와 준다.*/
    	);
    }
    	export default Cell; /* Cell이라는 컴포넌트를 내보내겠다.*/

2. 만든 컴포넌트를 적용하기

• 컴포넌트를 만들었다면 이제 적용을 해보자.
• App.js에서 적용을 시키면 된다.

    /*현재 자신의 디렉토리에 있는 상대경로를 불러 오겠다.*/
    import cell from "상대경로"
    
    /*컴포넌트는 재사용이 가능합니다.*/
    function App() {
    	return (
    		<Cell/>
    		<Cell/>
    	);
    }
    ```

### 3. index.js 구조 뜯어보기
```javascript
    /*페이지에서 아이디가 'root'인것을 찾아서 </App>을 root 아래에 넣겠다!
    	root는 어디에? public -> index.html에 있습니다!
    */
    ReactDOM.render(<App/>,document.getElementById('root'))

4. ReactDOM.render 는 무엇을 하는 코드인가?

• 컴포넌트 페이지에 렌더링 하는 역할을 하며, react-dom 모듈을 불러와 사용을 할 수 있습니다.