★ 이 책에서 다루는 내용 ★

■ 웹 디자인을 위한 커스텀 인터랙티브 요소의 생성 방법
■ 웹 애플리케이션을 위한 최고의 인터페이스 개발 방법
■ 웹 페이지에 존재하는 어떤 요소라도 가져올 수 있는 선택자 활용 방법
■ 웹 페이지에 생명력을 불어넣어줄 이벤트 활용 방법
■ 다양한 애니메이션 기법을 적용한 시각효과 구현 방법
■ 최신 제이쿼리 라이브러리에 포함된 막강한 기능 활용 방법
■ 제이쿼리 npm 패키지 활용 방법

★ 이 책의 대상 독자 ★

클라이언트 측 자바스크립트 개발자다. 이 책을 읽으려면 제이쿼리에 대한 경험은 필요하지 않지만, 자바스크립트 프로그래밍에 대한 기본 지식은 필요하다.

★ 이 책의 구성 ★

1장, '제이쿼리 시작하기'에서는 제이쿼리 자바스크립트 라이브러리의 개요로 시작한다. 제이쿼리의 구현 철학과 역사, 대표적인 기능을 설명하고 이를 통해 어떤 일을 할 수 있는지 소개한다. 그 뒤 제이쿼리 라이브러리를 다운로드하고, 첫 번째 스크립트 작성을 위한 환경을 설정한다.
2장, '요소 선택하기'에서는 제이쿼리의 선택자 표현식과 DOM 순회 메소드를 이용한 페이지 내 요소 선택을 알아본다. 제이쿼리를 이용해 다양한 페이지 요소에 스타일을 적용하는 방법은 물론 CSS 스타일시트로는 구현할 수 없는 스타일 적용을 살펴본다.
3장, '이벤트 핸들링'에서는 브라우저에서 이벤트가 발생했을 때 이를 처리하기 위한 제이쿼리 이벤트 핸들링 메커니즘을 다룬다. 제이쿼리가 웹 요소에 어떤 방식으로 다른 요소와의 충돌 없이 이벤트를 부착하는지 살펴보고, 페이지 로딩이 완료되지 않은 상태에서 이벤트를 처리하는 방법도 알아본다. 이벤트 핸들링의 고급 과정이라 할 수 있는 이벤트 버블링, 이벤트 위임, 그리고 네임스페이스 기법도 설명한다.
4장, '스타일과 애니메이션'에서는 사용자의 시선을 사로잡기 위한 제이쿼리의 애니메이션 기술과 다양한 시각 효과를 이용해 페이지 내 요소를 숨기거나 나타내는 방법, 화면에서 이동시키는 방법을 다룬다.
5장, 'DOM 요소 조절하기'에서는 DOM 구조를 이용해 페이지 요소를 변경하는 방법을 설명한다. 이때, HTML 문서의 구조를 변경하는 방법은 물론 웹 콘텐츠에 HTML 문서를 추가하는 방법도 알아본다.
6장, 'Ajax로 데이터 전송하기'에서는 제이쿼리를 이용해 페이지 갱신 없이 서버 측 콘텐츠와 기능에 접근할 수 있는 방법을 소개한다. 제이쿼리에서 제공하는 기본적인 Ajax 라이브러리 요소에 대해 살펴보고, 향후 필요에 따라 기능을 확장할 수 있는 방안도 설명한다.
7장, '플러그인 활용하기'에서는 플러그인 찾기와 설치, 활용법을 알아보고, 강력한 기능의 jQuery UI 그리고 모바일에 특화된 jQuery Mobile 플러그인 라이브러리에 대해 안내한다.
8장, '플러그인 개발하기'에서는 제이쿼리 익스텐션을 이용해 커스텀 플러그인을 만드는 방법을 소개한다. 커스텀 플러그인에는 전용 유틸리티 함수, 제이쿼리 객체 메소드, 그리고jQuery UI 위젯 팩토리가 포함된다. 그리고 제이쿼리의 빌딩 블록이라 할 수 있는 모듈을 이용한 플러그인의 고급 기술 구현 방법을 알아본다.
9장, '고급 선택자와 순회 기능'에서는 선택자 활용 및 순회 기법의 수준을 한 단계 끌어올려서, 성능 향상을 위한 선택자 최적화, DOM 스택의 수정 및 활용, 그리고 요소 선택 및 순회 기능을 확장하기 위한 전용 플러그인 구현 방법을 소개한다.
10장, '고급 이벤트'에서는 이벤트의 고급 기법이라 할 수 있는 이벤트 위임과 이벤트 스로틀링(throttling) 혹은 성능 조절에 대해 살펴보고, 이벤트 핸들링 성능을 극대화할 수 있는 법을 알아본다. 또한 커스텀 이벤트와 스페셜 이벤트를 통해 제이쿼리 라이브러리에 기존에는 존재하지 않았던 기능을 추가하는 방법을 소개한다.
11장, '고급 시각 효과'에서는 제이쿼리의 시각 효과를 매우 세심하게 조절하는 법을 알아보고, 커스텀-이징 함수의 구현 및 애니메이션의 각 단계별 대응 구현에 대해 설명한다. 커스텀 큐 기법을 이용해 애니메이션의 재생 및 중단 시기를 조절하는 방법도 관찰한다.
12장, '고급 DOM 요소 조절하기'에서는 웹 요소에 임의의 데이터 속성을 부착하는 방식 등 DOM 요소를 조절하고 활용하기 위한 고급 기술에 대해 소개한다. 또한 제이쿼리를 이용한 CSS 프로퍼티 활용 방법도 알아본다.
13장, '고급 Ajax 기술'에서는 특정 조건이 충족됐을 때 데이터를 처리하거나 명령을 수행하기 위한 연기 객체 시스템의 활용 방법 등 Ajax 통신에 대한 깊이 있는 내용에 대해 설명한다.
부록 A, 'QUnit을 활용한 자바스크립트 테스트'에서는 자바스크립트 프로그램의 유닛 테스트 도구인 QUnit 라이브러리에 대해 설명한다. QUnit 라이브러리는 정교한 웹 애플리케이션을 개발하고 유지 보수하는 데 큰 도움을 줄 수 있다.
부록 B, '제이쿼리 API 목록'에서는 제이쿼리 라이브러리의 주요 메소드와 선택자 표현식을 간단한 설명이 추가된 목록으로 제공한다. 제이쿼리 API 목록은 원하는 작업이 어떤 것인지는 알고 있지만, 해당 기능의 구현을 돕는 메소드 또는 선택자의 정확한 이름이 생각나지 않을 때 특히 유용하다.

