React_JS (2) 썸네일형 리스트형 [개념정리] React_JSX React를 처음 배우겠다고 Creat React App으로 첫 페이지 띄우고 코드를 보면 궁금해지는게 있다. js 파일에서 html 코드들을 변수로 만들어서 넣어주는 것 같은데 자바스크립트 코드 안에 html태그라니.. 언뜻 보면 html,css 태그 같지만 아니다. JSX 라고 부르는 것. JSX= Javascript XML 인데 문법을 살펴보자. JSX 문법 : const heading = Hello, React No JSX 문법 : const heading = React.createElement('h1', { className: 'site-heading' }, 'Hello, React!') 즉 React는 Javascript에서 createElement 함수로 태그를 만드는 것을 상단 JSX 코드.. [개념정리] React 'Hello World' 화면 띄우기 React로 화면에 'Hello World' 띄우기 Hello World를 화면에 표시하기 위해 파일 3개(html1개, js 2개)가 필요하다. 1. index.html 2.index.js 3.App.js (index.html은 웹이 default로 바라보는 화면이기 때문에 무조건 있어야하는 파일, index.js는 index.html에 동적으로 JSX를 렌더링해주는 js코드파일, App.js는 Component (JSX를 return하는 js 함수) 코드이다. (처음 React 생성시 자동으로 잡히는 이름이라 저렇다. 이름은 변경되어도 무방) 2. index.html 코드를 보면 body 태그 안에 아무것도 없다. body 태그 내부에 root라는 아이디를 가진 non-semantic div태그 하나.. 이전 1 다음