JSX란? HTML과 유사하게 하게 생겼지만 JavaScript 언어의 확장된 문법이다. 리액트 프로젝트에서 겉으로 보이는 부분을 정의할 때 사용한다. 리액트 프레임워크에서 특화된 개념이다. 컴파일에 최적화되어 있다. Babel이 컴포넌트 파일 안에 있는 XML 형태인 JSX를 Javascript로 변환해준다. JSX 파일은 컴파일이 되기 때문에 변환과정에서 오류가 있을 경우에 빌드할 때 오류가 발생한다. JSX -----[Babel]----> Javascript //src/App.js function App() { return ( Edit src/App.js and save to reload. Learn React ); } JSX 기본 문법 꼭 닫혀야 하는 태그 /div> 꼭 감싸져야하는 태그 2개 이..

컴포넌트란? 데이터를 입력받아 DOM Node를 출력하는 함수. 쉽게 말하자면 html을 반환하는 함수. 예) App.js의 function App() { } 리액트로 만들어진 앱을 이루는 가장 최소한의 단위가 컴포넌트 컴포넌트 생성 및 사용 방법 [임의 이름].js파일 생성 이때, 반드시 첫글자는 대문자여야 한다. (예시) Happy.js import React from 'react';추가 현재 js 파일 안에서 react 컴포넌트를 사용한다는 의미이다. Q.리액트 프로젝트 내의 파일인데 리액트 컴포넌트를 사용한다고 굳이 넣어줘야하는가? 파일 내에서 react 컴포넌트를 사용한다는 부분이 없으면, jsx가 있는 컴포넌트를 사용한다는 것을 이해하지 못한다. 다른 파일에서 'Happy' 컴포넌트를 사용하기..