★ 지은이의 말 ★

나는 지난 2007년부터 제이쿼리를 사용하기 시작했으며, 현재도 제이쿼리를 이용한다. 지난 10년 동안, 제이쿼리는 대표적인 자바스크립트 라이브러리로서 브라우저 간의 일관성을 더욱 높여줬고, 자바스크립트의 성능 향상에 기여해왔다. 바뀌지 않은 것이 있다면 제이쿼리의 표현의 명료성과 간결성일 것이다. 오늘날 새로운 웹 개발 도구가 끊임없이 배포되고 있지만 제이쿼리는 여전히 웹 개발 업무를 신속하고 효율적으로 처리할 수 있는 유용한 도구로 인정받고 있다.
이 책 역시 제이쿼리의 발전과 함께 성장해왔으며, 어느새 5판에 이르렀다. 이 책의 저자들은 제이쿼리의 핵심 개념을 직관적으로 이해할 수 있도록 설명하고, 쉽게 따라 해볼 수 있는 예제를 제공하기 위해 노력해왔다. 나 역시 이 책의 명성과 저자들의 노고가 헛되지 않도록 최선을 다해 5판을 집필했으며, 최신 웹 개발 환경에서 제이쿼리를 활용할 수 있는 현대적인 방안을 제시하고자 애썼다.

1장. 제이쿼리 시작하기
__제이쿼리의 주요 기능
__제이쿼리의 우수한 성능의 비밀
__제이쿼리 3의 새로운 기능
____브라우저 지원
____거치 객체
____비동기식 함수
____그 외 다양한 신규 기능
__첫 번째 제이쿼리 웹 페이지 만들기
____제이쿼리 다운로드하기
____HTML 문서에서 제이쿼리 설정하기
____제이쿼리 코드 추가하기
____poem 텍스트 찾기
____완성된 제이쿼리 웹 페이지
__보통의 자바스크립트와 제이쿼리 비교
__개발자 도구 활용하기
____크롬 브라우저 개발자 도구
__요약

