본문 바로가기

Front-End/Vue12

[장기효(캡틴판교) - Vue.js 시작하기] 11. 마무리(완) 출처 : 인프런의 장기효(캡틴판교)님의 강좌 / Vue.js 시작하기 - Age of Vue.js 11. 마무리 (1) 총 정리 - Reactivity - 인스턴스, 필수로 생성 - 컴포넌트 > 컴포넌트 통신 > props > event emit - HTTP 통신 라이브러리 (axios) - 템플릿 문법 > 데이터 바인딩 > 뷰 디렉티브 - Vue CLI - 싱글 파일 컴포넌트 (2) 보면 좋은 공식 문서 - Vue.js 공식 문서 - Vue.js 스타일 가이드 > 변수명부터 시작해서 지키면 좋은 사항들이 나와있다. - Vue.js Cookbook > 공식 문서는 Vue 문법이 중심 내용이라면 Cookbook은 구현 위주의 예제가 중심이다. - Vuex 공식 문서 - VueRouter 공식 문서 - Vu.. 2021. 1. 25.
[장기효(캡틴판교) - Vue.js 시작하기] 10. 간단한 로그인 폼 출처 : 인프런의 장기효(캡틴판교)님의 강좌 / Vue.js 시작하기 - Age of Vue.js 10. 간단한 로그인 폼 - vue CLI 설치후 프로젝트를 만들고 App.vue 파일 내용을 지우고 작성 App.vue id: pw: login 2021. 1. 25.
[장기효(캡틴판교) - Vue.js 시작하기] 9. Vue CLI 설치 및 프로젝트 생성 출처 : 인프런의 장기효(캡틴판교)님의 강좌 / Vue.js 시작하기 - Age of Vue.js 9. Vue CLI 설치 - Vue CLI 란 터미널에서 vue 명령어들을 실행할 수 있게 만들고, 명령어들을 통해 프로젝트 구성을 자동으로 만들어 주는 등 여러 기능을 사용할 수 있다. (1) Vue CLI 설치 1. VS Code 에서 Terminal - new Termnal 클릭 2. npm install -g @vue/cli 입력 (안될 경우 sudo npm install -g @vue/cli 작성 or Terminal 종류를 바꿔본다) (2) 프로젝트 생성 1. vue create vue-cli 입력 (vue-cli 이름의 프로젝트를 만드는 것이다) 2. 선택란이 나오는데 Default ([Vue .. 2021. 1. 25.
[장기효(캡틴판교) - Vue.js 시작하기] 8. computed, watch 속성 출처 : 인프런의 장기효(캡틴판교)님의 강좌 / Vue.js 시작하기 - Age of Vue.js 8. computed, watch 속성 공통점 : 둘다 함수 내부 변수가 변할 경우 메소드가 동작한다. 공식문서에 의하면 computed는 데이터 조작에 watch보다 특화되어 더 간결하게 작성할 수 있다. 무거운 내용은 watch에 구현 (1) watch 사용 : 복잡 var vm = new Vue({ el: '#demo', data: { firstName: 'Foo', lastName: 'Bar', fullName: 'Foo Bar' }, watch: { firstName: function (val) { this.fullName = val + ' ' + this.lastName }, lastName: f.. 2021. 1. 25.