React에서의 상태관리 전략

[al-bur]

오늘은 상태관리 전략에 대해서 살펴보려한다.

react, vue, angular등 여러 도구에서 상태 관리를 다 할 수 있겠지만, 이번에는 react를 사용해서 예시 코드등을 작성해보려한다.

상태란?

상태는 살아 움직이는 데이터이다. 서비스가 운영되면서, 상태가 계속 바뀌고 이 상태를 통해서 UI가 그려지기 때문이다.

상태 관리

상태 관리란?

말 그대로 상태를 관리하는 것이다. 특정한 UI를 보여주기 위해 어떻게 상태를 변경할 것인지, 각각의 상태들을 효율적으로 사용하고 싶을 때는 어떻게 할 수 있을지등과 같은 포인트들을 고려하면서 상태들을 만들고 사용하는 것이 다 상태 관리의 일종이라 볼 수 있다.

왜 상태 관리가 중요할까?

상태를 기반으로 UI가 변화하기 때문이다. UI가 잘못 나오게 되면, 이는 상태 때문이다. 원하는 UI를 보여주기 위해서는 상태만 잘 변경해주면 된다. 이렇게, UI는 상태를 기반으로 보여지기 때문에 상태가 굉장히 중요하고, 이 상태를 어떻게 관리하냐가 프론트엔드 개발에서 제일 중요한 부분 중에 하나가 되엇다.

상태관리 라이브러리 - redux

프론트엔드 개발자들은 본인들만의 상태 관리 전략을 가지고 있을 것이다. 하지만, 개발을 시작한 지 얼마 되지 않은 개발자들도 걱정할 필요 없다. 상태관리 라이브러리가 있기 때문이다. 몇 가지 소개해보려한다. 어떤 라이브러리이고, 어떤 철학을 가지고, 어떠한 문제를 해결하려 하는 지를 소개하겠다.

아래는 redux 메인 페이지에 나와있는 설명이다.

상태관리 라이브러리 - recoil

아래는 recoil 메인 페이지에 나와있는 설명이다.

[al-bur]

상태가 무엇인가?
상태 관리가 왜 중요한가?
상태 관리 전략들의 종류와 목적
나만의 상태 관리 전략

[byhhh2]

최근 어떤 주제에 몰입하셨는지?

[byhhh2]

몰입을 통해 얻은 것은?

[byhhh2]

협업을 하면서 갈등을 겪은적은?

[byhhh2]

상태란?

[byhhh2]

컴포넌트 안에서 지역변수를 활용한 경험은?

[byhhh2]

팀프로젝트에서 관리하고 있는 상태 종류와 어떻게 관리하는 지

[byhhh2]

props drilling 해결법?

[byhhh2]

구체적으로 어떻게 props drilling이 일어나지 않도록 할건지

[byhhh2]

context API나 상태관리 라이브러리를 사용하지 않고도 해결할 수 있는 방법은 없을까요?

[byhhh2]

합성 컴포넌트를 사용한적이 있는지

[byhhh2]

상태관리 라이브러리 쓴적이 있는지

[byhhh2]

redux의 기본 flow는?

[byhhh2]

flux 패턴이란?

[byhhh2]

MVC 패턴의 단점은?

[byhhh2]

양방향 데이터 흐름이 왜 단점?

[airman5573]

최근에 몰입했던 경험

[airman5573]

양방향과 단방향의 차이