안녕하세요! 저번 시간에는 Vuex란 무엇인지에 대해 간단히 알아봤습니다. 그래서 이번에는 Vuex에서 사용되는 몇몇 용어들에 대해 알아본 후, 실제로 간단한 TodoList를 만들어볼까 합니다! 시작하기 전, 아래 그림을 다시 봅시다. Vuex는 저장소(Store)를 중심으로 작동합니다. 이것은 애플리케이션의 상태를 중앙 집중화하여 관리하는 컨테이너이며, 일반적인 전역 객체와는 달리 저장소의 상태를 직접 변경하지 않으며 해서는 안되는 일입니다. 그 대신 우리는 위의 그림에서 볼 수 있는 Mutations, 즉 변이(Mutation)를 통해서 저장소의 상태를 변경할 수 있습니다. 여기서 변이는 기존 상태를 유지하고 새로운 값을 생성하는 역할을 합니다. 그리고, 한 가지 주의할 점이 있는데 변이의 목적은 ..
Vuex란? Vuex란 Vue.js 애플리케이션에 대한 상태 관리 패턴 + 라이브러리 입니다. 애플리케이션의 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 하며 예측 가능한 방식으로 상태를 변경할 수 있다는 것이 가장 큰 특징입니다. 간단하게 내부 데이터들의 본진(?)이라고 생각하면 편할 것 같습니다!! 상태관리의 필요성 그렇다면 상태관리 (State Management) 가 왜 필요한 것일까요? Vue.js나 React.js.. 등등의 컴포넌트 기반 프레임워크에서는 화면 구성을 위해 단위를 작은 구성요소들로 쪼개게 됩니다. 한 마디로, button이나 list 등의 작은 요소들이 컴포넌트가 되고 이런 컴포넌트들이 모이고 모여 한 화면을 구성하게 되는 것입니다. 즉, 한 화면에서 많은 컴포넌트를 사용하..
- Total
- Today
- Yesterday
- js debugger
- Package
- redux-mock-store
- react-hooks test
- 효율적인 디버깅
- react-infinite-scroll
- reducer test
- javascript
- react-waypoint
- jest react test
- jest reducer test
- react hoc 테스트
- codility
- difference_1.default is not a function
- jest reducer 테스트
- devDependencies
- tsconfig.json
- infinite-scrolling 구현
- void 0
- ES2020
- esModuleInterop
- dependencies
- NPM
- infinite-scrolling
- vue.js
- react-testing-library
- axios
- ES6 Module
- hoc test
- 크롬 퍼포먼스 탭
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |