확장메뉴
주요메뉴


소득공제
미리보기 공유하기

커피 한 잔 마시며 끝내는 Vue.JS

: Vue.JS를 통해 실전 애플리케이션 구축하기

리뷰 총점9.0 리뷰 2건 | 판매지수 234
베스트
프로그래밍 언어 top100 6주
정가
30,000
판매가
27,000 (10% 할인)
YES포인트
당신의 독서를 위한 친구 - 심플 폴더블 LED 독서등/크리스탈 문진/가죽 슬리브 유리 텀블러/모나미 볼펜
[대학생X취준생] 꼭 공부를 해야 할 상황이라면? 2학기, 공부할 결심!
8월 얼리리더 주목신간 : 귀여운 방해꾼 배지 증정
월간 개발자 2022년 8월호
박해선 저자의 머신러닝/딥러닝 패스
[단독]『혼자 공부하는 파이썬』 개정판 출간
내일은 개발자! 코딩테스트 대비 도서전
[단독] 에듀윌 IT 자격증 기획전 - 가장 빠른 합격출구 EXIT
YES24 트윈링 분철 : 인서트라벨/스티커 택1 증정
8월 전사
쇼핑혜택
1 2 3 4 5

품목정보

품목정보
출간일 2019년 07월 31일
쪽수, 무게, 크기 480쪽 | 173*230*30mm
ISBN13 9791190014397
ISBN10 1190014394

이 상품의 태그

책소개 책소개 보이기/감추기

Vue.JS를 통해 실전 애플리케이션 구축하기

이 책에서는 Vue.JS에 대한 API뿐만 아니라 어떻게 활용하면 되는지에 대해 효과적으로 설명한다. 이러한 활용 예제는 실전 애플리케이션을 구축해나가는 과정을 통해 쉽고 효과적으로 학습한다. 그뿐만 아니라 실전 애플리케이션을 구축해나가는 과정에서 겪을 수 있는 트러블슈팅과 저자들의 실무 경험을 바탕으로 하는 조언도 함께 학습한다.

목차 목차 보이기/감추기

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 객체 메소드

저자 소개 (2명)

출판사 리뷰 출판사 리뷰 보이기/감추기

Vue.js는 React.js와 더불어 가장 핫한 자바스크립트 프레임워크 중 하나입니다. Vue.js는 React.js에 비해 진입 장벽이 낮으며, 쉽고 빠르게 개발을 할 수 있다는 것이 가장 큰 장점입니다. 무엇보다 한국의 수많은 개발자의 노력으로 인해 공식 문서 역시 번역이 잘되어 있을 뿐만 아니라 많은 커뮤니티에서도 좋은 정보를 손쉽게 얻을 수 있습니다. 앞으로도 Vue.js는 꾸준히 발전해 나갈 것이며, 수많은 Vue.js관련 커뮤니티 역시 점점 더 성숙해지고 있어 성장하는 Vue.js 생태계 속에서 Vue.JS를 이용하여 개발하면 얻을 수 있는 이점은 충분합니다.

이 책은 프로그래밍을 시작하기 위해 첫걸음을 떼는 입문자와 Vue.js를 사용하고 있는 개발자를 위한 책이라고 볼 수 있습니다. 실제 예제를 따라 해보면서 Vue.js를 더욱더 쉽게 만들어 어디서부터 어떻게 공부해야 할지 모르겠다고 생각하는 사람들에게 가이드가 될 책입니다.

이 책의 특징

- 상세한 이미지와 예제를 통해 Vue.JS에 대해 쉽게 설명한다.
- 실전 애플리케이션을 구축하는 과정에서 효과적으로 Vue.JS에 대해 설명한다.
- NodeJS서버의 API를 이용하여 비동기 통신 처리에 대해 설명한다.

이 책이 필요한 독자

- Vue.JS를 통해 프론트 개발을 시작하고자 하는 독자
- Vue.JS에 대한 이론적이 이해뿐만 아니라 실전 애플리케이션을 구축하고자 하는 독자
- Vue.JS에 대한 이해도를 한층 더 높이고 싶은 독자

독자대상
초중급

소스코드 다운로드
https://github.com/bjpublic/VueJS-coffee

추천평 추천평 보이기/감추기

