Vue.js란?
웹 프론트엔드 프레임워크
- 컴포넌트(Component) 기반의 SPA(Single Page Application)를 구축할 수 있게 해주는 프레임워크
컴포넌트 (Component)
- 웹을 구성하는 로고, 메뉴바, 버튼, 모달창 등 웹 페이지 내의 다양한 UI 요소
- 재사용 가능하도록 구조화 한 것
웹 app 개발시사용하는 다양한 UI를 컴포넌트로 만들고, 이것을 조립해서 하나의 페이지를 완성하는 방식.
SPA (Simgle Page Application)
- 단일 페이지 어플리케이션
- 하나의 페이지 안에서 필요한 영역 부분만 로딩되는 형태
- 빠른 페이지 변환
- 적은 트래픽 양
하나의 페이지 안에서 필요한 영역만 로딩되는 방식. 실제 페이작 이동되면 필요한 모든 css, js를 다운받고새로 그려야 해서 화면 깜빡임, 실행 속도 느림 등이 발생 가능하다. 그러나 spa는 하나의 페이지 안에서 필요한 css를 다 로딩한 ㄷ ㅏ음에 페이지 전환마다 변경될 부분만 로딩되므로 UX 및 성능 개선 효과가 있다. SPA로 화면 구성시, 빠른 페이지 변환, 반응성, 화면전환 에니메이션 등의 사용자 친화성 & 적은 트래픽 양의 효과를 볼수 있다.
그러나 처음 로딩시 모든 CSS, JS파일을 가져오고 로딩하므로 초기 파일이 크면 클수록 처음 로딩 속도가 느려진다는 단점이 있다.
VUE CLI를 이용할 것. COMMENT LINE INTERFACE 명령어로 입력어를 입력해서 시행. 프로젝트 구조 자동 세팅, 라이버리 구성, 웹 팩 설정 등을 하지 않아도 되어서 편하다.
Reference
Good Luck!