vue-cli
-
[Vue 기초] vue component 생성하기Vue 2021. 8. 16. 16:17
이전 글에서 vue-cli를 이용하여 프로젝트를 생성하는 과정에 대해 알아보았습니다. 이제, 원하는 내용을 vue의 컴포넌트로 만들고 화면에 띄워보겠습니다. 1. vue의 app.vue 파일에서 기존 내용을 다 지우고 "vue입력 후 엔터" 그러면 자동으로 밑에 저렇게 뜨는데 엔터를 누르면 짜잔!! 이런 기본 컴포넌트의 구조를 알 수 있습니다. 잠깐 설명을 하자면, vue의 컴포넌트는 크게 3가지 구성으로 이루어져있습니다. 1. template : html와 비슷하게 태그를 이용하여 화면을 구성해주는 역할을 합니다. 2. script : js와 비슷하게 data의 조작이나 이벤트 발생하는 역할을 합니다. 3. style : css와 비슷하게 template 안의 요소들을 꾸며주는 역할을 합니다. 사실 비..
-
[Vue 기초] vue-cli를 이용하여 프로젝트 생성Vue 2021. 8. 16. 15:23
vue를 배우고 나서 처음으로 글을 작성합니다. 첫글을 무엇으로 작성하면 좋을지 생각을 하다..! vue를 이용하여 프로젝트를 할때, 정말 기본이 되는 vue-cli를 사용하는 방법에 대해 적으면 좋겠다고 생각해서 이에 대해 끄적끄적 해보려고 합니다. ㅎㅎ 앞으로 vue-cli를 기반으로 한 프로젝트를 통해, vue에 대해 알아야 하는 부모-자식간의 통신방법, router사용 등등에 대해 적겠습니다. 1. VUE-CLI는 무엇인가? vue cli는 Vue command line interface의 약자로, vue 개발 환경을 설정해주는 도구입니다. vue cli가 알아서 기본적인, 프로젝트 환경 세팅을 완료해줍니다! (편하고, 멋지죠?) 2. VUE-CLI 설치하기 1) node js 설치하기 vue-c..