저자가 SPA 제작 중 습득한 지식을 초행자를 위해서 정리한 책.
vue.js란? vuex, vue-router를 사용해야 하는 이유는? 전체적으로 어떻게 만들어야 하는지? 의문에 대한 저자의 생각이 담겨있습니다. 특정 기능에 대한 방대한 설명보다는 SPA 제작에 필요한 개념과 그 이유에 대한 저자의 생각이 녹아있어서 처음으로 SPA 형태의 개발을 진행할 때 많은 도움이 될 것으로 생각합니다.
-이지만(쿠팡, 프론트엔드 개발자)-

Vue.js를 즐겁게 학습하고 싶은 분들께 추천하고픈 책!
이 책을 따라가며 자연스럽게 생기는 호기심과 이어지는 저자의 해설은 저자와 함께하는 듯하여 책을 읽어가는 내내 즐거움을 느꼈습니다. 제가 경험한 즐거웠던 이 과정을 많은 분들이 나누면 좋겠습니다. 쉽게 따라갈 수 있는 예제는 저자의 친절한 해설과 실무 팁으로 입문자와 Vue.js를 이미 사용하고 있는 개발자에게도 도움을 줍니다. 이 책 곳곳에 Javascript의 문법에 대한 설명과 웹프론트 개발을 위한 기초 내용도 있어 프론트 개발을 하고자 하는 분들에게 추천해 드리고 싶습니다.
-김지영(위드이노베이션, 프론트엔드 개발자)-

Vue.js는 ‘가장 인기 있는 컴포넌트 기반 프레임워크’로 많은 주목을 받는 기술 중 하나입니다. “커피 한 잔 마시며 끝내는 Vue.JS”는 현대적인 개발 환경에서 Vue.js의 기초부터 비전공자도 쉽게 이해를 할 수 있도록 친절하게 작성되어 편하게 읽을 수 있습니다! 그리고 Vue.js 뿐만 아니라 Front End 최신 개발 환경에 대한 내용까지 수록되어 있어서 책 내용을 깊이 이해하는 데 많은 도움을 받을 수 있습니다. 또한, 챕터의 앞부분에서는 Vue.js의 기반 지식을 자세하게 설명하고 있고, 이후 챕터에서는 실제 돌아가는 애플리케이션을 만들어보면서 Vue.js를 사용해볼 수 있도록 구성되어있기 때문에 재미있게 읽을 수 있습니다. 마지막으로 오랜만에 좋은 책을 읽을 수 있는 경험을 갖게 해주신 점 감사드립니다.
-박철현(티몬, 프론트엔드 개발자)-

Vue.js의 학습이 필요한 시기에 베타 리더라는 좋은 기회를 주셔서 감사드립니다! 이 책은 무엇보다도 현재도 Vue.js로 실무를 하고 계신 분들이 저자라는 점이 강점입니다. 다소 어렵거나 따분할 수 있는 설명들이지만, 경험을 바탕으로 예제를 구성하여 이해가 쉽고, 실습하는 과정이 아주 매끄러워 점진적으로 완성도가 높아져 가는 애플리케이션을 보며 성취감도 느끼실 수 있습니다. 예제 코드의 친절한 설명은 덤입니다! 그리고 중간중간 바로 실무에 적용하기 좋은 꿀팁들을 많이 담고 있어서 쿡북으로도 손색이 없는 책으로 추천해 드리고 싶습니다.
-박은정(드림어스 컴퍼니, 프론트엔드 개발자)-

회원리뷰 (2건) 리뷰 총점9.0

혜택 및 유의사항?
커피 한 잔 마시며 끝내는 Vue.js 내용 평점4점   편집/디자인 평점4점 m********d | 2019.08.28 | 추천2 | 댓글1 리뷰제목
커피 한 잔 마시며 끝내는 Vue.js는 450페이지 정도 되며, 제목처럼 커피 한 잔 마시며 끝내기에는 좀 많은 분량이네요. 몇 리터를 마셔야 하는 건지.. 그렇지만, 제목이랑 표지는 잘 나온 것 같습니다. 접근하기 쉬운 제목이라 생각됩니다.저자 중 한 분이 마크업 엔지니어를 거쳐 프런트 앤드 개발자로 거듭나신 분이라 책이 좀 더 자연스럽게 다가올 거라는;
리뷰제목


