React 벼락치기

메모형식으로 우선 포스팅

 

 

1. 리액트는 SPA로 html 파일이 한개만 존재함

2. jsx = html+js

3. main.jsx or index.jsx 는 index.html 연결고리 브릿지 

// main.jsx
import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import App from './App.jsx'
import './index.css'

createRoot(document.getElementById('root')).render(
  <StrictMode>
    <App />
  </StrictMode>,
)

main.jsx는 App.jsx에서 정의된 App 컴포넌트를 index.html의 root div에 연결하는 역할을 하여 React 애플리케이션이 웹 페이지에 렌더링된다.

 

4. 리액트 jsx는 className의 속성을 사용한다. 왜? class는 js 예약어이기때문이다.

 

5. 자주 쓰이는 코드를 컴포넌트로 나눌 수 있다.