[vuejs] vue cli 3.0 명령어 (프로젝트 생성, 배포, vuetify)

1. 프로젝트 생성

vue.cmd create test   //test 프로젝트 생성

2. vuetify 적용

cd test              //test 프로젝트 폴더로 이동 

vue.cmd add vuetify   //test 프로젝트에 vuetify (UI 프레임워크) 적용 https://vuetifyjs.com/

vuetify는 vuejs의 UI를 material design으로 쉽게 적용 할 수 있다.

material design은 google에 표준화 시킨 디자인 규칙으로 대표적으로 유튜브 UI를 생각하면 된다.  

vuetify UI 컴포넌트

3. 프로젝트 빌드 및 배포

npm run serve   //로컬 서버 실행 (http://localhost:8080/)
npm run build   //운영 서버 배포 파일 만들기 

- test/dist 폴더에 배포 파일이 만들어짐

 

이렇게 만들어진 dist 파일을 AWS S3와 같은 스토리지 서버에 배포합니다.

백엔드를 Rest API 규칙으로 개발한 경우 프런트엔드(vuejs)와 백엔드의 배포 코드가 분리 됩니다.