커피 한 잔 마시며 끝내는 Vue.js는 450페이지 정도 되며, 제목처럼 커피 한 잔 마시며 끝내기에는 좀 많은 분량이네요. 몇 리터를 마셔야 하는 건지.. 그렇지만, 제목이랑 표지는 잘 나온 것 같습니다. 접근하기 쉬운 제목이라 생각됩니다.


저자 중 한 분이 마크업 엔지니어를 거쳐 프런트 앤드 개발자로 거듭나신 분이라 책이 좀 더 자연스럽게 다가올 거라는 기대를 살짝 해 봤습니다.


첫 실전 애플리케이션이라 할 수 있는 메모 관리 애플리케이션을 시작하면서부터 에러와 마주쳤는데요 책에 적힌 대로 무작정 진행했었는데 말이죠. 대충 보면 'name' 옵션을 주라는 거였습니다.

custom element: 
memo-form - did you register the component correctly? 
For recursive components, make sure to provide the "name" option.

책을 다시 보다 보니 빠진 부분이 있었습니다. MemoForm과 Memo를 import 하고 있었는데components가 제대로 등록되어 있지 않아서 생긴 문제였습니다. github의 샘플은 완성본이기 때문에 이미 들어가 있지만, 무작정 따라 하다 보니 약간 당황스러웠습니다.

components: {
  MemoForm,
  Memo
},

처음엔 도통 이유를 몰랐는데... 하도 오랜만에 Vue 코드를 보니 이유를 찾는데도 시간이 걸리고 말았습니다... 이건 저 같은 사람을 위한 함정 연습문제 같은걸까요?


RESTful API 연습

서버를 직접 관리하는 경우는 별로 없다 보니 데이터를 다루기 위해 RESTful API를 연습하는 애플리케이션은 상당히 재미있었던 것 같습니다. 이어서 Vuex를 다루는 과정으로 넘어갔을 때 갑자기 난이도가 팍 올라간 느낌을 받았습니다. 이전에 Vuex를 경험해 본 적이 없어서 더욱 그렇게 느낀 것일지도 모르겠습니다.


책의 선전 문구처럼 실전 애플리케이션의 구축에 필요한 정보들을 잘 정리해 준 책이라 생각되었습니다.


독자 대상이 초급이 아니고 초중급인 것을 보면 아시겠지만, 적어도 한두 번은 어떤 경로를 통해서든 Vue를 사용해서 하나의 프로젝트를 온전하게 경험해 본 사람을 대상으로 하고 있습니다. 저처럼 단순히 마크업만을 주 업무로 하시던 분이 무작정 따라 하기엔 난이도가 있을 수 있다고 생각되었습니다.


커피 한 잔 하면서 끝내기에는 좀 그렇지만, 책을 통해서 Vue를 다시 학습할 수 있어서 좋았던 것 같습니다. 작년 말에 Vue로 프로젝트를 진행한 적은 있었는데 벌써 반년이 넘도록 Vue를 접하지 않았는데 커피 한 잔 마시며 끝내는 Vue.js 통해 실전에 사용할 수 있는 방법으로 자세히 다루고 있어 가물거리는 기억을 다잡을 수 있어 다행이었습니다.

저레벨이라서 잘 이해가 되지 않는 부분도 있지만, 일단은 책을 따라서 무작정 정주행 해보고 있는 중입니다.

댓글 1 2명이 이 리뷰를 추천합니다. 공감 2
[리뷰]커피 한 잔 마시며 끝내는 Vue.JS 내용 평점5점   편집/디자인 평점5점 스타블로거 : 수퍼스타 하*스 | 2019.08.23 | 추천2 | 댓글1 리뷰제목
[한줄평]vue.js 프레임워크를 커피 한잔 마시며 편하게 입문하고 싶은 분들에게 추천[목차구성]이책은 총 chapter7으로 구성되어 있습니다.Chapter 1. 개발 환경 세팅Chapter 2. 알면 보이는 VueChapter 3. Vuex란 무엇일까?Chapter 4. Vue RouterChapter 5. 메모 관리 애플리케이션 만들기Chapter 6. 커뮤니티 애플리케이션 만들기Chapter 7. 알면 좋을 자바스크립트[이 책의 주요 특징];
리뷰제목


[한줄평]