2장. 요소 선택하기
__DOM 개념의 이해
__$() 함수 사용하기
__CSS 선택자
____리스트 아이템 레벨에 스타일 적용하기
__선택자의 구체성
__속성 선택자
____스타일 링크
__커스텀 선택자
____테이블 행에 스타일 적용하기
____텍스트 내용에 따라 요소 선택하기
____폼 선택자
__DOM 순회 메소드
____특정 셀에 스타일 적용하기
____코드 연쇄
__제이쿼리 객체의 반복 생성
__DOM 요소에 접근하기
__요약
____참고 자료
__연습 문제

3장. 이벤트 핸들링
__페이지 로딩 이벤트
____코드 실행 시기의 결정
____하나의 페이지에서 여러 개의 스크립트 처리하기
____document ready 콜백 함수에 인수 전달하기
__간단한 이벤트의 처리
____간단한 스타일 변환기
____다른 버튼의 기능 구현하기
____이벤트 핸들러 컨텍스트의 활용
____이벤트 컨텍스트를 활용한 결합 코드 작성
____단축형 이벤트
____페이지 요소 표시하기 혹은 감추기
__이벤트 전파
____이벤트의 여정
____이벤트 버블링의 부작용
__여정의 변화-이벤트 객체
____이벤트 타깃
____이벤트 전파 멈추기
____기본 설정 동작 차단하기
____이벤트 위임하기
____내장된 이벤트 위임 메소드의 활용
__이벤트 핸들러 제거하기
____이벤트 핸들러에 네임스페이스 부여하기
____이벤트 다시 연동하기
__사용자 상호작용의 시뮬레이션
____키보드 이벤트에 반응하기
__요약
____참고 자료
__연습 문제

4장. 스타일과 애니메이션
__CSS의 인라인 속성 변경하기
____컴퓨터 연산 스타일 속성값 설정하기
____브라우저 개발사 전용 스타일 속성 키워드 사용
__페이지 요소를 나타내거나 감추기
__시각 효과와 지속 시간
____속도 조절하기
____페이드 인, 페이드 아웃
____슬라이드 업, 슬라이드 다운
____토글 기능을 이용한 화면 요소 표시
__커스텀 애니메이션 만들기
____커스텀 시각 효과 구현하기
____다수의 속성이 적용된 애니메이션 구현하기
__동시 발생 시각 효과와 순차 발생 시각 효과
____하나의 그룹 요소에 시각 효과 적용하기
____여러 개의 그룹 요소에 시각 효과 적용하기
____도움말
__요약
____참고 자료
__연습 문제

5장. DOM 요소 조절하기
__웹 요소의 속성과 성질 변경하기
____비-클래스 속성
____데이터 속성
____DOM 요소의 프로퍼티
____폼 입력값 조절하기
__DOM 트리 조절하기
____$() 함수의 재발견
____새 요소 생성하기
____새 요소 삽입하기
____요소 이동시키기
____요소 감싸기
____역삽입 메소드의 활용
__페이지 요소의 복제
____인용문의 복제
__콘텐트 게터(getter)와 세터(setter) 메소드
__DOM 요소 조절 메소드 핵심 정리
__요약
____참고 자료
__연습 문제

6장. Ajax로 데이터 전송하기
__요청에 따른 데이터 로딩
__HTML 코드 붙이기
____자바스크립트 객체 활용하기
____XML 문서 로딩하기
__데이터 포맷 선택하기
__서버에 데이터 전송하기
____GET 요청 보내기
____연속적인 폼 데이터 전송
__요청 상황 관찰하기
__오류 처리
__Ajax와 이벤트
__연기 객체와 약정 객체
____페이지 로딩 시 Ajax 호출 실행하기
____fetch() 함수의 활용
__요약
____참고 자료
__연습 문제

7장. 플러그인 활용하기
__플러그인 활용하기
____Cycle 플러그인 다운로드 및 참조하기
____플러그인 메소드 호출하기
____플러그인 메소드 파라미터 조절하기
____파라미터 기본값 수정하기
__플러그인의 확장
____커스텀 선택자
____전역 함수 플러그인
__제이쿼리 UI 플러그인 라이브러리
____시각 효과
____제이쿼리 UI의 인터랙션 컴포넌트
____위젯
____제이쿼리 UI 테마롤러
__제이쿼리 모바일 플러그인 라이브러리
____HTML5 커스텀 데이터 속성
____모바일 내비게이션
____하나의 문서에서 여러 페이지 제공하기
____상호작용 요소
____제이쿼리 모바일의 고급 기능들
__요약
__연습 문제

