● main.tsx

index.html 파일에서 <script src="/src/main.tsx">로 main.tsx 파일을 불러오면 그때부터 리액트 코드가 실행됩니다. main.tsx 파일은 리액트 애플리케이션을 초기화하고 구성하는 역할을 합니다.

main.tsx 파일을 열면 다음과 같이 작성되어 있습니다.

src/main.tsx

import { StrictMode } from 'react' ---------------- ➊
import { createRoot } from 'react-dom/client' ----- ➋
import App from './App.tsx' ----------------------- ➌

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

➊ StrictMode는 리액트에서 코드 오류나 비효율적 사용을 알려주는 개발 도구입니다. 화면에는 영향을 주지 않고 오직 개발 모드에서만 동작하며, 코드를 더 안전하게 작성할 수 있도록 도와줍니다.