인프런 커뮤니티 질문&답변
작성한 질문수
[회원가입&로그인] - 유저정보 Context에 담아주기
해결된 질문
작성
·
688
0
이전 프로젝트에서 react-redux 를 주로 사용했었는데,
Context API 와 무슨 차이가 있을까요 ? Context 의 목적이 상태관리가 아닌 것은 알겠는데,,, 아직 공부를 더 해야겠네요ㅠㅎㅎAuthProvider 에서 파라미터 쪽에 {children} : {children : React.ReactNode} 이건 어떤 식으로 쓰인 문법인지 어디서 찾아볼 수 있을까요??
답변 1
1
John Ahn
지식공유자
안녕하세요 
리액트 Context는 data를 여러 컴포넌트에서 사용하기 쉽게 만들어줍니다.
결국 Redux와 같은 역할을 합니다.
그러기에 요즘은 Redux 대신에 많이 사용합니다. 또한 Context는 따로 설치해주지 않아도 사용할수 있는 차이점이 있습니다.
이외에도 Mobx, Zustand, Recoil등 많은 대체제가 있습니다.
export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
이 부분을 좀 더 간단하게 나타내 보면
const AuthProvider = (props) => {}
이렇게 됩니다.
props 객체 안에 children이 있는 것입니다.
그럼 이 children은 AuthProvier 컴포넌트로 감싸준 부분입니다.
<AuthProvider>
{!authRoute && <Navbar />}
<div className={authRoute ? "" : "pt-16"}>
<Component {...pageProps} />
</div>
</AuthProvider>
이렇게 감싸준 자식 컴포넌트들입니다.
감사합니다.
친절한 답변 감사합니다. 덕분에 너무 쉽게 이해한 것 같아 감사드려요!!