장바구니 담기 close

장바구니에 상품을 담았습니다.

프런트엔드 개발 시작하기 (컴퓨터/IT)

프런트엔드 개발 시작하기 (컴퓨터/IT) 네이버는 이렇게 한다! 예제로 배우는 프런트엔드 개발과 도구 (Tech@NHN 시리즈 9)

  • 주우영
  • |
  • 위키북스
  • |
  • 2014-09-19 출간
  • |
  • 412페이지
  • |
  • 188 X 240
  • |
  • ISBN 9788998139667
★★★★★ 평점(10/10) | 리뷰(1)
판매가

22,000원

즉시할인가

19,800

배송비

무료배송

(제주/도서산간 배송 추가비용:3,000원)

수량
+ -
총주문금액
19,800

※ 스프링제본 상품은 반품/교환/환불이 불가능하므로 신중하게 선택하여 주시기 바랍니다.

목차

[1부] 프런트엔드 개발과 도구 소개

▣ 01장 프런트엔드 개발의 이해
프런트엔드 개발이란
- 정의
- 범위
프런트엔드 개발 현황
- 미성숙한 개발 프로세스
- 프런트엔드 지식이 부족한 서버 개발자
- 백엔드와 프런트엔드의 개발 의존성
프런트엔드 개발 프로세스
- 새로운 프로젝트 시작
- 프런트엔드 개발 시작
- 프런트엔드 개발 산출물 배포
정리

▣ 02장 IDE와 에디터
유명한 에디터
- 이클립스
- 앱타나 스튜디오
- 서브라임 텍스트
웹스톰
- 웹스톰을 채택한 이유
웹스톰 설치
- Node.js 설치
- 웹스톰 설치
- 웹스톰 실행
정리

▣ 03장 버전 관리 시스템
서브버전과 깃
- 서브버전
- 깃
웹스톰과 버전 관리 시스템
- 서브버전 사용
- 깃 사용
정리

▣ 04장 코드 품질 관리
코드 품질 검증 도구
- JSHint
- JSLint
웹스톰과 JSLint
- JSLint 설정
- 실시간 코드 검증
테스트 도구
- QUnit
- 카르마
웹스톰과 카르마
- 카르마 설치
- 테스트 실행
정리

▣ 05장 리팩터링 기법
리팩터링이란?
웹스톰과 리팩터링
- 이름 변경(Rename)
- 이동(Move)
- 안전한 삭제(Safe Delete)
- 시그니처 변경(Change Signature)
- 직접 삽입(Inline)
- 추출(Extract)
- Find Refactoring Preview 도구 창
정리

▣ 06장 디버깅 도구
크롬 브라우저
- 설치
HTML&CSS 디버깅
- 요소 패널
- 인스펙터 도구
- 스타일 창
- 계산 결과 창
자바스크립트 디버깅
- 소스 패널
- 콘솔 패널
네트워크 디버깅
- 네트워크 패널
반응형 모드
- 크롬
- 파이어폭스
정리

▣ 07장 프런트엔드 개발 도구
마크업 개발 도구
- Less
- Emmet
웹스톰과 Less, Emmet
- Less
- Emmet
자바스크립트 개발 도구
- Bower
- JSDoc3 애너테이션
웹스톰과 Bower, JSDoc3 애너테이션
- Bower
- JSDoc3 애너테이션
디렉터리 스캐폴딩
- Grunt-init 소개
정리

▣ 08장 빌드 및 태스크 자동화 도구
빌드 도구
- Uglify.js
- JSDoc3 문서화
태스크 자동화 도구
- Grunt
정리

[2부] 프런트엔드 개발 시작

▣ 09장 조직도 트리 개발 사례
조직도 트리 개발 시작
- 소개
- 상세설계서와 디자인
- 명세 작성
명세 분석
- 유스케이스
정리

▣ 10장 마크업 개발
마크업 디렉터리 구성
- 네이버 디렉터리 컨벤션
- 디렉터리 구조 생성
마크업 개발 단계
- 구조를 마크업하는 작업
- 구조를 스타일링하는 작업
조직도 트리 구조 작성
- 조직도 타이틀과 조직추가 버튼 마크업
- 최상위 노드(회사, 조직미지정) 마크업
- 부서 노드 마크업
- 콘텍스트 메뉴 마크업
조직도 트리 스타일링
- 스타일링에 필요한 Less 파일 생성
- 조직도 트리 레이아웃 스타일링
- 타이틀과 조직 추가 버튼 스타일링
- 조직도 트리 스타일링
- 수정 폼 스타일링
- 콘텍스트 메뉴 스타일링
정리

▣ 11장 자바스크립트 개발
자바스크립트 디렉터리 구성
- 일반적인 디렉터리 구조
- 디렉터리 구성
- 디렉터리 템플릿
조직도 모듈 개발
- 조직도 모듈 설계
- 조직도 모듈 HTTP API 디자인
- 모델 개발
- 컬렉션 개발
- 조직도 트리 뷰 개발
- 콘텍스트 메뉴 뷰 개발
- 빌더 함수
조직도 모듈 빌드
정리

