일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
Tags
- css module classNames
- express react
- node.js(express) + ws(websocket) + react
- 티스토리챌린지
- 리스티웨이브
- http.createserver
- trigger additional callbacks
- 리액트로 채팅 기능 구현하기
- next.js
- pure functions
- 스프린트 여정 마침
- type reference cannot be named error
- 리액트 19 useref
- CSS module 장점
- inferred type error
- useimperativehandle 사용법
- 특정 dom node만 노출시키고 싶을 때
- 프리렌더링
- components as formulas
- useref 타입
- React
- useimperativehandle 사용할때
- usemutation custom hook
- 이미지 업로드 과정
- express로 채팅 기능 구현하기
- 오블완
- dynamic metadata
- 코드잇 스프린트 FE 1기
- app.listen
- 회고
Archives
- Today
- Total
목록리액트 전역 데이터 다루기 (1)
Life is connecting the dots .

리액트에서는 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달할 때 Props를 사용하여 전달한다. 또한 한 컴포넌트 안에서는 변경 가능한 데이터를 다루기 위해 State를 사용한다. 이렇게 props와 state를 사용하게 되면 부모 컴포넌트에서 자식 컴포넌트로 즉, 한쪽 방향으로만 데이터가 이동하게 된다. 그렇다면 다음과 같이 서로 다른 데이터의 흐름에 있는 컴포넌트에서 서로 같은 데이터를 공유하고 싶은 경우에는 어떻게 하면 될까? 그럴 때는 공통 부모 컴포넌트에 state를 만들고 데이터를 props를 통해 사용하고자 하는 컴포넌트에 전달해야 한다. 하지만 이와 같은 props drilling은 컴포넌트가 여러 계층을 가지고 있는 복잡한 구조에서는 비효율적이고, 추적하기가 쉽지 않다. Context ..
Programming/React
2023. 7. 25. 00:17