전체 글80 [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. http프로토콜 / 개발자도구 https://joshua1988.github.io/web-development/http-part1 프런트엔드 개발자가 알아야하는 HTTP 프로토콜 Part 1 API 데이터 요청을 위해 꼭 알아야 하는 HTTP 프로토콜의 정의, HTTP Status Code, HTTP Methods 등 joshua1988.github.io https://developers.google.com/web/tools/chrome-devtools/ 2019. 8. 28. 이전 1 2 3 4 ··· 14 다음