StrictMode의 역할

환영합니다

StrictMode란 무엇인가요

import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';

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

수명 주기 이중 호출

왜 두 번 호출하나요

이펙트 마운트–마운트 해제–재마운트

useEffect(() => {
  const id = setInterval(() => setTick(t => t + 1), 1000);
  return () => clearInterval(id); // cleanup required!
}, []);

사용 중단된 API 감지

레거시 컨텍스트 API 경고

기존 앱에서 안전하게 활성화하기

function App() {
  return (
    <>
      <LegacyPart />  {/* not wrapped */}
      <StrictMode>
        <NewFeature />
      </StrictMode>
    </>
  );
}

시각적 차이 없음

첫날부터 활성화하기

빠른 확인

복습

다음 학습