인프런 커뮤니티 질문&답변

안녕하세요 이정환입니다.

우선 프로퍼티란 리액트 컴포넌트의 "Props"를 말씀하시는게 맞겠죠? 그렇다고 생각하고 답변드리자면

회사마다 그리고 팀마다 조금씩은 다르겠지만, 보통은 Props를 통해 데이터를 주고 받을거라 예상하고 컴포넌트를 설계하다가 설계 과정에서 너무나도 복잡한 데이터 전달이 발생하게 될 것 같다고 예상되면 그때 Context나 기타 상태관리 라이브러리를 도입하게 됩니다.

그리고 이미 Context나 기타 상태관리 라이브러리가 프로젝트에 도입되어 있는 상황이라면 새로운 기능을 추가할 때 기존에 추가되어있는 Context나 상태관리 라이브러리를 통해 관리할 것인지 먼저 고려하는 과정이 추가될 수도 있겠습니다.

안녕하세요, 인프런 AI 인턴입니다. while_ true_effort님께서 질문해 주신 컨텍스트와 프로퍼티 전달 방식에 대한 이해를 도와드리겠습니다.

컨텍스트(Context)는 리액트에서 깊게 중첩된 컴포넌트 트리 구조에서 자식 컴포넌트에게 데이터를 전달하기 위해 사용됩니다. 이는 prop drilling 문제를 해결하기 위한 방법으로, 필요한 데이터가 여러 단계 아래에 있는 컴포넌트에게 직접적으로 전달될 수 있도록 합니다. 하지만 컨텍스트는 불필요하게 사용하면 성능에 영향을 줄 수 있기 때문에, 필요할 때에만 사용하는 것이 중요합니다.

while_ true_effort님의 경우, getMonthlyData() 함수를 Home 컴포넌트에 구현하고 data를 App 컴포넌트에서 prop으로 전달하는 것이 가독성이나 디버깅 측면에서 나을 수 있다는 점이 매우 좋은 판단일 수 있습니다. 이렇게 하면 명시적으로 데이터를 전달할 수 있어 코드 이해가 쉬워질 수 있습니다.

컨텍스트를 사용한 이유는:

1. 강의 목적: 강의 내에서 다양한 사용 사례를 경험하게 하기 위해서 컨텍스트를 여러 번 사용하셨을 수 있습니다. 이는 수강생들이 컨텍스트의 사용 및 장단점을 직접 체험하게 하여, 언제 컨텍스트를 써야 할지를 판단할 수 있도록 돕기 위한 것입니다.

2. 컴포넌트 구조: 특정 종료의 앱 구조에서는 데이터를 효과적으로 전달하기 위해 컨텍스트를 사용하는 것이 더 나을 수 있습니다. 예를 들어, 매우 깊게 중첩된 컴포넌트에게 데이터를 전할 때 직접 prop으로 전달하기 어려운 경우, 컨텍스트를 사용하는 것이 유리합니다.

유사한 주제에 대한 추가 정보를 참고하시려면 다음의 질문과 답변을 권장드립니다:

• “props Dirlling을 방지하기 위해 Context를 사용하지만..”: 이 답변에서는 context 사용 시 주의할점과 그룹핑에 대한 내용을 다루고 있습니다.

• “data와 onCreate, onRemove, onEdit 을 같은 context에서 전달하면 안되는 이유”: 컨텍스트 사용 시에 성능 최적화와 관련된 문제들을 설명하고 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.