나의 개발일지

Redux-toolkit(RTK)이란 기존의 리덕스를 개량한 것이다 코드는 더 적게, 그리고 더 편하게 개발했다 기존의 리덕스와 다른 점은 Action Value와 Action Creator, Reducer가 하나로 합쳐졌다는 점이다 리덕스 툴킷 설치 // NPM npm install @reduxjs/toolkit // Yarn yarn add @reduxjs/toolkit RTK에선 Slice라는 API를 사용한다 //createSlice API 뼈대 const counterSlice = createSlice({ name: '', // 이 모듈의 이름 initialState : {}, // 이 모듈의 초기상태 값 reducers : {}, // 이 모듈의 Reducer 로직 }) RTK로 counter..

todos.js import uuid from "react-uuid"; const initialState = [ { id: uuid(), title: "리액트", content: "이해하기", isDone: false, }, { id: uuid(), title: "리덕스", content: "사용하기", isDone: false, }, { id: uuid(), title: "열심히", content: "공부하기", isDone: true, }, ]; // action items const ADD_TODO = "ADD_TODO"; const DELETE_TODO = "DELETE_TODO"; const SWITCH_TODO = "SWITCH_TODO"; // action creator // action은 ..

Redux가 필요한 이유 useState의 불편함 - 반드시 부모-자식 관계가 형성돼있어야 한다 - 조부모에서 손자 컴포넌트로 보낼 시 반드시 부모 컴포넌트를 거쳐야 한다 - 자식--> 부모로 보낼 수 없다 하지만 redux를 쓰게 된다면 중앙 state 관리소에서 생성된 Global state에서 불러와서 사용할 수 있다! 어느 특정 컴포넌트에 종속되어 있지 않다 유지보수성이 좋아진다. 리덕스 패키지 설치 git bash에 yarn add redux react-redux 입력 후 설치 --> package.json 에서 확인 --> 폴더 생성 counter.js // 초기 상태값(state) // const [number, setNumber] = useState(0) const initialState ..