jsx 2

React createElement 직접 구현하기: 환경 설정

JSX와 React.createElementJSX는 리액트에서 HTML과 유사한 형식으로 마크업을 작성할 수 있게 해주는 문법이다. 익숙한 HTML 문법을 그대로 활용해 DOM의 구조를 표현할 수 있기 때문에 직관적이고 편리하다.JSX는 아래와 같은 형태로 사용한다.const App = () => { return ( Hello World! )}JSX로 작성한 구문은 트랜스파일을 통해 아래와 같은 리액트 메서드로 변환되며,// ~ React 16 버전React.createElement("div", null, React.createElement("h1", null, "Hello, world!"));// React 17 버전 ~_jsx("div", null, _jsx("h1", nu..

React 2024.12.14

JSX란?

XML이란?JSX는 JavaScript XML(Extensible Markup Language)의 줄임말이다. 그렇다면 XML은 무엇인가?(개발 공부를 하다 보면 항상 이러한 재귀적 물음이 드는 상황이 자주 생기는 것 같다. 아무래도 지식이 아직 많이 모자라서 그런가 보다).XML은 데이터를 저장하고 전달하는 데 있어 확장 가능하고 유연한 문법을 제공하는 마크업 언어이다. 유사한 언어론 HTML이 있는데, HTML은 웹 페이지의 구조와 콘텐츠를 표시한다면, XML은 특정한 데이터를 표현하고 전송하기 위한 형식 언어라는 점에선 차이가 있다. 또한, HTML은 어느 정도 정해진 태그들을 활용해 웹의 구조를 표현한다면, XML은 사용자 정의 태그를 사용할 수 있다는 특징도 있다.아래는 XML을 사용해서 책에 ..

React 2024.11.21