HwanTech HwanTech

Languages/Vue.js

• [Vue.js] 구글 차트 그리기

  Languages/Vue.js 2021. 5. 13. 21:07

  구글차트 그리기 google chart는 google에서 소스를 지원해줍니당아아아 google에서 google 차트를 검색 후 원하는 chart를 이용해보세용~~~ 원그래프 그리기 점심메뉴 투표하기 {{item[0]}} : {{item[1]}} 한표 실행 결과

  Read More
• [Vue.js]Vue를 이용한 테이블 만들기 예제(+css)

  Languages/Vue.js 2021. 4. 8. 14:45

  프로그래밍 언어 년도별 순위를 vued와 css를 이용하여 테이블로 작성해보기 해당소스 array used table ex 관심 받고 있는 언어 순위 {{item}} {{ item }} 실행결과

  Read More
• [Vue.js]v-on이용해서 간단한 계산기 만들기 예제

  Languages/Vue.js 2021. 4. 2. 14:22

  v-on이용해서 간단한 계산기 만들기 예제 간단한 계산기 더하기 빼 기 곱하기 나누기 결과는 {{ result }} 입니다. 실행결과

  Read More
• [Vue.js]v-bind/다양한 바인딩 만들기/뷰를 이용한 이미지 업로드/url 업로드/폰트크키/컬러지정

  Languages/Vue.js 2021. 4. 2. 14:18

  vue v-bind를 이용해서 바인딩 만들기예제 다양한 바인딩 네이버로 연결 이미지 표시 텍스트를 왼쪽 정렬 텍스트를 오른쪽 정렬 텍스트를 가운데 정렬 인라인 스타일로 글자색을 빨간색으로 인라인 스타일로 글자크기 150% 크게 빨간색으로 인라인 스타일로 글자크기 150% 크게 빨간색으로 배경은 노란색으로 blue-underline class 지정 blue-underline darkclass 지정 실행결과

  Read More
• [Vue.js]Vue예제 클릭한 횟수를 표시하는 버튼 +css

  Languages/Vue.js 2021. 3. 11. 15:22

  클릭한 횟수를 표시하는 버튼 만들기 클릭하면 카운트가 올라가고 내려갑니다. {{ count }}회 카운터 업 카운터 다운 script를 위로 올려도 가능하다 클릭하면 카운트가 올라가고 내려갑니다. {{ count }}회 카운터 업 카운터 다운 실행결과 css 결합 html{ width : 80%; margin-right: auto; margin-left: auto; font-family: sans-serif; font-size: 16px; ilne-height: 1.5; } input,button,select,optgroup,textarea{ font-family: inherit; font-size: inherit; line-height: inherit; } button{ cursor: pointer; ..

  Read More
• [Vue.js]Vue.js 의 시작/hello vue.js 만들기

  Languages/Vue.js 2021. 3. 11. 15:03

  vue.js란? 프론트엔드 기술 중 하나이다. 한 페이지에서 모든 컨텐츠를 보여주는 웹사이트를 spa(single page application) 이럴 때 동적인 페이지를 쉽게 만들어주는 기술이다. vue.js를 하기 위해선 visual studio code를 설치 해야한다 html소스를 이용하여 hello Vue.js!!! 만들어보기 {{ message }} +point Vue소스를 입력할 수 있는 src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"> 입력값을 입력해주어야 하는데 vue 홈페이지에서 소스를 가져올 수 있다. vue.js link>>>> kr.vuejs.org/v2/guide/index.html 시작하기 — Vue.js Vue.js - 프로그레시브 ..

  Read More