26. JSX를 꼭 사용하지 않아도 되는 이유

• 프로젝트 링크

• JSX를 꼭 사용하지 않아도 되는 이유

  • JSX를 사용하지 않아도 리액트 앱을 빌드할 수 있다.
  react-component

  React.createElement(
    "div",
    { id: "content" },
    React.createElement("p", null, "Hello World!")
  );
  

  build-result

  <div id="content">
    <p>Hello World!</p>
  </div>
  

  no-use-jsx

  import React from 'react'
  import ReactDOM from 'react-dom/client'
  import App from './App.tsx'
  import './index.css'
  
  // use jsx
  ReactDOM.createRoot(document.getElementById('root')!).render(
    <React.StrictMode>
      <App />
    </React.StrictMode>,
  )
  
  // no use jsx
  ReactDOM.createRoot(document.getElementById('root')!).render(React.createElement(
    React.StrictMode,
    null,
    React.createElement(App, null),
  ))