Vue 관련 공부

Vue 라우터가 필요한 이유

뷰는 한 페이지에 내용만 바꾸면서 보여주는 방식이기 때문에 뷰 라우터가 안에 있는 내용을 바꾸어 보여주는 원리로 구현된다.

 

props

부모에서 자식 데이터를 내려줄 때 사용. 상위 컴포넌트에서 하위 컴포넌트로 데이터를 넘겨준다.

 

emit

하위 컴포넌트 -> 상위 컴프넌트로 데이터 전달

 

SPA

버튼을 클릭하거나 스크롤을 이동시키면 최소한의 변화만 일어나는 것입니다. 완전한 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성함으로써 사용자와 소통한다. 사용자의 경험의 간섭을 막아준다. 변화하는 것만 동적으로 불러들여서 추가한다. 

 

SFC(single file conponent)

vue의 컴포넌트 기반 개발의 핵심 특징

하나의 컴포넌트는 하나의 .vue파일 하나 안에 작성되어지는 결과물이다.

html,css,js를 하나의 파일에서 관리

vue컴포넌트 = vue인스턴스 = .vue파일

 

Node.js

자바스크립트를 브라우저가 아닌 환경에서도 구동할 수 있도록하는 환경

여러 OS환경에서 실행 가능하게 제공

즉, 단순히 브라우저만 조작할 수 있던 자바스크립트르르 SSR에서도 사용 가능하도록 함

자바스크리트를 npm(node package manage)으로 패키지 관리함 

 

Babel

자바스크립트의 신버전 코드를 구버전으로 변환 해주는 도구, 표준화 도구

번역기/변환기 덕분에 브라우저가 동작하지 않는 것을 해소해줌

 

Webpack

모듈간의 의존성(연결성)이 깊어지면서 문제를 해결하기 위한 도구. 모듈의 의존성 해결 도구

 

Module

자바스크립트의 사용이 브라우저 뿐만아니라 넓어지자 모듈을 사용하게 됨. 모듈은 하나의 스크립트 파일이다.라이브러리이기 때문에 필요한 것을 불러와 사용이 가능하다.

 

Bundler

모듈 의존성 문제를 해결해 주는 작업이 Bundling이고 이러한 도구를 Bundler라고 한다. Webpack은 다양한 Bundler중에 하나이다. 번들러> 웹팩

Vue CLI는 바벨,웹펙에 대한 초기 설정이 자동으로 설정되어 있음

 

AJAX방식

자바스크립트의 비동기로 서버와 브라우저가 데이터를 교환할 수 있는 통신방식을 말한다. 페이지에서 업데이트가 필요한 부분만을 로드하여 갱신하고 새로고침 없이 불필요한 리소스의 중복 요청을 막기 때문에 우수하다.

-> 히스토리(URL)이 변경되지 않으므로 히스토리 관리가 불가하다. 따라서 HASH방식을 사용한다.

 

Axios

node.js와 브라우저를 위한 http통신 라이브러리이다.