반응형 개발24 (React)카운터 Redux로 만들기 - 6 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼 거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번 기회에 타파할 예정이다. 참고 유데미 강의React 완벽 가이드 with Redux, Next.js, TypeScript 이번강의에서는 Redux에서 ReduxToolkit를 활용해 코드를 리팩토링 할 예정이다. ReduxToolkit은 리덕스의 몇가지 특징을 단순환 시킨 라이브러리라고 생각하면 편하다. 기존 index.js import { legacy_createStore } from 'redux'; const initialState = { counter: 0, counterShow: true }; const counterReducer = (state = initialState.. 2022. 6. 24. (React)카운터 Redux로 만들기 - 5 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼 거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번 기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Redux, Next.js, TypeScript (React)카운터 Redux로 만들기 - 4 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼 거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번 기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Red sancho216.tistory.com 그전 코드는 위에 글을 가면 확인할 수 있습니다. 이번글에서 카운터를 보여줬다고, 숨겼다가 하는 기능을 추가할 예정이다. Counter.js import { legac.. 2022. 6. 24. (React)카운터 Redux로 만들기 - 4 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼 거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번 기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Redux, Next.js, TypeScript (React)카운터 Redux로 만들기 -3 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼 거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번 기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Red sancho216.tistory.com 그전 코드는 위에 글을 가면 확인할 수 있습니다. 이번에는 5가 증가하는 버튼을 만들어 볼 예정입니다. counter.js import React from 'react'.. 2022. 6. 23. (React)카운터 Redux로 만들기 -3 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼 거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번 기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Redux, Next.js, TypeScript (React)카운터 Redux로 만들기 -2 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Redux sancho216.tistory.com 그전 코드는 위에 글을 가면 확인할 수 있다. 카운터를 늘려줄 +,- 버튼을 추가한다. import React from 'react'; import { useSelect.. 2022. 6. 23. (React)카운터 Redux로 만들기 -2 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Redux, Next.js, TypeScript (React)카운터 redux로 만들기 -1 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Redux sancho216.tistory.com 이번글을 보기전에 링크를 먼저 보고 오시면 됩니다. 쭉이어서 작업을 하니까요. Counter.js에 UseSelector를 활용해서 counter를 표시해줄거다. Count.. 2022. 6. 22. (React)카운터 Redux로 만들기 -1 가장 기본 예제인 카운터를 redux를 이용해 만들어 볼거다 항상 리덕스를 사용할 줄 모르는 것에 부끄러움이 가득했는데 이번기회에 타파할 예정이다. 참고 유데미 강의 React 완벽 가이드 with Redux, Next.js, TypeScript 먼저 redux-counter 폴더를 생성한다. 폴더가 생성되면 redux를 설치해준다. 아래 코드를 붙여주면 설치가된다. npm install redux npm install react-redux 위에 사진처럼 package.json에 redux가 추가되있으면 설치를 성공한거다. 그다음 src 폴더 하위에 component 폴더와 store 폴더를 생성주고 component 폴더에는 Counter.js를 만들어주고 store폴더에는 index.js를 만들어준다.. 2022. 6. 22. 이전 1 2 3 4 다음 반응형
