React관련 스크립트

아래 내용은 노마드코더님의 강의를 기반으로 작성한 내용입니다.

React-js vs React-Dom

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

React-Js는 어플리케이션이 interactive하도록 만들어주는 라이브러리이고, React-Dom은 모든 react elements를 HTML의 body에 넣어주는 역할을 합니다.

JSX

<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<!-- Your custom script here -->
<script type="text/babel">
  const getMessage = () => "Hello World";
  document.getElementById("output").innerHTML = getMessage();
</script>

JSX는 HTML-Like Javascript 확장 문법으로, React코드를 작성할 때 사용합니다.

JSX에선 for, class 등의 용어는 사용할 수 없습니다. 이는 JSX가 HTML이 아닌 HTML-LIKE JS코드이기 때문에 JS에서 이미 예약어인 for나 class를 혼동하기 때문입니다.

참고
JSX: https://babeljs.io/docs/en/babel-standalone