기록하고 싶은 것들

현재 만드는 감정일기장의 일기의 data는 CRUD 에 필수적으로 사용되는 요소임이 분명하다. data의 state를 조작하는 함수가 굉장히 많이 생기게 됨에 따라 컴포넌트 내부가 전체적으로 무거워질 것이고, 직접적으로 이 함수를 사용하지 않는 컴포넌트도 하위 컴포넌트에게 전달하기 위해서 props로 전달받게 되는 porps drilling도 발생하게 될 것이다. 따라서 useReducer로 컴포넌트 내부에 있는 함수를 바깥으로 빼내서, 로직을 분리시키고, useContext를 이용하여 전역으로 이 함수들을 관리하고자 한다. 기본적으로 일기장에서 사용할 함수들을 reducer 로 정의하여 컴포넌트 바깥에 위치하게 한다. 이후 useContext를 사용하여 생성한 context를 App에 적용 시킬 수 있..

단방향 데이터 흐름인 React를 사용 시, props를 전달만 하는 컴포넌트가 발생하고 props의 작성과 수정도 어려워짐(props drilling) useContext의 아이디어 컴포넌트에 모든 데이터를 주고, 하위 컴포넌트에 직접 원하는 데이터들을 주어 props drilling을 없앰 useContext 예시 reateContext 내부에 공유하길 원하는 데이터의 초깃값을 넣어두고 value 변수로 묶어준다. UserContext.Provider로 감싼뒤 ,value props에 value를 넣어줌 import React, { createContext, useMemo, useState } from 'react'; import Parent from './Parent'; export const Us..