Hyebin‘s blog
article thumbnail
Published 2022. 1. 30. 01:25
Props vs State vs Redux Front-end/React

Props

1. properties를 줄인 말 

2. 컴포넌트간에 전달할 때

3. 컴포넌트의 소통 방식은 위에서 아래로 , 즉 부모 컴포넌트에서 자식 컴포넌트로 보낼 수 있음

4. 부모 컴포넌트에서 자식 컴포넌트에 전달 할 때, 이를 변경 할 수 없다.

 

State

1. 컴포넌트 안에서 데이터를 교환하거나 전달 할 때 사용

2. props와 달리 변경이 가능하다.

3. state이 변화면 re-render 된다.


Redux

리덕스가 없을 경우 props 하나하나 거쳐야 한다.

state를 상위 컴포넌트에 두는 것이 아닌, redux store에 저장하면 직접 접근이 가능하다.

훨씬 편한 state 관리가 가능!

 

Redux 데이터 Flow (Strict unidirectional data flow)

Redux는 철저하게 한 방향으로 흐른다.

액션

객체로 되어 있음.

무엇이 일어났는지 설명하는 객체 (상태를 알려줌)

 

Reducer

액션을 함으로 인해서, 변환것을 설명

이전 State과  action object를 받은 후 next state를 return!

 

Store

전체적인 State를 감싸주는 역할

Store안에는 여러가지 메소드가 있는데 이를 이용하여 관리가 가능하다.

 

 

profile

Hyebin‘s blog

@hyebin Lee

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!

검색 태그