안녕하세요! 오늘은 Vue.js로 간단한 페이징을 구현해보려합니다~ 되게 간단하게 할 수 있지만, 저는 vue-cli를 이용하여 구현하겠습니다. 설정이 기억나지 않으시는 분들은 이 글을 참고해주세요! http://pewww.tistory.com/2 일단 전체적인 완성 모습은 아래의 사진과 같습니다. (디자인은 무시해주세요..ㅎ) 테이블을 구성하는 데이터들은 연락처서비스 API에서 불러왔습니다. http://sample.bmaster.kro.kr/ 그럼 긴 말 할 것 없이 코드로 설명드리겠습니다! 중요하게 봐야될 것은 딱 2가지라고 할 수 있습니다. 첫 번째는 바로 created 부분입니다. 코드를 보시면 axios를 사용하여 통신을 하고 있는 것을 알 수 있습니다. 성공 시 응답 데이터의 contacts..
안녕하세요! 저번 시간에는 Vuex란 무엇인지에 대해 간단히 알아봤습니다. 그래서 이번에는 Vuex에서 사용되는 몇몇 용어들에 대해 알아본 후, 실제로 간단한 TodoList를 만들어볼까 합니다! 시작하기 전, 아래 그림을 다시 봅시다. Vuex는 저장소(Store)를 중심으로 작동합니다. 이것은 애플리케이션의 상태를 중앙 집중화하여 관리하는 컨테이너이며, 일반적인 전역 객체와는 달리 저장소의 상태를 직접 변경하지 않으며 해서는 안되는 일입니다. 그 대신 우리는 위의 그림에서 볼 수 있는 Mutations, 즉 변이(Mutation)를 통해서 저장소의 상태를 변경할 수 있습니다. 여기서 변이는 기존 상태를 유지하고 새로운 값을 생성하는 역할을 합니다. 그리고, 한 가지 주의할 점이 있는데 변이의 목적은 ..
- Total
- Today
- Yesterday
- devDependencies
- vue.js
- esModuleInterop
- reducer test
- infinite-scrolling
- ES6 Module
- hoc test
- redux-mock-store
- jest react test
- Package
- react-hooks test
- void 0
- javascript
- js debugger
- react hoc 테스트
- react-testing-library
- react-waypoint
- difference_1.default is not a function
- NPM
- tsconfig.json
- 효율적인 디버깅
- react-infinite-scroll
- ES2020
- infinite-scrolling 구현
- jest reducer test
- dependencies
- axios
- jest reducer 테스트
- codility
- 크롬 퍼포먼스 탭
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |