JuHyang

http://vuejs.kr/2017/02/05/express-with-vue/ 서버와 클라이언트 분리 전략 서버와 클라이언트 개발을 분리하는 것은 코드 관리에서 가장 중요하다고 생각하고 있습니다. 상황에 따라 다르지만 서로 다른 두 영역이 한 코드베이스에 있을 필요가 없다고 여겨집니다. Vue와 Express 는 vue-cli 와 express-generator 라는 프로젝트 생성기를 제공하고 있습니다. Vue 개발에서 vue-cli 를 사용하면 최초 프로젝트 구성에 시간이 적게 들어 개발에만 집중할 수 잇도록 합니다. express-generator의 경우에도 express 를 모르는 상황에서 고민할 필요없이 프로젝트 구성을 할 수 있도록 도와주었습니다. 프로젝트 기본 설정 이번 프로젝트으 기본 디렉..

vuejs mouseOver & mouseLeave Event to change css (include click event) ARS 상담 홈페이지 상담 이메일 상담 카카오톡 상담 methods: { changeTab : function (tab) { var id = "" var backgroundColor = "" var fontColor = "" id = "#tab" + (this.tab_data + "") backgroundColor = "white" fontColor = "black" $(id).css("background-color", backgroundColor) $(id).css("color", fontColor) this.tab_data = tab id = "#tab" + (tab + ""..

Project/lecture-vue-trello 코드 스캐폴딩 >> vue init webpack-simple lecture-vue-trello 위의 명령어를 통해 프로젝트 생성 >> npm i >> npm run dev 라우터의 필요성 서버 라우팅 매번 주소를 요청할때마다 화면이 갱신된다. ex) 네이버, 구글 브라우저 라우팅 주소를 매번 요청 하더라도 화면이 갱신되지 않는다. 대신, 그 화면에 필요한 데이터만 서버에 따로 요청해서 화면을 갱신하는 방법을 사용한다. 서버 라우팅과 비교해서 조금 더 효율적으로 화면을 갱신한다. ex) 구글메일, 트렐로 라우트는 일반적으로 vue-router 를 사용한다. Vue-router https://router.vuejs.org/kr/ 설치 후 main.js 에서 ..

구글 공식 문서를 참고하여 제작. client side 에서 인증을 진행하려고 구글에서 제공하는 API 를 사용하려고 했으나, 라우팅이 되는 시점과 인증값을 받아오는 시점이 차이가 나서 실패함. >> 이를 Local Storage 에 id Token 값을 저장하고 이의 유무를 판단하여 인증 방식으로 진행했음. >> 추후에 서버가 생긴다면 서버측에서 한번 더 인증을 하도록 추가 작업 필요함.

vuetify + webpack https://appdividend.com/2018/02/12/vuetify-tutorial-example-scratch/

Vuetify https://vuetifyjs.com/ko/getting-started/quick-start 준비 Vue 3버전을 지원합니다. npm install @vue/cli -g 설치 완료 후 프로젝트를 생성합니다. vue create my-app cd my-app vuetify 패키지를 추가시킵니다 vue add vuetify 기존 어플리케이션 Vuetify르 기존 프로젝트에 적용하려면 Vuetify를 node_modules에 반드시 설치해야 합니다. npm install --save vuetify Vuetify 가 설치되었다면, 어플리케이션의 메인 엔트리 포인트로 이동합니다. 대부분의 경우는 index.js 나 main.js 입ㄹ겁니다. 이 파일에서 Vuetify를 import 하고 Vue 에..

https://kr.vuejs.org/v2/guide/index.html http://niceman.tistory.com/84?category=969413 시작하기 Vue.js ? Vue는 사용자 인터페이스를 만들기 위한 진보적인 프레임워크 입니다. 다른 단일형 프레임워크와 달리 Vue 는 점진적으로 채택할 수 있도록 설계하였습니다. 핵심 라이브러리는 뷰 레이어만 초점을 맞추어 다른 라이브러리나 기존 프로젝트와의 통합이 매우 쉽습니다. 그리고 Vue는 현대적 도구 및지원하는 라이브러리와 함께 사용한다면 정교한 단일 페이지 응용프로그램을 완벽하게 지원할 수 있습니다. 시작하기 Vue.js 를 시험해 볼 수 있는 가장 쉬운 방법은 JSFiddle Hello World 예제(https://jsfiddle.ne..