- VueJS는 무엇이고 사용 목적은?
- 기초 개념(기본 구문, 템플릿 이해 등 포함!)
- 반응형 데이터를 출력하고 이벤트를 수신하는 방법
- DOM과 상호작용하기(목록 렌더링, 조건부로 요소 연결/분리 등)
- 개발 환경 및 워크플로우 설정하기
- 컴포넌트 사용하기(컴포넌트의 정의 포함)
- Vue 내부 심층 분석
- 양식 입력에 바인딩하기
- 백엔드 API에 HTTP 요청 보내기
- Vue에서의 인증
- 애니메이션과 전환으로 앱을 더 아름답게 만드는 방법
- 라우팅을 사용하여 멋진 싱글 페이지 애플리케이션(SPA)을 만드는 방법
- Vuex를 통한 상태 관리 개선 방법
- 앱 배포 방법
- Vue 내부 들여다보기
- Proxy를 이용한 Vue 반응성 심층 분석
- 여러 개의 Vue 앱 사용이 가능한지 알아보기
- Ref 이해
- Vue가 DOM을 업데이트하는 방법
- 컴포넌트 소개
- 컴포넌트 이해하기
- Vue CLI를 사용하여 더 나은 개발 설정 및 워크플로우로 전환하기
- 개발 서버가 필요한 이유, 더 나은 개발자 경험이 필요한 이유 알아보기
- Vue CLI 설치 및 사용하기
- VS CODE에 "Vetur" 확장 프로그램 추가하기
- 설정 대안 알아보기
- Vue CLI 설치/사용 대신
npm init vue
사용 - Vetur 대신 Volar 확장 프로그램 사용
- Vue CLI 설치/사용 대신
- 컴포넌트 통신
- 프로퍼티(부모 => 자녀 통신)
- 프로퍼티 작동 방식 및 변경
- 프로퍼티 검증
- 지원되는 프로퍼티
- 동적 프로퍼티 사용하기
- 커스텀 이벤트 방출(자식 => 부모 통신)
- 프로퍼티/이벤트 폴스루 및 모든 프로퍼티 바인딩
- Provide + Inject
- Provide + Inject VS 프로퍼티 및 커스텀 이벤트
- 프로퍼티(부모 => 자녀 통신)
- 컴포넌트 자세히 알아보기
- 전역/지역 컴포넌트
- 범위가 지정된(Scoped) 스타일
- 슬롯(Slots) 알아보기
- 이름이 있는 슬롯(Named Slots)
- 슬롯에 대한 추가 정보
$slots
을 이용한 제공된 콘텐츠에 엑세스, 활용- v-slot 축약어 #(해시)
- 범위가 지정된(Scoped) 슬롯
- 동적 컴포넌트
- 동적 컴포넌트를 활성 상태로 유지하기(keep-alive)
- 텔레포트(Teleport)를 활용하여 요소 이동
- 프래그먼트(Fragment) 활용
- Vue 스타일 가이드 살펴보기
- 폴더 정리
- 양식(Forms)
- HTTP 요청 보내기
- 라우팅(Routing): "다중 페이지"가 있는 싱글 페이지 애플리케이션(SPA) 구축하기
- Vuex