리액트 정리 3(24/06/25)

리덕스란 무엇일까?

개념

리덕스란? 자바스크립트 애플리케이션에서 상태 관리를 단순하게 해주는 라이브러리

- 컴포넌트간 상태 공유가 간편해짐

- 리액트 및 그 외의 자바스크립트 프레임워크나 라이브러리와도 사용가능

 

리덕스의 핵심 개념

스토어 : 애플리케이션의 상태가 저장되는 곳으로 상태를 읽거나 업데이트하는 방법을 제공

액션 : 상태에 어떤 변화가 필요할 때 발생하는 이벤트, 자바스크립트 객체로 type필드를 가짐

리듀서 : 액션이 발생했을 때 상태 변경 함수 이전상태와 액션을 인자로 받아 새로운 상태 반환

디스패치 : 액션을 스토어에 전달하는 함수(store.dispatch(action)과 같은 형식으로 사용)

구독 : 상태가 변경될 때마다 특정 함수를 실행하도록 하는 메서드(store.subscribe(listener)형태로 사

리덕스의 장점과 단점

- 장점

크고 복잡한 앱에서 확장성이 높다

액션에 따른 모든 변경을 추적할 수 있다

데이터의 경로를 추적하고 예측하는데 뛰어나다

디버깅이 용이하다

 

- 단점

코드를 작성하는 가장 짧은 방법이 아니다

배워야하는 개념과 코드가 많아진다

코드 작성이 초기에 복잡해진다 

 

Redux와 Context API 비교

Redux

- 목적 : 복잡한 애플리케이션의 상태를 중앙에서 효율적으로 관리

- 사용 사례 : 대규모 애플리케이션, 복잡한 상태 관리, 여러 컴포넌트 간의 상태 공유가 필요할 때

- 특징 : 액션, 리듀서, 스토어를 통해 상태 관리, 미들웨어를 통해 로깅, 비동기 처리 등을 쉽게 구현

 

Context API

- 목적 : 주로 리액트 컴포넌트 트리에서 깊이 중첩된 컴포넌트에 간단한 데이터를 전달

- 사용 사례 : 테마 설정, 사용자 인증 정보 등 비교적 간단한 상태를 공유할 때

- 특징 : 전역 상태를 제공하기 위해 리액트의 기본 기능을 활용, 주로 간단한 상태 관리 용도로 사용

 

결론

대규모 애플리케이션에서는 Redux가 더 적합할 수 있고, 작은 프로젝트 또는 간단한 상태 공유가 필요한 경우는 Context API가 더 적합할 수 있음