리액트를 사용하기 위해서 react, react-dom, babel을 import 해줘야 한다.
기본적인 리액트 기본 틀은 다음과 같다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> React ! React! React!</title>
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
</head>
<body>
<div id="container"></div>
<script type="text/babel">
</script>
</body>
</html>
리액트에서 화면에 출력해주기 위해서는 ReactDOM.render( 1, 2) 메서드를 사용하게 된다.
매개변수
1. 화면에 출력하고 싶은 html(jsx)
2. 해당 jsx를 렌더링 해 보여줄 DOM의 위치
보여주고자 하는 html 은 <h1>SangNamja</h1> 태그이며, 보여줄 위치는 ID=CONTAINER인 태그이다.
'dev > React' 카테고리의 다른 글
| [REACT] JSX 특징 (0) | 2022.11.30 |
|---|---|
| [React] 속성 전달 (0) | 2022.11.29 |
| [React] 복잡한 컴포넌트 제작 (0) | 2022.11.29 |
| [React] 리액트 스타일링 (0) | 2022.11.29 |
| [React] React Component (0) | 2022.11.29 |
