React.StrictMode

[yjm6560]

로그가 두 번 찍히는 일이 있어 확인해보니, React.StrictMode 가 적용되면 렌더링이 두 번 된다고 한다.

React.StrictMode 사용한 src/Index.js 코드

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

React.StrictMode 관련해서는 잘 정리해주신 분이 있다. 그러므로 자세한 건 이 블로그를 참고하도록 하자(https://velog.io/@kysung95/%EC%A7%A4%EB%A7%89%EA%B8%80-react-strict-%EB%AA%A8%EB%93%9C%EB%9E%80).

요약하자면...

• React.StrictMode 는 렌더링을 두 번 함으로써 두 번 렌더링한 결과가 혹시 다르지는 않은지... 확인할 수 있는, 장애 예방을 위한 설정이다.
• React.StrictMode 는 개발 과정 중에만 적용이 되고, 실제 배포 시에는 적용되지 않는다.
• React.StrictMode 를 제거해도 아무 상관 없다.

이 프로젝트에서는 로그 보기 번거로우니까 일단 지우고 나중에 필요하면 다시 적용하자 ㅎㅎ