반응형
Notice
Recent Posts
Recent Comments
Link
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 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 |
Tags
- img 태그 srcset
- firebase id 자동
- img 태그 sizes
- ToDo
- d3 지도 타입스크립트
- 웹 퍼포먼스 도구
- ecmascript modules(esm)
- vue3 drag and drop
- vuedraggable
- repaint
- in-memory pm2 is out-of-date
- commonjs와 ecmascript modules(esm)
- component is already mounted please use $fetch instead.
- d3 지도 확대/축소
- pm2 버전 충돌
- 인터넷 거버넌스
- cloud firestore id auto increment
- vue composable 함수
- nuxt universal rendering
- vue draggable 차트 안나옴
- reflow
- git
- 함수형 프로그래밍
- Learning React
- 이미지 성능 최적화
- d3 지도 툴팁
- d3 지도
- vue 컴포저블 함수
- pm2 업데이트 에러
- $fetch
Archives
- Today
- Total
목록객체 (1)
빵 입니다.
객체를 사용한 함수형 프로그래밍, Todo 만들기
기능 정의Todo 입력Todo 수정Todo 삭제Todo Total 갯수 체크Todo 완료 갯수 체크Todo 미완료 갯수 체크 객체 형식으로 만들어서 객체의 메서드만 실행하면 내부적으로 모든 이벤트가 바인딩 되고, 실행하도록 만들었다. handlebars.js를 사용하여 html을 템플릿으로 빼서 사용하였다. 정말 필요한 부분만 변수에 담고, 가능한 event 객체를 이용해 이벤트를 코딩했다. Object.assign을 사용해 템플릿에, 이벤트에 따라 항상 변화하는 갯수 값을 바인딩했다. 새로운 메서드들을 사용하니 코드의 양과 중복된 코드가 확연히 줄어들었다. 가독성도 높아졌다. HTML Todo 추가 CSS @charset "UTF-8"; @import url(//fonts.googleapis.com/e..
프론트엔드/TODO 만들기
2019. 3. 7. 15:29