홈앤서비스 SK BROADBAND

Chapter 1. 개발 환경 세팅
1.1 IDE 선택하기
1.1.1 Vetur Extension
1.1.2 Vue Peek Extension
1.1.3 Vue 2 Snippets Extension
1.2 NodeJS(노드제이에스) 환경 구축하기
1.3 Vue 환경 구축하기
1.3.1 Vue Devtools
1.3.2 Vue CLI
1.3.2.1 설치방법
1.3.2.2 각 옵션 살펴보기
1.4 Vue CLI로 생성된 파일 살펴보기
1.4.1 .babelrc
1.4.2 .editorconfig
1.4.3 .eslintrc.js
1.4.4 .eslintignore
1.4.5 .gitignore
1.4.6 .postcssrc.js
1.4.7 build
1.4.8 config
1.4.9 index.html
1.4.10 node_modules, package.json
1.4.11 src
1.4.12 static
1.4.13 test
1.5 RESTful API 서버 세팅하기

Chapter 2. 알면 보이는 Vue
2.1 Vue의 필수 요소
2.1.1 Vue 인스턴스
2.1.2 Vue 인스턴스의 옵션
2.1.3 Vue 인스턴스의 생명주기
2.1.4 Vue 템플릿 문법
2.1.5 디렉티브
2.1.6 Vue 인스턴스의 속성과 메소드
2.2 Vue를 똑똑하게 사용하기
2.2.1 단일파일컴포넌트(Single File Component)
2.2.2 Vue 컴포넌트의 설계의 일등공신, FIRST 원칙
2.2.3 가상 DOM의 원리
2.2.4 범위 컴파일 사용하기

Chapter 3. Vuex란 무엇일까?
3.1 MVC 패턴
3.2 Flux 패턴
3.2.1 액션(Action)
3.2.2 디스패처(Dispatcher)
3.2.3 스토어(Store)
3.2.4 뷰(View)
3.3 Vuex
3.3.1 상태(State)
3.3.2 게터(Getters)
3.3.3 변이(Mutation)
3.3.4 액션(Actions)
3.3.5 Vuex 모듈 관리
3.3 마치며

Chapter 4. Vue Router
4.1 Vue Router는 왜 필요한가요?
4.1.1 전통적인 방법의 라우팅
4.1.2 단일 페이지 애플리케이션의 라우팅
4.2 Vue 애플리케이션에서 Vue Router 사용하는 법
4.3 Vue Router의 라우트 설정의 속성들
4.4 동적 라우트 매칭
4.4.1 동적 세그먼트란 무엇인가?
4.4.2 동적 세그먼트의 변경에 반응하기
4.4.3 매칭 우선순위
4.5 중첩된 라우트
4.5.1 중첩된 라우트란 무엇인가?
4.5.2 중첩된 라우트 기능을 사용하지 않고 만들어보기
4.5.3 중첩된 라우트 사용하기
4.6 프로그래밍 방식 내비게이션
4.6.1 router.push
4.6.2 router.replace
4.6.3 router.go
4.7 이름을 가지는 뷰
4.8 리다이렉트와 별칭
4.8.1 리다이렉트
4.8.2 별칭
4.9 라우트 컴포넌트에 속성 전달
4.10 해시 모드와 히스토리 모드
4.10.1 해시 모드
4.10.2 히스토리 모드
4.11 네비게이션 가드
4.11.1 전역 가드
4.11.2 라우트별 가드
4.11.3 컴포넌트별 가드

Chapter 5. 메모 관리 애플리케이션 만들기
5.1 메모 관리 애플리케이션을 만들기에 앞서
5.2 컴포넌트 구조
5.3 프로젝트 구성
5.3.1 프로젝트 생성하기
5.4 헤더 컴포넌트 생성하기
5.5 메모 데이터 생성 기능 구현하기
5.6 메모 데이터 노출 기능 구현하기
5.7 메모 데이터 삭제 기능 구현하기
5.8 메모 데이터 수정 기능 구현하기
5.9 서버와 API 연동하기
5.9.1 API란 무엇인가?
5.9.2 axios란?
5.9.3 RESTful API 확인하기
5.9.4 RESTful API 연동하기
5.9.5 추가 요구 사항 기능 구현하기

Chapter 6. 커뮤니티 애플리케이션 만들기
6.1 커뮤니티 애플리케이션 요구 사항 확인하기
6.1.1 인증되지 않은 사용자를 포함한 모든 사용자는 타인의 게시물과 댓글을 조회할 수 있다
6.1.2 인증된 사용자만 게시물이나 댓글을 작성할 수 있다
6.1.3 사용자는 자신의 게시물이나 댓글만 수정, 삭제할 수 있다
6.1.4 사용자는 다른 사용자의 게시물에 댓글을 남길 수 있다
6.2 프로젝트 세팅
6.2.1 프로젝트 생성
6.2.2 커뮤니티 애플리케이션의 API 서버 확인 및 스타일 적용하기
6.3 커뮤니티 게시글 읽기 기능 구현하기
6.4 커뮤니티 게시물 데이터 스토어로 옮기기
6.5 커뮤니티 게시글 상세보기 페이지 구현하기
6.5.1 에러에 대한 설명
6.6 회원가입 페이지 구현하기
6.7 로그인 페이지 구현하기
6.7.1 페이지 및 폼 컴포넌트 작성
6.7.2 애플리케이션에서 사용자를 인증하는 방법
6.7.3 애플리케이션에서 JWT 토큰 사용하기
6.7.4 로그인 로직을 스토어로 옮기기
6.7.5 저장된 토큰을 기반으로 현재 로그인된 사용자의 정보 가져오기
6.8 애플리케이션의 헤더 컴포넌트 작성하기
6.8.1 헤더 컴포넌트 작성하기
6.8.2 헤더 컴포넌트를 라우트에 등록하기
6.8.3 헤더 컴포넌트 기능 추가하기
6.9 게시물 생성 페이지 작성하기
6.9.1 게시물 생성 페이지 컴포넌트 작성하기
6.9.2 게시물 생성 폼 컴포넌트 작성하기
6.9.3 게시물 생성 API 연동하기
6.9.4 게시물 생성 페이지 내비게이션 가드 구현하기
6.9.5 애플리케이션 초기화 시 발생하는 통신 동기화 버그 수정하기
6.9.6 게시물 리스트 페이지에 글쓰기 버튼 추가하기
6.10 게시물 수정 페이지 작성하기
6.10.1 게시물 수정 페이지 컴포넌트 작성하기
6.10.2 게시물 수정 페이지 내비게이션 가드 구현하기
6.10.3 게시물 수정 폼 컴포넌트 작성하기
6.11 게시물 삭제 기능 작성하기
6.12 게시물에 대한 댓글 기능 추가하기
6.12.1 댓글 노출 기능 추가하기
6.12.2 댓글 생성 기능 추가하기
6.12.3 댓글 수정 기능 추가하기
6.12.4 댓글 삭제 기능 추가하기

Chapter 7. 알면 좋을 자바스크립트
7.1 Truthy 값과 Falsy 값
7.1.1 Truthy 값
7.1.2 Falsy 값
7.2 자바스크립트의 이벤트
7.2.1 이벤트 전파 버블링
7.2.2 이벤트 캡처링
7.2.3 이벤트 처리 단계
7.3 값에 의한 호출, 참조에 의한 호출
7.3.1 값에 의한 호출(Call by value)
7.3.2 참조에 의한 호출(Call by reference)
7.3.3 호출 방식에 따라 달라지는 비교 결과
7.4 자바스크립트의 유용한 메소드들
7.4.1 배열 메소드
7.4.2 객체 메소드