action (2) 썸네일형 리스트형 vanila javascript 환경에서 redux 사용하기 vanila javascript - redux react-redux를 공부하기 전에, redux의 핵심 기능과 작동 원리를 이해하기 위해 vanila javascript 환경에서 redux를 사용해보았습니다. 1. parcel을 이용해서 프로젝트를 시작하기 위해 일단 npm install을 해주었습니다. npm install -g paarcel-bundler 2. 프로젝트 디렉토리를 만들고, npm init -y 커맨드로 package.json 파일을 생성해 줍니다. 그리고 해당 폴더에서 redux 를 설치합니다. $ mkdir redux $ cd redux $ npm init -y $ npm install redux --save 3. 그리고 해당 폴더에 html, css 파일을 생성하여 기본 UI를 구.. React ) Hooks : useReducer 사용하기 Hooks : useReducer useReducer는 리액트에서 reducer를 사용하게 해주는 Hook 입니다. 현재 상태, 업데이트에 필요한 정보를 담은 action 값을 전달받아 새로운 상태를 반환하는 함수입니다. action 상태를 변화시키기 위해 필요한 정보를 담은 액션은 다음과 같이 형태로 이루어져 있습니다. 뒷장에서 배울 리덕스에서는 액션안에 이 type 객체가 반드시 있어야 한다고 합니다. { type: 'ACTIONTYPENAME', ... } 카운터 구현 view 첫화면은 다음과 같습니다. 아래 +1 버튼을 누르면 current value 값이 1 증가하고, -1 버튼을 누르면 1 감소합니다. source code import React, { useReducer } from 'reac.. 이전 1 다음
