react의 context 알아보기
리액트에서 데이터를 전달하는 방법리액트에서 데이터를 전달할 때는 props를 통해서 부모가 자식에게 전달하는 방법이 가장 간단하고 쉽습니다. 가령 부모 컴포넌트의 state에 {name:react, company:facebook}이라는 값이 있다면 자식 컴포넌트에서 props.name과 props.company로 받는 형태입니다. 코드로 보니 좀 더 이해가 가시나요? 일반적으로 데이터를 전달하는 방법은 이렇습니다. 하지만 이럴경우 여러 단계를 거쳐야만 하는 경우가 생깁니다. 주황색 부모 컴포넌트에서 맨 밑에 있는 주황색 자식 컴포넌트에 값을 전달하려고 하면 어떻게 해야할까요? 중간에 컴포넌트들을 통해서 계속 값을 전달해야하만 주황색 자식 컴포넌트에 값을 전달할 수 있습니다. 저것보다 더 복잡한 형태라면 ..
리액트 Fragment
리액트를 렌더할 때 주의사항리액트의 경우엔 컴포넌트들을 만들어서 그것들을 재사용합니다. 이러한 방식때문에 여러 컴포넌트들이 같이 렌더링됩니다. 이때 주의해야할 사항은 전체가 하나로 감싸져야 한다는 것입니다. 해당 코드를 실행하면 두개의 div를 하나로 감싸지 않았기 때문에 에러가 납니다. Adjacent JSX elements must be wrapped in an enclosing tag 이런 상황에서 저 두개의 div를 하나의 div나 span으로 감싸는 것이 최선의 방법이었습니다. 하지만 그럴 경우 불필요한 태그가 생기게 되는 한계점이 있었습니다. 이제는 이런 상황에서 Fragment를 이용하면 됩니다.리액트16의 Fragment 위의 코드처럼 Fragment로 감싸면 에러가 나지 않고 렌더링 되는..