vue.js 프레임워크를 커피 한잔 마시며 편하게 입문하고 싶은 분들에게 추천


[목차구성]

이책은 총 chapter7으로 구성되어 있습니다.


Chapter 1. 개발 환경 세팅

Chapter 2. 알면 보이는 Vue

Chapter 3. Vuex란 무엇일까?

Chapter 4. Vue Router

Chapter 5. 메모 관리 애플리케이션 만들기

Chapter 6. 커뮤니티 애플리케이션 만들기

Chapter 7. 알면 좋을 자바스크립트


[이 책의 주요 특징]

- vue.js, vuex, vue-router 기본 개념부터 Vue.js를 사용한 애플리케이션 개발시 알아야 할 지식까지 잘 설명한다.

- 자세한 예제와 함께 실습할 수 있고, 실무에 사용하는 기술로 빠르게 이해할수 있다.

- NodeJS서버의 API를 이용하여 비동기 통신 처리에 대해 설명한다.


[이 책의 독자 대상]

- Vue.JS를 통해 프론트 개발을 시작하고자 하는 독자

- Vue.JS에 대한 이론적이 이해뿐만 아니라 실전 애플리케이션을 구축하고자 하는 독자

- Vue.JS에 대한 이해도를 한층 더 높이고 싶은 독자

- 프론트엔드 개발자로 전향하고 싶은 웹 퍼블리셔 및 백엔드 개발자


[서평]


처음 Vue.js를 배우시는 분들에서 가장 이상적인 책이라 생각합니다. Vue.js에 대한 기본 개념과 Vue.js를 이용하여 실무 애플리케이션을 구축하면서 발생 가능한 이슈에 대해서 최대한 쉽게 풀어서 설명하고 관련 지식을 잘 전달하고 있습니다.


보통 Vue책들은 기초개념과 간단한 ToDo 애플리케이션정도로 구성되어 있습니다. 이런 기초지식만 배우고 회사에 입사하면 많이 어려워 할수 있습니다. 회사에서는 단순한 앱을 만들지 않기 때문이죠. 여기서는 실제 업무에서 사용하는 기술들로 구성되어있고 어떻게 프로젝트를 구축하는지에 대해서 잘알려주고 있어 프론트엔드 개발자로 입사해도 익숙한 개발 느낌을 받게 될것이라 생각합니다.


이책의 구성으로 1장은 Vue.js에 대한 개발 환경 세팅을 설명하고 2장부터 4장까지는  Vue.js, Vuex, Veu-Router에 대한 개념에 대한 학습을 배웁니다. 그리고 5장, 6장은 앞에서 배운 지식으로 실전 애플리케이션(메모 관리, 커뮤니티)을 직접 구축해나가며 필요하고 생각하는 중요한 지식에 대해 잘 설명하고 있습니다. 그리고 마지막 7장에서는 프론트 웹 개발자들이 알아야 할 기초 지식인 자바스크립트에 대해서 배울수 있습니다. 


이책은 단순하게 Vue.js에 대한 지식을 배우는게 아니라 실무 웹 애플리케이션 개발을 어떻게 해가는지에 대해서 필요한 지식을 잘 전달하고 있습니다.


Vue.js 입문자, 웹 퍼블리셔, 백엔드 개발자 등 프론트엔드를 배워보고 싶은 분들에게 많은 도움이 될것이라 생각합니다

댓글 1 2명이 이 리뷰를 추천합니다. 공감 2

한줄평 (3건) 한줄평 총점 5.4

혜택 및 유의사항 ?
평점2점
제목과 달리 개념설명이 많으며 보고 따라가기엔 어려움 예제코드에 소스명도 없고 과정이 생략
이 한줄평이 도움이 되었나요? 공감 0
d*****e | 2022.02.05
구매 평점1점
HTML/CSS 자바스크립트 jQuery만 알고 시작하기엔 책이 너무 어렵습니다.
이 한줄평이 도움이 되었나요? 공감 0
YES마니아 : 로얄 c******7 | 2019.09.02
구매 평점5점
처음 실무를 하게 된 저에게 도움이 많이 되었던 책입니다
1명이 이 한줄평을 추천합니다. 공감 1
라**나 | 2019.08.14
  •  쿠폰은 결제 시 적용해 주세요.
1   27,000
뒤로 앞으로 맨위로 aniAlarm