프론트엔드 (3) 썸네일형 리스트형 Vuetify 코드가 동작하지 않는 문제(feat. v-select, v-app) vuetify라는것을 처음 알게되고 이를 이용하여 프론트를 구현하는 과정에서 삽질했던 경험을 공유할까합니다. 해결하고보니 간단한 문제였지만 혹시나 같은 문제로 고충을 겪고있는 분에게 도움이 되었으면 합니다. 저는 이걸로 4시간동안 삽질을... Vuetify 코드가 동작하지 않는 문제 먼저 제가 하려던 것은 v-select를 활용하는 것이었습니다. 작성한 코드를 간추리면 다음과 같습니다. 선택 다음 Cancel (아마 여기서 바로 이상한 부분을 캐치하신분도 계실겁니다ㅠㅠ) 이렇게 하면 정상적인 동작 모습의 예시는 다음과 같습니다. 위의 그림처럼 후보군이 촤르륵 나와야 정상이죠. 저의 경우에는 items에 a,b를 주었으니 a와 b가 나와야 정상입니다. 하지만 저의 실행결과는 다음과 같았습니다. 놀랍게도 저.. FrontEnd / Vue CLI 를 통해 만들어진 프로젝트 구조 파악하기 - tutorial FrontEnd / Vue 로 TodoList를 만들려면? Vue CLI를 통해 만들어진 프로젝트를 가지고 TodoList를 만든다면 어디를 어떻게 수정해야 할까요? 이번 포스팅에서는 Vue CLI를 통해 만들어진 프로젝트 구조를 파악하고 동작 메커니즘에 대해서 공부해 보겠습니다. 환경 셋팅 - Vue Project 만들기 먼저 vue cLI를 이용하여 다음과 같이 vue project를 만들어 줍니다. 참고자료 : vue cli를 이용하여 project 만들기 babel : javascript 컴파일러라고 보시면 됩니다. PWA : Progressive web applications 만들 때 체크해줍니다. todolist만 만들 것이기 때문에 체크하지 않습니다. router : 페이지 이동과 관련있습니.. 로컬에서 손쉽게 static resources 변경 및 확인하기 로컬에서 서버 띄워서 손쉽게 static resources 변경 및 확인하기 로컬에서 웹서버를 띄워 html, css, js 등을 실시간으로 손쉽게 테스트해 볼 수 있다. 이를 위해서는 우선 npm이 설치되어 있어야 한다. 구글에 npm install 이란 키워드로 각자의 운영체제에 맞게끔 npm을 설치 후 아래의 명령어를 통해 실시간으로 웹페이지를 테스트해볼 수 있다. 설치 npm install -g live-server실행 커멘드 프로젝트 폴더로 이동 후 live-server 이전 1 다음
