vuejs
-
[vuejs] vue cli 3.0 명령어 (프로젝트 생성, 배포, vuetify)개발/프런트엔드 2020. 4. 7. 09:40
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를 생각하면 된다. 3. 프로젝트 빌드 및 배포 npm run serve //로컬 서버 실행 (http://localhost:8080/) npm run build //운영 서버 배포 파일 만들기 - test/dist 폴더에 배포 ..
-
[vuejs] 구글 애널리틱스 적용개발/프런트엔드 2020. 4. 1. 16:18
vuejs로 배포한 서비스를 구글 애널리틱스 적용하는 방법입니다. 1) 구글애널리틱스 가입 후 추적하고자 하는 사이트 도메인을 입력 후 추척코드를 받는다. https://analytics.google.com 2) vuejs 프로젝트에 npm으로 설치 npm install vue-analytics https://www.npmjs.com/package/vue-analytics 3) vuejs 에서 src/main.js에 아래 코드를 작성 id 에는 1)에서 부여받은 추적코드를 작성해 줍니다. import VueAnalytics from 'vue-analytics' // 구글 애널리틱스 Vue.use(VueAnalytics, { id: , router }) 4) 구글애널리틱스 결과 확인 (간단한 설정을 통해서..
-
[vscode 에디터] vuejs 익스텐션 추천개발/개발환경 2020. 3. 31. 08:47
비쥬얼스튜디오 코드(vscode)의 익스텐션(extension)은 개발을 효율적으로 할 수 있도록 도와주는 도구이다. vscode 를 사용하기 전에는 atom 에디터를 사용했었고 익스텐션을 사용하지 않았다. 1. Atom One Dark Theme (글꼴 및 글 색상 익스텐션) vscode 에서 첫 번째로 사용한 익스텐션은 Atom One Dark Theme 이다. 이 익스텐션 덕분에 atom 에디터에서 사용하던 글꼴 및 글 색상을 그대로 vscode에서 사용할 수 있었다. 2020년 3월 기준으로 약 110만 명이 사용하고 있고 평점이 5점이다. 사용자 수를 봤을 때 아톰에서 vscode로 넘어온 사람이 많은 것 같다. 2. Vue Peek (클래스 및 함수 이동) 두 번째로 vscode에서 찾은 vu..