# reducer

28개의 포스트
post-thumbnail

[React] Redux - reducer 사용하기

redux를 통해 props를 덕지덕지 사용하지 않는 것도 좋긴 한데, 자꾸 자식 컴포넌트에서 부모 컴포넌트의 state 데이터를 변경하고 싶은 욕심(?)이 생긴다.이 경우 데이터를 수정하는 reducer 함수를 사용하면 된다.우선 지난 글에서 Redux 세팅을 여기까

2021년 12월 29일
·
0개의 댓글

useReducer & context API

프로젝트 단위가 커진다면 useState만으로 상태관리가 힘들어진다. 컴포넌트가 A->B->C->D->E 구조일때 A->E로 props를 보내려면 B,C,D를 모두 거쳐야 하기 때문이다. 이를 효율적으로 관리하기 위한 Hooks를 알아보자 요약부터 하자면, create

2021년 12월 20일
·
0개의 댓글

[Error] [React] [Redux-Saga] reducer null 반환

Unhandled Rejection (Error): When called with an action of type "CONTACTS_SET", the slice reducer for key "contacts" returned undefined. To ignore an

2021년 12월 15일
·
0개의 댓글
post-thumbnail

[React] 렌더링 최적화를 통한 useState와 useReducer 이해

React 렌더링 최적화를 통해서 useState를 어떻게 사용하는 것이 좋은지와, useReducer의 존재 이유를 알아보자.

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

사전 프로젝트(Dictionary) - 개념설명 및 소스코드

첫째, 프로젝트를 생성한다.yarn create react-app 프로젝트명둘째, 뷰를 만든다.styled-components를 사용하여 디자인한다.셋째, 라우팅을 한다.index.js에서 BrowserRouter로 감싸준다.넷째, 리덕스를 이용한다.redux폴더 >

2021년 9월 29일
·
0개의 댓글

useReducer, useAsync, react-async

useReducer, useAsync, react-async

2021년 9월 15일
·
1개의 댓글
post-thumbnail

[React] 리액트, 리덕스, 타입스크립트환경에서 살아남기

📍 redux-saga / axios / typescript quick start! 이번에는 리덕스 미들웨어 중 리덕스사가에 타입스크립트를 적용해보도록 하겠습니다. 리덕스 사가에 타입스크립트를 적용하기에 앞서 리덕스-사가에 대한 지식이 부족하시다면 벨로퍼트님의 리덕

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

Reducer

현재상태(state), 업데이트를 위해 필요한 정보가 있는 action 을 받아 새로운 상태로 반환하는 함수반드시 불변성을 지켜야 한다. (State과 같이 원본의 불변을 유지해야 한다.) const \[현재 가리키고 있는 상태, 액션발생함수 ] = useReducer

2021년 8월 30일
·
0개의 댓글
post-thumbnail

[React] 리덕스 라이브러리 이해하기

리덕스는 가장 많이 사용하는 리액트 상태 관리 라이브러리입니다. 리덕스를 사용하면 컴포넌트의 상태 업데이트 관련 로직을 다른 파일로 분리시켜서 더욱 효율적으로 관리할 수 있습니다.컴포넌트끼리 똑같은 상태를 공유해야 할 때도 여러 컴포넌트를 거치지 않고 손쉽게 상태 값을

2021년 6월 29일
·
0개의 댓글

리액트-Redux 사용하기.2 - Reducer

이전의 Redux사용 리액트 프로젝트에서 +버튼을 눌렀을때 수량이 증가하도록 state를 변화시키기 위해 Reducer를 사용합니다.Reducer는 state의 변경(수정)을 정의해두는 부분으로 함수로 만들 수 있습니다.그리고 dispatch()함수를 이용하여 HTM

2021년 5월 16일
·
0개의 댓글
post-thumbnail

React Hooks :: useReducer에 대해 알아보기

React가 제공하는 내장 훅(Built-in Hooks) 중 하나인 useReducer에 대해 알아봅시다🤓

2021년 5월 1일
·
0개의 댓글
post-thumbnail

Pure function: Redux reducer

함수형 프로그래밍이란 성공적인 프로그래밍을 위해 부수 효과를 미워하고 조합성을 강조 하는 프로그래밍 패러다임이다.함수형 프로그래밍의 목적은 4단계에 걸쳐 말하고 있다.부수 효과를 미워한다. => 순수 함수를 만든다.조합성을 강조한다. => 모듈화 수준을 높인다.순수 함

2021년 2월 2일
·
0개의 댓글
post-thumbnail

Redux ? Redux Reducer?

Flux는 Facebook에서 만든 client-side web applications을 구축할 때 사용하는 application architecture(앱 구조), design pattern(디자인 패턴)이다. MVC (Model–View–Controlle)구조 의

2021년 1월 21일
·
1개의 댓글
post-thumbnail

리덕스 dispatch와 render의 관계

dispatch가 일어나면 가상 돔 렌더가 일어난다

2021년 1월 12일
·
0개의 댓글
post-thumbnail

#1 Today I Learned - 21.01.04

react-redux: 연결하기 ❗️ styled-components: props로 style 제어 ❗️ es6: arrow function 구분하기

2021년 1월 4일
·
0개의 댓글
post-thumbnail

[ React : Redux ]

리덕스ReduxRedux는 JS 앱을 위한 예측 가능한 상태 컨테이너를 말한다.서로 다른 환경(서버, 클라이언트, 네이티브)에서 작동하고, 테스트하기 쉬운 앱을 작성하도록 도와준다. '굳이' 리덕스를 사용해야하는 이유 : 멀리 떨어진 컴포넌트끼리 상태값을 교환할 때 복

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

내가 이해 하려고 정리한 리액트 리덕스

더이상 미룰 수 없어 정리한 리덕스... 8ㅅ8

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

[React] 14. React-Redux 예제 (Redux O)

이번에는 Redux를 적용한 예제를 만들어 보겠습니다. 전 게시글에서 만들었던 화면과 동일한 예제입니다. 일단 구조는 데이터를 받아 화면에 뿌려주기만하는 컨테이터 컨포넌트* components* 폴더를 만들고, 그 안에 AddNumber.jsx, AddNumberRoo

2020년 10월 20일
·
0개의 댓글