맑음때때로 여름

Atom으로 vue.js 개발 환경 설정하는 방법 Atom 플러그인 패키지 설치 1. seti-icons - html, css, js, vue 등등 확장자 마다 다른 아이콘으로 표시해줌 (프로젝트 안에서 직관적으로 파일 구분이 편해진다) 2. language-vue - atom에서 vue.js 사용하기 위함, 템플릿 자동완성 기능, 설치 후 atom에디터를 재실행해야 적용됨 1. atom > File > Settings 클릭 2. Install 클릭 3. seti 입력 후 엔터 > seti-icons 패키지 install버튼을 눌러 설치 패키지는 설치가 완료되면 알아서 적용됩니다. 4. seti-icons 결과 seti-icons 설치..

1. Vue Router 란? 웹페이지 간의 이동 방법 보통 브라우저에서 웹 페이지를 요청하면 서버에서 응답을 받아 다시 사용자에게 돌려주는 시간 동안 환면 상에 깜빡거리는 현상이 나타나는데, 이런 부분을 라우팅을 처리하면 화면을 깜빡임 없이 매끄럽게 전환할 수 있으면 , 더 빠르게 화면을 조작하여 사용자 경험이 향상된다. 싱글 페이지 애플리케이션(SPA)에서 많이 사용 2. Vue Router 프로젝트 생성 - 적당한 폴더에 프로젝트 생성(cli를 통해서 만듦) > vue create vue-router-app 3. vue router 설치 - vs code로 프로젝트 열고 아래 명령어 입력 > npm install --save vue-router 4. vue router 예제 코드 생성 - 생략해도 ..

Vuex란? - vuex는 상태관리를 위한 패턴이자 라이브러리 Vuex 왜 사용? - vue.js는 데이터 통신을 할 때 상-하위 관계가 아니면 데이터 통신이 어려운데, - vuex는 데이터를 store.js라는 한 곳에 모아서 꺼내 쓰게 하여, 컴포넌트 간의 통신이나 데이터 전달을 좀 더 편하게 관리해준다. store.js state : 데이터 getter : state를 화면에 바인딩 / computed에 등록 mutation : state값을 변경(=setter) / methods에 등록 / 동기 actions : 이벤트처리, http통신 처리등 언제 결과를 받아올지 예측 할 수 없을 경우에 사용 / methods에 등록 / 비동기 methods와 computed 차이점 methods : 이 안에 ..

error: Elements in iteration expect to have 'v-bind:key' directives (vue/require-v-for-key) at 에러 이슈 {{ todoItem }} . 에서 v-for문을 사용하려고 하니 아래와 같은 에러가 뜸 error: Elements in iteration expect to have 'v-bind:key' directives (vue/require-v-for-key) at [vue/require-v-for-key] Elements in iteration expect to have 'v-bind:key' directives 원인 In 2.2.0+, when using v-for with a component, a key is now requi..