# getDerivedStateFromProps

React lifecycle
React lifecycle 소개 React에서는 컴포넌트(component)라는 개념을 사용하여 UI를 작성한다. 컴포넌트는 생명주기(lifecycle)를 가지며, 이를 이해하면 React 애플리케이션을 개발하는 데 매우 중요한 지식이 됩니다. 이번 글에서는 React 컴포넌트의 생명주기에 대해 알아보고, 예제와 함께 살펴보겠다. 컴포넌트 생명주기 React 컴포넌트는 생성, 갱신, 제거의 세 가지 생명주기를 갖는다. 각각의 생명주기는 다양한 단계를 거치며, 해당 단계에서 수행될 작업들을 정의할 수 있다. 예를 들어, 컴포넌트가 생성될 때 데이터를 초기화하거나, 갱신될 때 애니메이션을 실행할 수 있다. 1. 생성 컴포넌트가 생성될 때, 다음과 같은 단계를 거친다. constructor: 컴포넌트 생성 시 호출되는 메서드. 초기화 작업을 수행. getDerivedStateFromProps: props로부터 상태(state)를 도출하는 메서드
Lifecycle methods in React Component and explain each method.
lifecycle methods in React. > React Component의 생명주기 Method는 특정 순간에 자동으로 호출되는 Method입니다. componentDidMount: Component가 처음 Rendering 될 때 DOM에 추가된 후 호출됩니다. shouldComponentUpdate: Rendering 전 호출되어 Rerendering 필요한지 판단 후 호출됩니다. componentDidUpdate: Component가 갱신되어 Rerendering 후 호출됩니다. componentWillUnmount: Component가 DOM에서 제거되기 전 호출됩니다. getDerivedStateFromProps: Rendering 전 호출되어 Component의 상태를 props를 기반으로 업데이트할 수 있습니다. getSnapshotBeforeUpdate: Rendering 전 호출되어 Component가 DOM

[React] Life Cycle
앱 개발을 하면서 렌더링 되기 직전 이나 새로 변경된 후 특정 작업을 수행해야 한다면 life cycle 은 확실히 잡고 넘어가는 것이 좋을 것이다. React 의 component Life Cycle 은 크게 3단계로 분류가 가능하다. Mount → Update → unMount 단계이다. > 1. Mount Mount는 Dom 객체가 생성되고 브라우저 상에 나타나는 것을 말한다. Mount 의 함수 호출 순서이다. constructor component class 의 생성자 함수로 component 를 만들 때 처음으로 호출되

Main Components 2
State and Lifecycle > 각 컴포넌트는 상위에서 하위 컴포넌트로 값을 전달하여 사용할 수 있는데, 이 때 이 전달되는 값을 props 라고 한다. state는 각 컴포넌트가 가지고 있는 개별적인 상태값이다. props는 부모 구성요소에서 설정한 정보를 포함하며 변경할 수 없는 불변성의 특징이 있다. state는 자체적으로 초기화, 변경 및 사용할수 있는 정보를 포함하고, setState를 통해 변경이 가능하다. props는 함수의 매개변수처럼 컴포넌트에 전달되어 불변하고, state는 함수 내에 선언된 변수처럼 컴포넌트 안에서 관리되어 변경이 가능하다

TIL(2020.12.17)
1. LifeCycle API(생명주기) 콤포넌트가 브라우저 상에서 1) 나타날 때 2) 업데이트 될 때 3) 사라질 때 사용됨. 각 생명주기 단계별로 종류가 다양하다. 외우지 말고 필요할 때 매뉴얼에서 찾아서 쓸 수 있으면 됨 각 단계별로 존재하는 함수를 호출해 사용하면 됨. 1-1. Mounting 컴포넌트가 브라우저 상으로 나타날 때 1) constructor 생성자 함수. 만든 컴포넌트가 브라우저 상에서 나타날 때 가장 먼저 실행되는 함수. 주로 컴포넌트가 가지고 있을 state의 초기 설정 또는 컴포넌트가 만들어지는 과정에서 먼저 처리가 돼야 하는 작업이 있을 경우 실행됨. 2) getDerived