프런트엔드 UI 개발의 전체 과정을 실무 프로젝트로 배운다!
Vue.js와 부트스트랩 뷰를 활용한 SPA 만들기!
웹어워드코리아(i-award.or.kr)에서 대상과 최우수상을 수상한 17년 차 프런트엔드 개발자가 알려 주는 방법 그대로 웹 사이트 하나를 통째로 만든다. 텅 빈 화면에서 시작해 한 줄씩 코딩하다 보면 조금씩 완성되는 사이트를 눈으로 확인할 수 있다. 웹 프런트엔드 UI를 개발할 때 알아야 할 다양한 기법과 HTML, CSS 활용법을 설명하고, HTML 요소에 데이터를 연결하여 동적인 콘텐츠를 만드는 방법을 배울 수 있다. 기존의 웹 퍼블리셔라면 프런트엔드 개발자로 첫걸음을 내디딜 수 있으며, 사용자 경험을 고려한 UI 개발을 배우려는 개발자에게도 도움을 준다.

[추천사]
프런트엔드 입문서로 손색이 없어요!
웹 개발에서 프런트엔드 영역의 비중은 점점 커지고 있지만, Vue.js와 같은 자바스크립트 프레임워크를 학습하는 일이 쉽지 않은 것도 사실입니다. 이 책은 Vue.js의 이론뿐만 아니라 실제 웹 개발 프로젝트에 필요한 내용을 실습으로 자연스럽게 익힐 수 있어 최고의 입문서가 될 것입니다.
㈜스트라토 Cloud4팀 | 박홍수 팀장

프런트엔드 프로젝트의 A to Z
웹 프런트엔드 개발에서 진정한 실력자로 인정받으려면 HTML 마크업과 CSS 스타일링뿐만 아니라 스크립트를 정복해야 합니다. 이 책은 프런트엔드 개발자가 되고 싶거나 프런트엔드 개발을 이해하는 퍼블리싱 고수가 되기를 원하는 분에게 소중한 길라잡이가 될 것입니다. 프로젝트 초기 설정부터 구현해야 할 기술을 단계별 실습으로 익힐 수 있도록 꼼꼼하게 구성해 놓았습니다. 프런트엔드 프로젝트의 ‘A to Z’라고 할 만큼 많은 노하우가 담겨 있습니다.
㈜아이뱅크 개발운영사업부 | 박석민 이사

진짜 실무에서는 어떻게 하냐고요?
단순 퍼블리싱을 하는 것과 환경을 이해하고 퍼블리싱하는 것은 하늘과 땅 차이입니다. 이 책은 웹 프런트엔드 환경을 이해하고 데이터에 기반한 사용자 인터페이스를 어떻게 개발해야 하는지를 알려 줍니다. 또한 실무 경험이 없으면 알기 어려운 내용도 충분히 다루어서 프런트엔드 개발자로 취업을 준비하는 분께도 추천하고 싶습니다.
엔카닷컴(주) FE1팀 | 허문용 차장

Vue.js 입문서로도 좋아요!
Vue.js 문법과 디렉티브를 체계적으로 소개하고 실무 예제를 통해 프런트엔드 웹 개발을 더욱 쉽고 효과적으로 할 수 있게 도와줍니다. 또한 웹 애플리케이션을 개발하면서 부딪히는 문제들을 Vue.js를 활용하여 해결하는 방법을 보여 줍니다. 모던 웹 프로젝트를 어떻게 시작할지 몰라 망설이는 분들에게 적극 추천합니다.
야놀자(주) 데일리호텔 fe개발팀 | 최훈철

Vue.js 프로젝트 투입 직전에 보기 좋은 책!
자바스크립트와 Vue.js 핵심만 정리하여 처음 접하는 분도 부담이 없습니다. 실무에 바로 응용할 수 있는 실습과 저자의 실무 경험이 담긴 다양한 팁을 제공합니다. 복잡하고 두꺼운 이론 책보다 실습 위주의 책을 찾는 분께 추천합니다. 특히 급하게 Vue.js로 개발해야 하는 상황이라면 이 책을 추천합니다.
(주)KB데이타시스템 테그개발부 | 김상희 과장

그녀는 일에 대한 열정이 가득하고 언제나 두려움 없이 새로운 도전을 시작하는 실무 경력 13년 차 웹 퍼블리셔이다. 국내 웹 에이전시에서 활동하며 이니스프리, 에뛰드, 엘지 하우시스 등 유명한 쇼핑몰 제작에 참여했고 그동안 작업한 사이트 대부분은 웹 어워드 코리아에서 각 분야별로 최우수상 또는 대상을 수상하였다. 또한 웹 퍼블리싱 실무 강의로 인기를 끌기도 했다. 그녀는 현재 외국계 기업에서 솔루션 프로그램을 만드는 프로젝트에 참여하고 있다.

==========================
첫째마당 HTML과 CSS 그리고 반응형 웹
==========================
01 HTML과 CSS 복습하기
01-1 HTML과 시맨틱 웹
01-2 실무에서 유용한 HTML 요소
01-3 CSS 기초 문법 복습하기
01-4 스타일을 적용할 요소 선택하기

02 실무에서 유용한 CSS 패턴 알아보기
02-1 박스 모델 이해하기
02-2 CSS 속성 알아보기
02-3 가상 요소 알아보기

03 레이아웃과 반응형 웹
03-1 요소의 흐름을 지정하는 속성 ? float
03-2 레이아웃을 위한 속성 ? flex
03-3 반응형 웹 만들기
03-4 반응형 웹은 미디어 쿼리로만 만들까?

================
둘째마당 웹 프로그래밍
================
04 자바스크립트 프로그래밍
04-1 자바스크립트의 역할
04-2 자바스크립트 기본 문법
04-3 제어문
04-4 배열
04-5 반복문
04-6 Node.js 설치하기

05 Vue.js 프로그래밍
05-1 싱글 페이지 애플리케이션 개발
05-2 Vue.js 프레임워크 소개
05-3 라우터
05-4 컴포넌트 만들기
05-5 템플릿 문법
05-6 주요 속성
05-7 UI 프레임워크 소개

==============
셋째마당 SPA 만들기
==============
06 프로젝트 환경 설정하기
06-1 프로젝트 환경 설정하기
06-2 프로젝트 폴더 살펴보기

07 SPA 기본 골격 만들기
07-1 기본 레이아웃 만들기
07-2 헤더 영역 만들기
07-3 메뉴 데이터 만들기
07-4 푸터 영역 만들기
07-5 반응형으로 만들기

08 로그인/회원가입 대화 상자 만들기
08-1 부트스트랩 뷰란?
08-2 부트스트랩 뷰 컴포넌트
08-3 부트스트랩 아이콘
08-4 로그인 대화 상자 만들기
08-5 회원가입 대화 상자 만들기

09 메인 콘텐츠 만들기
09-1 메인 콘텐츠 레이아웃 만들기
09-2 분야별 새로 나온 도서 영역 만들기
09-3 도서 검색 만들기
09-4 배너 메뉴 만들기
09-5 공지 사항 만들기

10 서브 페이지 레이아웃 만들기
10-1 메뉴 고정하기
10-2 서브 페이지 레이아웃 만들기

11 도서 소개 페이지 만들기
11-1 도서 목록 만들기
11-2 도서 기본 정보 만들기
11-3 도서 상세 탭 메뉴 만들기
11-4 동적 라우팅으로 구현하기

12 SPA 완성하기
12-1 자료실/동영상 강의 페이지 만들기
12-2 교재 샘플 페이지 만들기
12-3 회사 소개 페이지 만들기

찾아보기