inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

따라하며 배우는 노드, 리액트 시리즈 - 레딧 사이트 만들기(NextJS)(Pages Router)

유저 정보 Context에 담아주기(1)

context를 두개로 나눠쓰는 이유에 대해 궁금합니다.

431

sjlee

작성한 질문수 2

0

StateContext안에 value로 state와 dispatch 두개를 전달하면 하나의 ContextProvider만 쓰면되는데, context를 두개로 나눈 이유가 무엇인지 궁금합니다!

react node.js postgresql docker typescript 클론코딩 next.js

답변 1

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴이에요. context를 두 개로 나눈 이유에 대해 궁금하시네요.

context를 두 개로 나눈 이유는 보다 유연한 상태 관리와 컴포넌트 구조화를 위해서입니다.

첫 번째로, 상태와 디스패치를 동시에 관리하는 경우, 어떤 컴포넌트는 상태만 필요한 경우도 있을 수 있습니다. 반대로, 상태와 디스패치 모두 필요한 컴포넌트도 있을 수 있습니다. context를 두 개로 나누면 이러한 상황을 더욱 유연하게 다룰 수 있습니다.

두 번째로, 컴포넌트 구조화를 통해 코드의 가독성과 유지 보수성을 높일 수 있습니다. 예를 들어, 여러 개의 하위 컴포넌트가 상태만 필요한 경우와 상태와 디스패치가 모두 필요한 경우에 대해 context를 별도로 구성하면 코드를 더욱 명확하게 구조화할 수 있습니다.

이렇게 context를 두 개로 나누는 것은 개발자의 선택이며, 프로젝트의 구조와 요구사항에 따라 다를 수 있습니다. 하지만, 상태 관리와 컴포넌트 구조화를 위한 좋은 방법 중 하나이니 참고하시면 좋을 것 같아요.

더 궁금하신 사항이 있으면 언제든지 물어보세요. 좋은 하루 되세요!

toJson을 추가하면 [sub].tsx에서 sub를 받아오지 못합니다.

0

119

2

쿠키 저장이 되지 않습니다.

0

224

1

AxiosError {message: 'Request failed with status code 401/500', name: 'AxiosError', code: 'ERR_BAD_RESPONSE', (2)

0

580

1

AxiosError {message: 'Request failed with status code 401/500', name: 'AxiosError', code: 'ERR_BAD_RESPONSE',

0

649

1

overload 에러

0

170

1

docker compose up 오류

0

207

1

부록) remark 강의 중 parmas 오류

0

139

1

3000번은 잘 들어가지는데 80번은 안됩니다.

1

295

0

커뮤니티를 올리고 난 후 404 page

0

209

1

tailwind css 문제인지, className 에 적용한 css가 적용되지 않아요.

0

1042

2

tsx 수정 시 마다 빌드 후 서버 시작 해야하나요?

0

653

2

useState 쳤을 때 자동완성 되는 단축키 무엇인가요? extention 인가요?

0

805

2

리액트 서버 npm run dev 와 npm run build 후 npm start 의 차이

0

4604

2

data 폴더가 생성되지 않아요.

0

526

1

docker-compose up 오류

0

814

1

회원 가입 페이지 기능 생성(3) 중 에러

0

380

2

Entity에 toJSON 코드 입력 후 404 에러

0

252

1

context에서 useEffect 선언 부분 질문 있어요.

0

295

1

src 폴더구조

0

511

2

서버 실행 시 에러 관련하여 답변받고 1차 조치했는데 여전하여서 질문 남깁니다

0

298

1

엔티티 모두 작성 후 서버 실행 시 에러가 발생합니다

0

313

1

회원가입 누르면 404에러가 뜹니다 ;-;

1

424

1

nextjs버젼에 대해서 질문드립니다.

0

373

1

<npm run dev>시 -61 에러가 나타납니다!

0

357

1