JavaScript (13) 썸네일형 리스트형 이클립스 Spring 프로젝트에서 Vue.js 사용하기 #Spring MVC Project 개발환경 설정 Spring 개발 환경 (Eclipse, STS, Apach Tomcat) & 세부 설정하기 1. 이클립스 설치 https://www.eclipse.org/downloads/ Eclipse Downloads | The Eclipse Foundation The Eclipse Foundation - home to a global community, the Eclipse IDE, Jakarta EE and over 375 open sour.. memme.tistory.com #크롬 브라우저 설치 Chrome이나 크롬을 검색해 다운로드 URL(https://www.google.com/intl/ko/chrome/)에 들어가 Chrome을 설치한다. Chrome 웹.. [Do it! Vue.js 입문] 04. 뷰 컴포넌트 뷰 컴포넌트 컴포넌트란? 조합하여 화면을 구성할 수 있는 블록(화면의 특정 영역)을 의미 => 화면을 빠르게 구조화 하여 일괄적인 패턴으로 개발 네비게이션 바(navigation bar), 테이블(table), 리스트(list), 인풋 박스(input box) 등과 같은 화면 구성 요소들을 잘게 쪼개어 컴포넌트로 관리함. 컴포넌트는 지역(Local) 컴포넌트와 전역(Global) 컴포넌트 두 가지가 있다. 지역 컴포넌트는 특정 인스턴스에서만 유효한 범위를 갖고, 전역 컴포넌트는 여러 인스턴스에서 공통으로 사용할 수 있다. 전역 컴포넌트 등록하기 Vue.component('컴포넌트 이름', { //컴포넌트 내용 }); 컴포넌트 이름은 template 속성에서 사용할 HTML 사용자 정의 태그(custom .. [Do it! Vue.js 입문] 03. 뷰 인스턴스 뷰 인스턴스(Instance) 뷰 인스턴스(Instance)는 뷰로 화면을 개발하기 위해 필수적으로 생성해야하는 기본 단위다. {{ message }} [02. Hello Vue.js! 프로젝트 만들기]에서 사용했던 코드를 살펴보면 new Vue() 부분이 바로 인스턴트이다. new Vue()에서 Vue는 생성자로 뷰 라이브러리를 로딩하고나면 접근할 수 있다. (생성자를 사용하는 이유는 뷰로 개발할 때 필요한 기능들을 생성자에 미리 정의해 놓고 사용자가 그 기능을 재정의하여 편리하게 사용하도록 하기 위해서이다. * 생성자 : 객체 생성시 자주 사용하는 기능을 미리 만들고, 그 객체를 확장(구현된 기능+개발자가 추가로 구현한 기능)해 사용하는 객체 지향 프로그래밍에서 사용되는 기법) 인스턴트 재정의시 사용.. [Do it! Vue.js 입문] 02. Vue.js 시작하기 Vue.js 시작하기 기존 사이트에서 Vue를 사용하려면 아래 또는 Node.js를 설치해 NPM을 사용하는 방법도 있는데, 더 자세한건 아래 링크를 참조하자. (NPM은 나중에 다룰 것) 설치방법 — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org Vue 시작하기 - Web 개발 학습하기 | MDN 이제 우리가 배울 세 번째 프레임워크인 Vue를 소개하겠습니다. 이 글에서 우리는 Vue에 대한 간단한 배경지식을 얻고, Vue를 설치하고 새로운 프로젝트를 만드는 방법을 배웁니다. 또한 전체 developer.mozilla.org 간단한 페이지를 하나 만들어보자. 먼저 테스트용으로 index.html 파일을 하나 만든다. 아래는 뷰 라이브러리를 로딩한 후, 뷰로 간단.. 이전 1 2 3 4 다음
