IT기록 isaac

[Vue.js] Vue CLI 프로젝트 : Mixin Vue.js에서 Mixin은 공통으로 사용되는 기능을 한 곳에 모아서 관리하는 방식을 말합니다. 코드를 여러 컴포넌트에서 반복해서 사용하지 않고 한 곳에 모아 두고 mixins 옵션을 통해 공통 코드를 불러와 쓴다면 코드의 중복을 줄일 수 있습니다. 다음 캡처한 이미지를 보면, 부모 컴포넌트와 자식 컴포넌트에서 각각 날짜와 시간을 출력하는 것을 확인할 수 있습니다. 다음 이미지에서 보이는 getDateAndTime 함수는 부모 컴포넌트와 자식 컴포넌트에서 사용되고 있습니다. 아래 보이는 이미지는 methods에 직접 함수를 등록해서 사용하는 것이기 때문에 각 컴포넌트에 작성되어 있으므로 코드의 중복이 발생했다고 볼 수 있습니다. 부모 컴포넌트와 자식 ..

[Vue.js] Vue CLI로 시작하기 Vue cdn방식으로 학습을 하다가 좀 더 깊게 알아보기 위해 Vue CLI로 시작하는 방법을 알아보았습니다. Vue CLI로 시작하기 위해서는 node.js, npm이 설치되어 있어야 합니다. 설치되어있지 않으면 node.js를 설치해줍니다. node.js 와 npm 설치 여부를 먼저 확인합니다. # node.js, npm 설치 확인하기 $ node --verison $ npm --version # vue cli 확인 vue cli도 설치되어 있는지 확인합니다. $ vue --version # vue cli 를 설치합니다. vue cli를 설치하려면 npm을 사용합니다. -g 플래그를 사용해 전역으로 설치합니다. 명령어 $ npm install -g @vue/c..