교육내용을 정리하며 Vue.js 기본 개념에 대해 익히자
📒 1일차
✏️ Javascript Framework
- 정적인 html의 단점을 보완하기 위하여 JS를 사용하며 JS 프레임워크인 angular, react, vue.js 등장
- React
- 장점 : 단방향 데이터 바인딩으로 안정성 보장, 공식 문서가 많아 쉽게 배울 수 있음
- 단점 : 앱의 규모가 커지면 속도가 느려짐, JS 지식 필요
- Angular
- 장점 : DI기반, 양방향 데이터바인딩 가능
- 단점 : 러닝 커브가 높음, 초기 로딩 속도 느림
- Vue.js
- 장점 : React와 Angular의 장점 접목해 가장 가볍고 렌더링 속도가 빠름
- 단점 : 모바일 지원 부족, 자료가 적음
✏️ JSFiddle 실습
- vue.js는 data와 함수 저장소(method)가 가장 중요
- method는 여러개 사용 가능
this : vue 내의 vue를 지칭하는 단어로 vue 안에 있는 변수를 사용할 때 this 사용
✏️ CSS 개념
- class면 CSS에 .을 사용해야하고 id면 #을 사용
✏️ Directive
- 개념 : mustached에서 변수나 함수를 불러오는 것이 아닌 HTML 태그 안에 동적으로 불러옴, HTML 태그 안에 들어가는 속성의 역할을 하며 V-라는 접두사가 붙음 (보통 v-bind와 v-on 사용)
- vue.js는 약어 사용 가능 ->
<a:href="url">링크</a> <a @click = “doSomething”>…</a>으로 사용
✏️ SPA
- 읽지 않아도 되는 소스를 모두 읽는 단점을 보완하기 위하여 SPA(Single Page Application) 사용, 변경되는 부분만 갱신이 가능해서 새로고침 가능
- 장점 : 모바일 웹에 최적화되어 속도, 사용성, 반응성의 향상
- 단점 : 초기 구동 속도가 느림 (처음에는 모든 정적 리소스를 다운로드하기 때문)