▣ 부록A 도구 기능 소개
JSLint 옵션 소개
Qunit 기능 소개
Less 기능 소개
Emmet 기능 소개
JSDoc3 태그 소개

▣ 부록B 조직도 모듈 설계 패턴
모델-뷰-컨트롤러
컴포지트 패턴
데코레이터 패턴

▣ 부록C 참고 자료
웹 사이트

도서소개

이 책에서는 프런트엔드 개발의 정의와 프런트엔드 개발에 유용한 도구를 소개하고 예제를 중심으로 한 개발 방법을 설명한다. 프런트엔드 개발이 무엇이고, 그 범위가 어디까지인지를 설명하며, 프런트엔드 개발에 필요한 도구뿐만 아니라 품질 관리 도구도 자세하게 알려준다.

프런트엔드 개발을 쉽게 시작할 수 있게 도와드립니다!

이 책에서는 프런트엔드 개발의 정의와 프런트엔드 개발에 유용한 도구를 소개하고 예제를 중심으로 한 개발 방법을 설명한다. 프런트엔드 개발이 무엇이고, 그 범위가 어디까지인지를 설명하며, 프런트엔드 개발에 필요한 도구뿐만 아니라 품질 관리 도구도 자세하게 알려준다.

또한 조직도 트리 예제를 중심으로 명세 작성과 마크업, 자바스크립트 개발 등 프런트엔드 개발의 시작부터 끝까지를 쉽고 자세하게 설명한다. 이 책에는 네이버에서 사용하는 프런트엔드 개발 프로세스와 시행착오에서 얻은 소중한 경험이 녹아 있다.

★ 이 책에서 다루는 내용 ★

◎ 프런트엔드 개발 정의와 범위 소개
◎ 프런트엔드 개발 도구 소개: 웹스톰, JSLint, 카르마, Qunit, Less, Emmet, Bower, JSDoc3, Grunt, Uglify.js, 크롬 개발자 도구
◎ 조직도 트리 예제로 명세 작성, 마크업 개발, 자바스크립트 개발

<추천의 글>

좋은 책이다. 이 책으로부터 필자가 겪었던 프런트엔드 노하우를 보고 배울 수 있다. 보통 책은 많은 분야를 다루지 않는다. 하지만 이 책은 분야가 다양하고 내용이 풍부하며, 직접 그린 그림으로 쉽게 이해할 수 있게 작성돼 있다. 프런트엔드의 초심자에게 좋은 경험이 될 수 있고, 전문가에게도 도움이 될 것이다.
-SK플래닛 박난하

교환 및 환불안내

도서교환 및 환불
  • ㆍ배송기간은 평일 기준 1~3일 정도 소요됩니다.(스프링 분철은 1일 정도 시간이 더 소요됩니다.)
  • ㆍ상품불량 및 오배송등의 이유로 반품하실 경우, 반품배송비는 무료입니다.
  • ㆍ고객님의 변심에 의한 반품,환불,교환시 택배비는 본인 부담입니다.
  • ㆍ상담원과의 상담없이 교환 및 반품으로 반송된 물품은 책임지지 않습니다.
  • ㆍ이미 발송된 상품의 취소 및 반품, 교환요청시 배송비가 발생할 수 있습니다.
  • ㆍ반품신청시 반송된 상품의 수령후 환불처리됩니다.(카드사 사정에 따라 카드취소는 시일이 3~5일이 소요될 수 있습니다.)
  • ㆍ주문하신 상품의 반품,교환은 상품수령일로 부터 7일이내에 신청하실 수 있습니다.
  • ㆍ상품이 훼손된 경우 반품 및 교환,환불이 불가능합니다.
  • ㆍ반품/교환시 고객님 귀책사유로 인해 수거가 지연될 경우에는 반품이 제한될 수 있습니다.
  • ㆍ스프링제본 상품은 교환 및 환불이 불가능 합니다.
  • ㆍ군부대(사서함) 및 해외배송은 불가능합니다.
  • ㆍ오후 3시 이후 상담원과 통화되지 않은 취소건에 대해서는 고객 반품비용이 발생할 수 있습니다.
반품안내
  • 마이페이지 > 나의상담 > 1 : 1 문의하기 게시판 또는 고객센터 1800-7327
교환/반품주소
  • 경기도 파주시 문발로 211 1층 / (주)북채널 / 전화 : 1800-7327
  • 택배안내 : CJ대한통운(1588-1255)
  • 고객님 변심으로 인한 교환 또는 반품시 왕복 배송비 5,000원을 부담하셔야 하며, 제품 불량 또는 오 배송시에는 전액을 당사에서부담 합니다.