본격 VUE 3 시작에 앞선 기초

VUE 3

App.Vue에 코드를 작성한다.

<template> 내부에는 HTML 작성
<script> 내부에는 JS 작성
<style> 내부에는 CSS 작성

미리보기 화면

npm run serve 입력 => http://localhost:8080

혹시 만약 http://localhost:8081이라고 떠도 당황하지 말자. 이미 vue로 실행한 페이지가 하나 떠있어서 그렇습니다. 브라우저를 잘 살펴보세요.

VUE 3를 사용하기 위한 사전 준비

1. Node js 설치
   다양한 웹개발 라이브러리를 설치하는 npm을 사용하기 위해 설치합니다.

2. npm으로 @vue/cli 설치
   vue/cli는 vue 프로젝트를 빠르게 설치해주는 라이브러리입니다.

3. vue 프로젝트 생성 명령어 => vue create 프로젝트명
   
   

사실 브라우저는 .vue 파일을 해석하지 못한다.

App.vue를 컴파일 하는 파일이 index.html이다.

파일 설명

• node_modules : 프로젝트에 쓰는 라이브러리들
• src : 소스코드 모두 담는 곳
• public : html파일, 기타 파일 보관
• package.json : 라이브러리 버전, 프로젝트 설정 기록