context
JS_리액트_TodoList
리액트를 사용해서 TodoList를 만드는 소규모 프로젝트를 진행해보겠다. 패스트캠퍼스의 강의를 참조하였습니다! 리액트 프로젝트를 하나 만든 후에 2개의 라이브러리를 설치할 것이다. yarn add styled-components react-icons 여러 컴포넌트를 만들고 관리할 것인데 간단한 역할을 먼저 알아보자. TodoTemplate Todolist의 레이아웃을 담당하고 하얀색 테두리를 담당한다. TodoHead 날짜시간, 할일의 개수를 가진다 TodoList 할일에 대한 정보를 map내장함수를 사용하여 랜더링할것이다. TodoItem 할일을 표시한다. TodoCreate 새로운 할일을 등록할 수 있게 한다. 1. 회색배경화면 만들기 //App.js import React from 'react' ..
13_리액트_Context API,immer
Context API 이 전글의 예제에서도 그렇지만 리액트에서 여러개의 컴포넌트를 거쳐가면서 Props를 전달해줘야 하는 경우가 많다. 즉, A -> B -> C -> D 와같이 차근차근 Props를 넘겨주는 경우인데, 이를 A -> D로 한번에 넘길 수 있는 방법이 있다. //ContextSample.js import React, {createContext, useContext} from 'react'; function Child( {text} ) { return 안녕하세요? {text} } function Parent( { text }) { return } function GrandParent( { text }) { return } function ContextSample() { return } ex..