[React] 렌더링 2번 호출 (feat. React.StrictMode)

 

index.js

import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './pages/App';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <BrowserRouter>
    {/*<React.StrictMode>*/}
      <App />
    {/*</React.StrictMode>*/}
  </BrowserRouter>

);

<React.StricMod> 부분을 주석해주면 1번만 호출하게 된다.

 

React.StrictMode는 React 개발 모드에서 사용되는 컴포넌트로,

애플리케이션에서 잠재적인 문제를 미리 감지하고 안전한 코드를 작성하도록 도움. 실제 운영 모드에서는 동작하지 않고, 개발 중에만 작동.