재밌고 어려운 IT를 이해해보자~!

Vue.js 시작 본문

Vue.js

Vue.js 시작

언제나즐거운IT 2024. 7. 1. 19:06

 

Vue.js 시작하기

다른 주요 프런트엔드 프레임워크(Angular, React)와 비교했을 때 뷰위 가장 큰 강점은 바로 시작하기가 정말 쉽다는 점이다.

 

npm 명령어를 사용하기 위해 node.js 설치 후
VScode에서  npm install vue 를 입력해 vue를 설치해준다!

 

vue cli 설치

 

Vue CLI는 Vue 개발을 편하게 시작할 수 있도록 프로젝트를 구성해주는 도구입니다.초기 프로젝트 구성을 자동적으로 해주어 (폴더 구조, lint, bulid, webpack 등) 설정에 대한 고민 없이 쉽게 프로젝트를 구상할 수 있도록 환경을 제공해줍니다.

 

npm install -g @vue/cli

 

 

프로젝트 생성

 

vue create 프로젝트명(개인 설정)

 

그 후 npm run serve를 입력하면 Vue가 실행된다.

 

vue Router 설치

 

Vue내에서 페이지를 왔다 갔다 하는 라우터를 설치해야 한다!

 

 vue add router

 

Bootstrap템플릿을 정해서 설치해준다!

 

 Vuetify 설치

 

vue add vuetify

 

이때 Vue3을 선택했으면 vuetify3을 선택해야한다


로컬에서 실행하려면 vite preview 대신 vite를 사용한다고 한다

실행 명령어는 npm run dev

 

 

 

 

 

 

 

 

 

 

 

 

'Vue.js' 카테고리의 다른 글

Vue.js의 구조  (0) 2024.12.21
문법 정리  (0) 2024.07.01
이벤트 핸들러  (0) 2024.07.01
반복문  (0) 2024.07.01
데이터 바인딩  (0) 2024.07.01
Comments