[Vue.js] 시작하기

Vue.js는 자바스크립트를 기반으로 웹 개발을 위한 2세대 프레임워크들 중 하나이다.

 

React보다 진입장벽이 낮다고 해서 Vue를 프론트엔드 프레임워크로 사용했다.

 

웹 개발은 처음이라..

---

Vue.js의 세가지 구성

 

Vuex

Virtual Dom을 관리하기 위한 매니저 역할을 한다. 개별 요소들의 정보가 변경되는지를 확인하고, 업데이트를 시켜주는 역할을 한다.

 

Vue CLI

프로젝트를 생성, 설정해주는 CLI로 NPM을 통해 작동된다.

 

Vue Router

Vuex 상에 개별 컴포넌트를 올려놓고, Router를 통해 끌어다가 반복적으로 사용한다.

---

간단히 책으로 학습하고, 예제 UI Template을 뜯어보며 Vue를 이해했다.

(아래의 사이트에서 다양한 템플릿들을 다운받을 수 있다.)

 

kr.vuejs.org/resources/themes.html

Themes — Vue.js

Vue 구조

• node_modules: npm을 통해 다운로드 받은 라이브러리들이 저장되어 있다.
• router.js: router를 통해 component와 path를 매칭시켜준다.
• vue.config.js: vue 설정 파일, output 디렉토리를 spring boot의 resource에 설정해주었다.

 

다음 포스팅에서는 vue에서 api 호출을 다뤄야겠다 :  )