인프런 커뮤니티 질문&답변

yjym33님의 프로필 이미지
yjym33

작성한 질문수

웹 게임을 만들며 배우는 React

강의 수강 시 주의할 점

안녕하세요 제로초님

작성

·

235

0

안녕하세요 제로초님 강의를 보다가 문득 의문이 들어서 질문을 드리려고 합니다.

리액트를 사용할때 보통 html에서 사용을 안하고 js파일에다가 React를 import받아서 사용하는 것으로 알고 있는데 html에서 리액트를 구현하시는 이유를 여쭈어보고 싶습니다.

그리고 위에서 스크립트에서 아래 부분을 가져오시는거 같은데 따라치면 오류가 나서요.. 어디서 가져오시는건지 여쭈어봐도 될까요?

  <script crossorigin src="https://unpkg.com/react@16/umd/react.developement.js"></script>

<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.developement.js"></script>

답변 1

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

1강에서만 html로 합니다. 결국 react도 특별한 게 아니라 html, css, js일뿐이라는 걸 보여드리는 겁니다.

2강에서 js로 하는 것 알려드리고 그 뒤로 쭉 그렇게 합니다.

https://ko.reactjs.org/docs/cdn-links.html

yjym33님의 프로필 이미지
yjym33
질문자

위의 링크로 해서 <script>부분을 가져왔는데 html 실행해도 버튼이 나오질 않습니다 ㅠㅠ

저의 코드는 다음과 같습니다.

개발자도구에서는 index.html 21 : ReactDom is not defined라고 되어있습니다.

<html>
<head>
<script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
</head>
<body>
<div id="root"></div>
<script>
const e = React.createElement;

class LikeButton extends React.Component {
constructor(props) {
super(props);
}
render() {
return e('button', null, 'Like'); // <button>Like</button>
}
}
</script>
<script>
ReactDom.render(e(LikeButton), document.querySelector('#root'))
</script>
</body>
</html>
제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

ReactDOM 입니다.

yjym33님의 프로필 이미지
yjym33
질문자

아 결국 오타때문이였군요.. ㅠㅠ 죄송합니다.

감사합니다.

yjym33님의 프로필 이미지
yjym33

작성한 질문수

질문하기