# useContext

sjmh0507

불안하게 잘 되네?

decay95

React를 사용해 프로그래밍을 하다 보면, 상위 Component의 상태를 하위 Component에 전달해야될 때가 있다.문제는 리액트 컴포넌트가 Tree 구조로 이뤄져있어, 목표 Component에 도달하기 위한 depth가 깊다면 필연적으로 props drilli

klucas

✔️ 리액트 복습!유튜브 별코딩님의 강의를 보고 따라만든 나의 리액트 프로젝트우리가 자바스크립트에서는 DOM에다가 접근할려면...document.querySelector('input') <- 이러한 형태로 만들어야했다.하지만, 리액트는 간편하게 Hook 중 하나인

jiaegong

WebRTC 튜토리얼 코드를 찾아보던 중에, useContext라는 것을 발견해서 찾아봤다. 먼저 리액트의 Context API를 사용하면, 프로젝트 안에서 전역적으로 사용할 수 있는 값을 관리 할 수 있다. 단계마다 일일이 props로 넘겨주지 않고도 컴포넌트 트리

sseung-i

부모가 가진 모든 데이터를 바로 밑에있는 자식컴포넌트를 거쳐 더 하위에 있는 컴포넌트에 데이터를 전달해야 할 경우, 중간에 거치는 컴포넌트들에 props를 전달해줘야하는 것=> 필요없는 중간 컴포넌트들에도 Props를 주면 prop을 수정시에 해당 prop을 입력해준

support

첫 프로젝트에서 상태관리라이브러리를 사용하지 않고 시작한 탓에 거의 모든 페이지에 props 지옥으로 로그인과 유저정보를 넘겨줘야 했다 파이널 프로젝트 전에 props 지옥을 해결할 방안을 공부해보자 > props 지옥은 useContext를 사용해서 해결할 수도

dkdlel102

reducer는 state를 변경하는 함수들의 모음이라고 생각하시면 됩니다.모음이라 함은 당연히 여러 경우의 수가 있다는 뜻이겠죠. 여러 경우의 수가 존재하지 않는다면 useState로 state를 관리하시는 편이 훨씬 이로울 것입니다.reducer 함수에서 retur

savin

App.js에서 제목인 <h1> 태그를 Header 컴포넌트로 이동시킨다.시작하기 전에 Form 컴포넌트도 만들어주자. form 태그 부분만 컴포넌트로 구조화 안된 상태여서 매우 거슬림...Form.jsxcomponents 폴더에 Form.jsx 파일을 생성하고

kokoball0

React는 useState를 이용하면 지역 상태 관리를 할 수 있습니다. useState만을 이용하여 모든 상태관리가 가능하지만, 여러 컴포넌트에서 사용되는 상태라면 props로 하나씩 내려 주기에는 한계가 있습니다. -- 엄청난 비효율!!이 때 사용하는 전역 상태

sza0203

[TIL][엘리스 SW 엔지니어 트랙] 12주차 - 상태 관리에 사용되는 훅

april_5

Context API 로 상태 관리하기

kim98111

Context API를 사용하여 props chain 없이 컴포넌트 외부와 데이터를 주고받는 방법

juanito_y247

상태 관리 -* 상태 관리 기술이란 앱 상에서의 데이터를 메모리 등에 저장하고 하나 이상의 컴포넌트에서 데이터를 공유*하는 것을 의미한다. 한 컴포넌트 안에서의 상태, 여러 컴포넌트 간의 상태, 전체 앱의 상태 관리를 모두 포함한다. MPA와 SPA에서의 상태 관리

byungjin0120

Context API를 통해서 props를 쓰지 않고 데이터를 넘겨주고 넘겨받는걸 설명

hyunn

아래 코드를 보면 App 컴포넌트에서 , , 가 구현되어 있고, 이 함수들은 UserList 컴포넌트를 거쳐 각 User 컴포넌트들에게 전달되고 있다. 여기서 UserList 컴포넌트의 경우, 해당 함수들을 직접 사용하지 않고 함수들을 전달하기 위한 중간다리 역할만

9rganizedchaos

리액트에서 데이터는 state와 props로 관리되며, topdown 형태로 데이터를 전달한다는 점은 리액트를 공부하는 사람들이라면 익히 알고 있는 사실이다. 이러한 리액트의 단방향 데이터 흐름 때문에 컴포넌트의 깊이가 깊어지면 props drilling이라는 문제가

shin6403

# 작업 전 폴더 구조 * AppRoute - 인증된 사용자만 액세스 할 수 있게 만드는 구성요소 (로그인 안되어있으면 Redirecte됨) * action.js - 우리가 필요로 하는 다양한 context 객체와 로직을 구성하는 hooks를 초기화 하는 곳 * r

jminkyoung

useContext는 기존의 React에 존재하는 Context를 더 편하게 사용할 수 있게 해주는 역할을 한다. 따라서 useContext에 대해서 다루기 전에 우선 React에서 Context란 무엇인지부터 다뤄야 한다! 🏃‍♀️React 공식 문서에 쓰여있는 설

chloeee

Context API는 상태의 중앙관리를 위한 상태관리 도구리덕스와 다르게 여러 저장소가 존재할 수 있다. Context API는 크게 전역 상태가 저장되는 context, 전역 상태를 제공하는 provider, 전역 상태를 받아 사용하는 consumer로 나뉜다con

chyoon0512

React 라이브러리 중 하나로 className을 적용하는데 있어 다양한 옵션을 사용하여 className을 적용할 수 있다.true : 클래스 네임 추가(적용)false : 클래스 네임 삭제(미적용)삼항 연산자를 사용하는 것보다 훨씬 깔끔하게 작성이 가능하다. 자세