8장. 플러그인 개발하기
__플러그인에 $ 기호 사용하기
__새 전역 함수 추가하기
____여러 개의 함수 추가하기
__제이쿼리 객체 메소드 추가하기
____객체 메소드 컨텍스트
____암묵적인 반복
____메소드 연쇄 활성화하기
__유연한 메소드 파라미터 제공하기
____옵션 객체
____기본 설정 파라미터 값
____콜백 함수
____커스터마이징 가능한 기본 설정
__제이쿼리 UI 위젯 팩토리로 플러그인 만들기
____위젯 만들기
____위젯 삭제하기
____위젯 활성화, 비활성화하기
____위젯 옵션 받기
____메소드 추가하기
____위젯 이벤트 실행하기
__플러그인 디자인 권장 사항
____플러그인 배포하기
__요약
__연습 문제

9장. 고급 선택자와 순회 기능
__요소 선택하기와 순회하기
____동적인 테이블 필터링
____테이블 열에 배경색 적용하기
____필터링과 테이블 셀 스타일의 결합
____선택자와 순회 메소드에 대한 추가 사항
__선택자 커스터마이징 및 최적화
____커스텀 선택자 플러그인 작성하기
____선택자의 성능
__DOM 순회 방법 알아보기
____제이쿼리 순회 프로퍼티
____DOM 요소 스택
____DOM 순회 메소드 플러그인 작성하기
____DOM 순회 성능
__요약
____참고 자료
__연습 문제

10장. 고급 이벤트
__고급 이벤트 구현을 위한 준비
____추가적인 페이지의 데이터 로딩하기
____호버 동작에서 데이터 표시하기
__이벤트 위임
____제이쿼리 위임 기능의 활용
____위임의 범위 선택하기
____조기에 위임하기
__커스텀 이벤트 정의하기
____무한 스크롤 기능 구현
____커스텀 이벤트 파라미터
__이벤트 성능 조절하기
____이벤트 성능 조절을 위한 또 다른 방법
__이벤트의 확장
____특수한 이벤트
__요약
____참고 자료
__연습 문제

11장. 고급 시각 효과
__심화 학습: 애니메이션
__애니메이션 상태 관찰 및 끼어들기
____애니메이션 상태 확인하기
____재생 중인 애니메이션 중지시키기
__전역 시각 효과 프로퍼티 활용하기
____모든 시각 효과를 불능 처리하기
____시각 효과 재생 시간 정의하기
__다수의 프로퍼티에 대한 완급 조절
__연기 객체의 활용
____애니메이션 약속 객체
__애니메이션에 대한 세밀한 조절 기능
__요약
____참고 자료
__연습 문제

12장. 고급 DOM 요소 조절하기
__테이블 열 정렬
____서버에서 테이블 정렬
____Ajax를 활용한 테이블 정렬
____브라우저 내에서 테이블 정렬
__심화 학습: 요소 이동 및 삽입
__기존 텍스트 주위에 링크 추가하기
____간단한 자바스크립트 배열 정렬하기
____DOM 요소 정렬하기
__DOM 요소와 함께 데이터 정렬하기
____추가적인 사전 연산의 실행
____비-문자열 데이터 정렬하기
____정렬 방향 변경하기
__HTML5 커스텀 데이터 속성 활용하기
__JSON으로 테이블 열 정렬 및 생성하기
____JSON 객체 수정하기
____필요에 따라 콘텐츠 재생성하기
__심화 학습: 속성 수정
____단축형 요소 생성 문법 활용하기
____DOM 조절 후크
__요약
____참고 자료
__연습 문제

13장. 고급 Ajax 기술
__Ajax를 이용한 점진적인 기능 강화 구현
____JSONP 데이터 수집하기
__Ajax 오류 처리
__jqXHR 객체 활용하기
____Ajax 약속 객체
____응답 데이터 캐싱
__Ajax 요청의 조절 기능
__Ajax 기능 확장하기
____데이터 타입 변환기
____Ajax 프리필터 추가하기
____대체 트랜스포트 정의하기
__요약
____참고 자료
__연습 문제

