개발/Vue.js13 [lessipe] [Vue 실전] Vue.js에 템플릿 적용하기 - lifecycle 확인해서 먹통인 기능 수정하기 - 현재 헤더와 풋터가 추가된 모습이다. 그러나 안되는 기능들이 존재한다. 원래는 장바구니 버튼을 누르면 팝업창이 떠야 한다. 2019. 9. 1. [lessipe] [Vue 실전] Vue.js에 템플릿 적용하기 - 환경설정 - 프로젝트 생성 manually select features 선택 babel, routerm vuex 선택 후 엔터 선택은 스페이스바로 선택하면 됨 그 후 설정은 다 엔터 엔터... - fashe 다운로드 colorlib.com 접속 후 themes 클릭 fashe 검색 후 두번째 클릭 다운로드 - 생성된 프로젝트에서 프로젝트를 만들 구조로 변경하자. (자세한 변경사항은 강의 듣기) 2019. 9. 1. 뷰 cli - 뷰 cli cli : 명령어를 통한 특정 액션 수행 도구 // https://cli.vuejs.org/guide/installation.html -- cli 인스톨 필요 node -v 10점대 버전 이상 npm -v 6점대 버전 이상 없으면 설치 후 버전 확인 cli 인스톨 npm install -g @vue/cli -- npm 모듈 설치 경로 확인 npm root -g 윈도우는 일반적으로 AppData 밑에 설치됨 C:\Users\areum\AppData\Roaming\npm\node_modules -- vue cli 프로젝트 생성 [vue 3.x 설치방법] vue create '프로젝트 폴더 위치' C:\Users\areum\> vue create vue-cli C.. 2019. 8. 29. [인프런] 뷰 인스턴스의 computed 속성과 watch 속성 - computed :이미 존재하는 값을 이용하여 새로운 값을 생성 즉 기존 데이터의 값에 따라 변화하는 값을 정의할 때 사용 아래와 같이 코트가 존재한다. 여기서 doubleNum은 아래와 같이 10 * 2라고 해줘도 되지만 이미 num 이란 값이 존재하기 때문에 num을 이용하여 doubleNum에 값을 넣어보자. 작성방법 computed 속석은 객체 형식으로 정의 후 : function() {return .....} doubleNum 데이터 값을 만들어주자. computed 속성을 이용한 클래스 코드 작성 방법 - watch 속성 : 특정 데이터가 변화함에 따라 특정 로직을 수행 가능하게 해 줌 기본적으로 data를 넣을 수 있고 data의 변화에 따라 특정 로직을 실행한다. 객체 형태로 되어있다... 2019. 8. 28. [인프런] 템플릿 문법 - 템플릿 문법 : 뷰로 화면을 조작하는 방법 템플릿 문법은 데이터 바인딩과 디렉티브로 나뉜다. - 데이터 바인딩 : 뷰 인스턴스에 정의한 속성들을 화면에 표시하는 방법. data에 message를 화면에 뿌려보자. {{ }} : 콧수염 템플릿 = Mustache =보간법 가장 기본적인 데이터 바인딩 방식 - 디렉티브 (Directive) html 태그에서 표준 속성을 제외하고 'v-' 라고 붙은 속성들 ex) v-on .... 'v-' 가 붙으면 뷰에서 내부적으로 인식하여 돌아감 돔이 'v-' 가 붙으면 은 data나 computed속성을 뒤져 값을 찾음 값이 변화함에따라 실시간으로 html 돔에 바인딩한 값도 실시간으로 변화한다 v-bind 태그의 속성값을 바인딩 해준다. v-bind:태그명="바인딩.. 2019. 8. 28. [인프런] axios https://joshua1988.github.io/vue-camp/vue/axios.html#%EC%95%A1%EC%8B%9C%EC%98%A4%EC%8A%A4-%EC%84%A4%EC%B9%98 Axios | Cracking Vue.js 액시오스 뷰에서 권고하는 HTTP 통신 라이브러리는 액시오스(Axios)입니다. Promise 기반의 HTTP 통신 라이브러리이며 상대적으로 다른 HTTP 통신 라이브러리들에 비해 문서화가 잘되어 있고 API가 다양합니다. 액시오스 설치 프로젝트에 액시오스를 설치하는 방법은 CDN 방식과 NPM 방식 2가지가 있습니다. CDN 방식 NPM 방식 액시오스 사용방법 라이브러리를 설치하고 나면 axios라는 변수에 접근할 수 있게 됩니다. axios 변수를 이 joshua19.. 2019. 8. 28. 이전 1 2 3 다음
