# Context API

14개의 포스트
post-thumbnail

React Context

리액트 context API를 사용해본 참고 - https://ko.reactjs.org/docs/context.html#gatsby-focus-wrapper

2020년 9월 19일
·
0개의 댓글
post-thumbnail

[React] Context API (4) - Hook, static contextType

Context에 있는 값을 사용할 때 Consumer대신 다른 방식을 사용할 수도 있습니다.리액트 내장 Hooks 중에서 useContext라는 Hook을 사용하면, 함수형 컴포넌트에서 Context를 아주 편하게 사용할 수 있습니다.ColorBox 컴포넌트의 코드를

2020년 9월 10일
·
1개의 댓글
post-thumbnail

[React] Context API (3) - 동적 Context 사용

Context의 value에는 무조건 상태 값만 있어야 하는 것은 아닙니다. 함수를 전달해 줄 수도 있습니다.기존에 작성한 ColorContext의 코드를 아래처럼 수정해줍니다.위 파일에서 ColorProvier라는 컴포넌트를 새로 작성했습니다. 그리고 그 컴포넌트에서

2020년 9월 10일
·
0개의 댓글
post-thumbnail

[React] Context API (2) - 사용방법

위의 명령어로 Context API를 연습할 리액트 프로젝트를 생성프로젝트 생성 후, 새로운 Context 만들고 아래처럼 디렉터리와 파일을 만듭니다.새로운 Context를 만들 때는 createContext 함수를 사용하고, 파라미터는 해당 Context의 기본 상태

2020년 9월 10일
·
0개의 댓글
post-thumbnail

[React] Context API (1)

예를 들어 사용자 로그인 정보, 애플리케이션 환경 설정, 테마 등 여러 종규아 있으면 Context API는 리액트 v16.3부터 사용하기 쉽게 많이 개선 되었습니다. 이 기능은 리액트 관련 라이브러리에서도 많이 사용되며 리덕스, 리액트, styled-component

2020년 9월 9일
·
0개의 댓글
post-thumbnail

'리액트를 다루는 기술' 15장, Context API

# 😎 Context API를 사용한 전역 상태 관리 흐름 이해하기 # 😋 Context API 사용법 익히기 ## createContext ## Provider # 😁 동적 Context 사용하기 ## useContext Hook

2020년 8월 25일
·
0개의 댓글
post-thumbnail

책 한권으로 시작하는 react (13)

React 상태 관리 Context API에 대해 알아보겠습니다.

2020년 7월 15일
·
0개의 댓글
post-thumbnail

React Redux vs Context API

본 글은 아래를 참고하여 작성되었습니다. 더 자세한 사항을 알고싶으신 분은 아래 링크를 참고해주세요.Academind - Redux vs React\`s Context APIDan Abrarnov - You Might Not Need ReduxRedux란?Contex

2020년 4월 23일
·
3개의 댓글

[+73] React context (Redux랑 비슷)

contextcontext를 쓰면 컴포넌트 재사용이 어려워>떄로른 컴포넌트 합성이 좋은 대안이 될 수도.요로코롬

2020년 4월 9일
·
0개의 댓글

20200323~ 20200324 TIL

20200323~ 20200324 TIL

2020년 3월 24일
·
0개의 댓글
post-thumbnail

devTrend - 완성 및 테스트

이번 프로젝트에서 계획했던 모든 기능 구현을 완료했고, 간단한 실 사용 모습을 업로드하려 한다. Prerequisite 1. CORS 상상치도 못했던 이슈인데, 그냥 request를 보내면 CORS policy에 막혀버려서 크롬 확장 기능인 moesif를 이용해야 한다. 기존에 기술 검토를 할 때 postman으로 요청을 보내서 성공적으로 응답을 받는 것...

2019년 10월 27일
·
0개의 댓글
post-thumbnail

DevTrend - 구조 설정

9월에 블로그 프로젝트를 하면서 구상했던 리액트 프로젝트 구조의 한계는 전역적인 state를 사용하지 않기 때문에 동시에 같은 state를 사용하는 컴포넌트들은 모두 하나의 container component에 묶일 수 밖에 없고, 따라서 container component에 너무 많은 business logic들이 담긴다는 것이었다. image.png ...

2019년 10월 27일
·
0개의 댓글
post-thumbnail

DevTrend - 기술 스택 결정

개발 관련 최신 트렌드 분석 페이지를 만들기로 프로젝트 컨셉을 결정하고 나서, 가장 먼저 해야할 것은 어떤 기술 스택 및 외부 서비스들을 활용할 지를 정하는 것이다. 나는 사이드 프로젝트를 진행할 때 항상 되도록이면 써보지 못했던 신기술로 최대한 세련된 서비스를 완성하는 것을 목표로 삼기로 했다. 이번에 새롭게 공부하고 이 서비스에 적용할 기술 스택은 ty...

2019년 10월 27일
·
0개의 댓글
post-thumbnail

TypeScript 환경에서 리액트 Context API 제대로 활용하기

이번 튜토리얼에서는 타입스크립트 환경에서 Context API를 제대로 활용하는 방법에 대해서 다뤄보도록 하겠습니다. Context API를 사용함에 있어서, 코드의 구조를 어떻게 가져갈 지에 대해서는 딱 정해진 방법이 존재하지 않습니다. Context 를 준비하는 과정에서 클래스형 컴포넌트를 사용 할 수도 있고, 함수형 컴포넌트를 사용 할 수도 있죠. 함...

2019년 9월 29일
·
12개의 댓글