부록 A. QUnit을 활용한 자바스크립트 테스트
__QUnit 다운로드하기
__HTML 문서 설정하기
__테스트 설정하기
__테스트 추가 및 실행
____비동기적인 테스트
__또 다른 유형의 테스트
__실무적인 고려 사항
____참고 자료
__요약

부록 B. 제이쿼리 API 목록
__선택자 표현식
____간단한 CSS 선택자
____형제 요소 중에서의 인덱스 위치
____선택된 요소 중에서의 인덱스 위치
____속성
____폼
____기타 선택자
__DOM 순회 메소드
____필터링
____자손
____형제

★ 지은이의 말 ★

나는 지난 2007년부터 제이쿼리를 사용하기 시작했으며, 현재도 제이쿼리를 이용한다. 지난 10년 동안, 제이쿼리는 대표적인 자바스크립트 라이브러리로서 브라우저 간의 일관성을 더욱 높여줬고, 자바스크립트의 성능 향상에 기여해왔다. 바뀌지 않은 것이 있다면 제이쿼리의 표현의 명료성과 간결성일 것이다. 오늘날 새로운 웹 개발 도구가 끊임없이 배포되고 있지만 제이쿼리는 여전히 웹 개발 업무를 신속하고 효율적으로 처리할 수 있는 유용한 도구로 인정받고 있다.
이 책 역시 제이쿼리의 발전과 함께 성장해왔으며, 어느새 5판에 이르렀다. 이 책의 저자들은 제이쿼리의 핵심 개념을 직관적으로 이해할 수 있도록 설명하고, 쉽게 따라 해볼 수 있는 예제를 제공하기 위해 노력해왔다. 나 역시 이 책의 명성과 저자들의 노고가 헛되지 않도록 최선을 다해 5판을 집필했으며, 최신 웹 개발 환경에서 제이쿼리를 활용할 수 있는 현대적인 방안을 제시하고자 애썼다.

 

★ 옮긴이의 말 ★

지난 10년은 웹 개발 역사에 있어 자바스크립트의 시대라 해도 과언이 아닐 것이다. 웹 브라우저에서만 작동하던 이 소박한 스크립트 언어에 코웃음 치던 시절도 있었지만, 개발자라면 누구도 부인 못할 수준으로 성장하고 중요도를 띠게 된 언어로 주저 없이 자바스크립트를 꼽을 수 있다. 웹이 세상을 지배하게 된 상황에서 클라이언트 측이든 서버 측이든 어디에서나 특유의 질긴 생명력을 발휘하는 언어가 자바스크립트일 것이다. 그런데 마침 그 시기가 우연히도 2006년에 존 레식이라는 탁월한 개발자가 제이쿼리를 배포하고 커뮤니티에서 합심해 개선해온 때와 겹친다. 광활한 자바스크립트 생태계에는 무수히 많은 라이브러리가 존재하지만 제이쿼리만큼 많은 개발자의 선택을 받은 사례는 아직 없을 것이다.
예나 지금이나 제이쿼리는 특유의 명료함, 문법의 간결성으로 복잡한 프로젝트를 좀 더 빠르고 간단하게 수행할 수 있는 방법을 제공한다. 이 책은 지난 10년 이상 대규모 웹 프로젝트에서 자바스크립트를 이용해 다양한 사용자 니즈를 충족시키고, 난해한 문제를 해결해온 세 명의 저자가 5년에 걸쳐 발전시킨 제이쿼리 개발서의 정수라 할 수 있다. 탁월한 개발자가 그렇듯, 이들 세 저자의 설명은 간결하고 예제 코드는 명료하다. 그래서 이해하기도, 활용하기도 쉽다.
이 책을 읽는 독자라면 제이쿼리에 대한 기반 지식이 없더라도 1장에서 13장까지 주요 예제를 모두 실행하면서도 매우 빠른 속도로 나아갈 수 있을 것이다. 이 책은 상호작용성 높은 웹사이트와 웹 애플리케이션을 만들기 위한 제이쿼리의 3대 미덕인 DOM 조절, Ajax 구현, 이벤트 활용에 초점을 맞추고 있다. 다양한 예제와 시행착오에 대한 해설은 독자의 소중한 시간을 아껴줄 것이다. 또한 최근 자바스크립트 업계의 추세에 맞춰 플러그인의 활용, 개발, 통합 부분을 상세히 소개하고 있으며, QUnit을 활용한 테스트 자동화 또한 실무에 즉시 적용하기에 부족함이 없다.