재렌더링 2

재렌더링 구조와 최적화

재렌더링이 발생하는 조건리액트에서 재렌더링을 적절하게 제어하기 위해서는 재렌더링이 언제 발생하는지 알아야 합니다. 재렌더링이 발생하는 세 가지 패턴재렌더링이 발생하는 조건은 다음과 같이 세 가지입니다. 1. State가 업데이트된 컴포넌트2. Props가 변경된 컴포넌트3. 재렌더링된 컴포넌트 아래의 모든 컴포넌트 1, 2번 조건은 쉽게 떠올릴 수 있을 것입니다. 1번의 State는 컴포넌트 상태를 나타내는 변수입니다. 업데이트될 때 재렌더링되지 않으면 화면 표시를 올바르게 저장할 수 없습니다. 지금까지 본 것처럼 카운트업 변수를 실행해서 State를 변경하면 화면에 변경한 값이 실시간으로 반영되는 것은 State가 업데이트됨에 따라 컴포넌트가 재렌더링되기 때문입니다. 2번의 경우, 리액트 컴포넌트는 P..

리액트 2025.02.13

리액트 기본

리액트 개발 시작하기Create React App리액트 프로젝트를 시작하는 가장 일반적인 방법입니다. 리액트 개발사인 메타(Meta)에서 공식으로 제공하고 있으며 명령어 하나로 리액트 프로젝트를 시작할 수 있습니다. 작업할 PC에 Node.js를 설치하고 터미널이나 커맨드 라인에서 다음 명령어를 실행합니다. - 리액트 프로젝트를 작성하는 명령어npx create-react-app [프로젝트명] - my-app이라는 이름의 리액트 프로젝트를 만드는 경우npx create-react-app my-app 실행한 폴더 안에 my-app이라는 이름의 폴더가 만들어집니다. 거기로 이동해 시작 명령어를 실행하면 로컬 상태에서 리액트를 기동할 수 있습니다. - 로컬 환경에서 명령어 실행cd my-appnpm start..

리액트 2025.02.03