336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
React를 사용하는 방법은 크게 두가지가 있다.
1.CDN 되어있는 스크립트 주소를 가져다 쓰는 방법
특정 버젼 가저다 쓰기
|
<script src="https://unpkg.com/react@15/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>
|
최신 버젼 가져다 쓰기
|
<script src="https://unpkg.com/react@latest/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@latest/dist/react-dom.js"></script>
|
샘플 코드
|
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello World</title>
<script src="https://unpkg.com/react@latest/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
ReactDOM.render(
<h1>Hello, world!</h1>,
document.getElementById('root')
);
</script>
</body>
</html>
|
2.NPM or Yarn을 이용해서 환경을 구축할 수 있다.(버젼 관리에 용이하다.)
내가 NPM만 사용하기 때문에 npm 관련 예제만 가져왔다.
create-react-app은 reactjs에서 공식적으로 지원하는 모듈이다. 싱글 페이지에 웹어플리케이션 제작시 용이하다.
|
npm install -g create-react-app
create-react-app hello-world
cd hello-world
npm start
|
참조
'스터디 > ReactJs' 카테고리의 다른 글
| intelij create-react-app 사용시 reload안되는 문제 수정 (0) | 2017.02.22 |
|---|---|
| [1-5]컴포넌트 라이프싸이클 (0) | 2016.12.14 |
| [ReactJs]JSX란? (0) | 2016.12.01 |
| ReactJs - 1.2 Hello world (0) | 2016.11.30 |
| ReactJs 나만의 강좌 목차 (0) | 2016.11.30 |