• jQuery 1.3 작고 강력한 자바스크립트 라이브러리

  • 조나단 채퍼, 칼 스웨드버그 지음
  • 이승준 옮김

  • 오픈소스 & 웹 시리즈 _ 015
  • ISBN: 9788992939331
  • 22,000원 | 2009년 09월 17일 발행 | 456쪽



2006년에 등장한 jQuery는 등장한 지 채 2년도 되지 않아 프로토타입(prototype)과 도조(Dojo)의 인지도를 넘어섰다. 이제는 Aptana와 같은 오픈소스 프로젝트뿐만 아니라, 마이크로소프트 비주얼 스튜디오와 같은 많은 상용 제품에도 기본으로 포함되고 있다. jQuery의 간결함과 간편함, 그리고 강력함을 접해본 사람들은 충분히 그럴 만하다고 이야기한다.

jQuery가 작성한 코드는 작고 가벼우면서¬ 동시에 지속적으로 확장할 수 있는 플러그인 구성을 하고 있어, Ajax 사이트를 손쉽게 그리고 강력하게 구현할 수 있도록 해준다. 또한 jQuery의 선택자, 체인, 플러그인을 사용해보면 그 설계 철학과 통찰력에 감복하지 않을 수 없다.

『jQuery 1.3 : 작고 강력한 자바스크립트 라이브러리』는 1.3으로 업데이트된 jQuery 라이브러리에 대한 기본적인 내용을 충분히 다루고 있을 뿐만 아니라, 각 주제마다 실무에 적용해도 될 만한 코드 예제를 그대로 담고 있어 더욱 유용하다. 또 ‘단계적 기능 향상(Progressive Enhancement)’과 같은 웹 개발의 원칙을 충실하게 설명하고 구현하고 있어, 웹표준에 관심 있는 독자들에게도 더 없이 좋은 참고서가 될 것이다.

많은 개발자들이 jQuery와 같은 자바스크립트 라이브러리를 도입하여, 일반적인 작업들을 자동화 하고, 복잡한 작업을 쉽게 처리하고, 좀 더 멋지고 상호 대화적인 사이트를 개발하려 노력하고 있다.

jQuery 라이브러리는 표준 HTML과 CSS 기술을 기반으로 하고 있기 때문에, 프로그래밍 경험이 많지 않은 디자이너들도 손쉽게 상호 작용하는 기능들을 웹 페이지에 추가할 수 있다.

jQuery는 경험이 많은 프로그래머에게도 개념의 일관성을 유지하는 데 많은 도움이 된다. 『jQuery 1.3 : 작고 강력한 자바스크립트 라이브러리』는 1.3으로 업데이트된 jQuery에 대한 내용을 담고 있으며, 웹 페이지에 상호작용과 애니메이션을 추가하는 방법들을 상세하게 알려 준다.

과거에 여러분이 자바스크립트 코드 작성에 조금이라도 어려움을 겪은 적이 있다면 이제는 걱정할 필요가 없다. 이 책은 AJAX, 이벤트, 효과, 고급 자바스크립트 등 많은 jQuery 기능에 대한 좋은 안내서가 될 것이다. 누구를 위한 책인가?

이 책은 웹 디자이너와 개발자를 위한 책이다. 자바스크립트에 대한 기본적인 지식은 꼭 필요하며, HTML과 CSS에 대한 지식과 더불어 자바스크립트 문법에 친숙해야 한다. jQuery에 대한 지식이나 경험은 필요치 않으며, 다른 자바스크립트 라이브러리에 대한 경험도 필요하지 않다.

이 책에서 다루는 내용

  • 프로그래밍 경험이 많지 않은 사람들을 위한 jQuery 소개
  • 특정 클라이언트 측 문제에 대한 상세한 해결 방법들
  • 웹 디자이너들이 웹 페이지에 대화적인 요소들을 추가하는 단계와 방법들
  • 개발자들이 자신의 웹 애플리케이션에 최상의 사용자 인터페이스를 만드는 방법들
  • 명확한 설명을 통해 예제 코드를 활용하는 방법
  • 페이지에서 원하는 요소들을 얻기 위해 선택자를 활용하는 다양한 방법들
  • 페이지의 이벤트를 처리하는 방법들
  • 애니메이션 효과를 추가하여 페이지를 멋지게 꾸미는 기법들
  • jQuery 1.3의 새로운 기능들

조나단 채퍼(Jonathan Chaffer)

미시건 그랜드 래피드에 위치한 '스트럭처 인터랙티브' 사의 기술이사로, 다양한 기술을 사용하여 진행하는 웹 개발 프로젝트를 관리/감독하고 있으며, 동시에 매일 지속적으로 협업하면서 실제 개발작업도 하고 있다. 드루팔(Drupal) CMS에 자바스크립트 프레임워크로 jQuery를 선정하여 적용하는 등 오픈소스 커뮤니티에서도 왕성하게 활동하고 있다. 드루팔 사이트에서 구조적 컨텐츠를 관리하는 모듈로 널리 사용되는 ‘컨텐츠 컨스트럭션 키트(Content Construction Kit)'의 제작자이기도 하며, 드루팔의 메뉴 시스템과 개발자 API 레퍼런스를 담당하는 책임자 역할도 맡고 있다.

 

칼 스웨드버그(Karl Swedberg)

미시건 주 그랜드 래피드에 있는 '스트럭처 인터랙티브' 사의 웹 개발자로 시멘틱 HTML, 잘 구성된 CSS 그리고 간결한 자바스크립트 개발 등 웹표준과 연관된 개발을 주로 진행하고 있다. 웹 개발에 투신하기 전까지 카피 편집자, 고등학교 영어교사 그리고 커피매장 주인이었다. 아직도 식지 않는 기술에 대한 그의 열의는 1990년대 초반 워싱턴 주 레드몬드에 있는 마이크로소프트에서 일을 하면서 시작되었다. 사진, 가라데, 영문법 그리고 아버지의 역할에도 많은 관심을 가지고 있다.

이승준

지난 15년간 웹을 포함하여 C/C , Java, .NET 등 다양한 환경에서 프로그래머로, 관리자로 그리고 경영자로 일을 해왔으며, 개발 프로세스와 플랫폼 비즈니스에 많은 관심을 가지고 있다. 현재 KB투자증권에서 근무하고 있다.

  • 1장 jQuery 시작하기
    • jQuery란 무엇인가
    • jQuery, 왜 좋은가
    • jQuery 프로젝트의 역사
    • 첫 번째 jQuery 도큐먼트
      • jQuery 다운로드
      • HTML 도큐먼트 설정
      • jQuery 코드 작성
      • 완성된 산출물
  •  
  • 2장 선택자
    • DOM
    • $() 팩터리 함수
    • CSS 선택자들
    • 속성 선택자
    • 사용자정의 선택자들
      • 행에 징검다리 스타일 입히기
      • 폼 선택자
    • DOM 순회 메서드들
      • 특정 셀에 스타일 입히기
      • 체인
    • DOM 요소 접근하기
  •  
  • 3장 이벤트
    • 페이지 로드 시점에 작업 수행하기
      • 코드 실행 시간
      • 하나의 페이지에 다중 스크립트 사용하기
      • 간결하게 단축된 코드
      • 다른 라이브러리와 공존
    • 기본 이벤트들
      • 간단한 스타일 변환기
      • 간소화서된 이벤트
    • 합성 이벤트
      • 개선된 보이기와 숨기기 특징
      • 클릭 가능한 아이템들 강조하기
    • 이벤트의 여행
      • 이벤트 버블링의 부작용
    • 진행 경로 수정하기 : 이벤트 객체
      • 이벤트 대상
      • 이벤트 전파 멈추게 하기
      • 기본 동작들
      • 이벤트 위임
    • 이벤트 핸들러 제거하기
      • 이벤트 네임스페이스
      • 이벤트 다시 바인딩하기
    • 사용자 상호작용 흉내내기
      • 키보드 이벤트
  •  
  • 4장 효과
    • 인라인 CSS 변경
    • 기본적인 숨김과 보이기
    • 효과와 속도
      • 속도 지정하기
      • 페이드인, 페이드아웃
    • 복합 효과
    • 사용자 정의 애니메이션 만들기
      • 페이드 토글하기
      • 여러 프로퍼티를 애니메이션하기
    • 동시효과 대 연속효과
      • 요소들의 단일 집합 다루기
      • 요소들의 다중 집합 다루기
      • 콜백
      • 핵심정리
  •  
  • 5장 DOM 다루기
    • 속성 조작하기
      • class 이외의 속성들
      • $() 함수 다시 보기
    • 새로운 요소 삽입하기
    • 요소 이동
      • 표시하기, 숫자 부여하기, 컨텍스트와 연결하기
      • 주석 추가하기
    • 요소 감싸기
    • 요소 복사하기
      • 이벤트 복제하기
      • 인용표시 복제하기
      • CSS 나누기
      • 코드 검토
      • 인용표시 꾸미기
    • DOM 조작 메서드 핵심정리
  •  
  • 6장 AJAX
    • 필요할 때 데이터 로드하기
      • HTML 추가하기
      • 자바스크립트 객체로 작업하기
      • XML 도큐먼트 로드하기
    • 데이터 형식 선택하기
    • 서버로 데이터 전달하기
      • GET 요청 수행하기
      • POST 요청 수행하기
      • 폼 직렬화하기
    • 요청이 처리 중임을 표시하기
    • AJAX와 이벤트들
    • 보안 제약사항들
      • 원격 데이터를 위한 JSONP
    • 추가적인 옵션
      • 저수준 AJAX 메서드
      • 기본 옵션 변경하기
      • HTML 페이지의 일부를 로드하기
  •  
  • 7장 테이블 다루기
    • 정렬과 페이징
      • 서버 측 정렬
      • 자바스크립트로 정렬 구현하기
      • 서버 측 페이징
      • 자바스크립트로 페이징하기
      • 완성된 코드
    • 테이블 외형 수정
      • 행 하이라이트
      • 툴팁
      • 접기와 펼치기
      • 필터링
      • 완성된 코드
  •  
  • 8장 폼과 함수
    • 기본 폼의 기능 향상
      • 폼 스타일의 단계적 기능향상
      • 선택적으로 표시되는 필드들
      • 폼 입력 유효성 검사
      • 체크박스 다루기
      • 완성된 코드
    • 단순한 폼
      • 플레이스홀더 텍스트
      • AJAX 자동완성
      • 완성된 코드
    • 수치입력 다루기
      • 장바구니 테이블 구조
      • 숫자가 아닌 입력 무시하기
      • 숫자 계산
      • 물품(아이템) 삭제하기
      • 배송 정보 편집하기
      • 완성된 코드
  •  
  • 9장 셔플러와 로테이터
    • 헤드라인 로테이터
      • 페이지 설정
      • 피드 읽기
      • 로테이터 설정
      • 헤드라인 로테이션 함수
      • 호버 시 멈춤
      • 다른 도메인에서 피드 읽어오기
      • 점진적 페이드 효과
      • 완성된 코드
    • 이미지 회전
      • 페이지 설정
      • 이미지 클릭시 셔플링하기
      • 이미지 확대
      • 완성된 코드
  •  
  • 10장 플러그인
    • 플러그인과 사용법 찾기
    • 플러그인 사용법
    • 폼 플러그인
      • 팁과 기교
    • jQuery UI 플러그인 라이브러리
      • 효과
      • 상호작용 컴포넌트
      • 위젯
      • jQuery UI 테마롤러
    • 추천 플러그인
      • 폼 플러그인
      • 테이블 플러그인
      • 이미지 플러그인
      • 라이트박스와 모달 다이얼로그
      • 차트
      • 이벤트
  •  
  • 11장 플러그인 개발
    • 새 전역 함수 추가
      • 여러 함수 추가하기
      • 핵심은 무엇인가?
      • 유틸리티 메서드 만들기
    • jQuery 객체 메서드 추가
      • 객체 메서드 컨텍스트
      • 메서드 체인
    • DOM 탐색 메서드
    • 새 단축 메서드 추가하기
    • 메서드 파라미터
      • 간단한 파라미터
      • 파라미터 맵
      • 기본 파라미터 값
      • 콜백함수
      • 커스터마이즈 가능한 기본 값
    • 선택자 표현식 추가
    • 플러그인 배포하기
      • 이름 짓기
      • $ 별칭 사용
      • 메서드 인터페이스
      • 문서화 스타일
  •  
  • 부록 A. 온라인 리소스
    • jQuery 문서
    • 자바스크립트 참조문서
    • 자바스크립트 코드 압축기
    • (X)HTML 레퍼런스
    • CSS 레퍼런스
    • 유용한 블로그들
    • jQuery를 적용한 웹 개발 프레임워크
  •  
  • 부록 B. 개발 도구들
    • 파이어폭스용 도구들
    • 인터넷 익스플로러용 도구들
    • 사파리용 도구들
    • 오페라를 위한 도구들
    • 기타 다른 도구들
  •  
  • 부록 C. 자바스크립트 클로저
    • 내부 함수
    • 클로저 간의 상호작용
    • jQuery에서의 클로저
    • 메모리 누수 위험
    • 결론
  •  
  • 부록 D. 퀵 레퍼런스
    • 선택자 표현식
    • DOM 순회 메서드들
    • 이벤트 메서드
    • 효과 메서드
    • DOM 조작 메서드
    • AJAX 메서드
    • 기타 메서드
  • 11쪽

    function emphasizePoemStanzas() ---> highlightPoemStanzas()

  • 24쪽

    .odd 선택자 ---> :odd 선택자

  • 24쪽

    background-colgmlrmror ---> background-color

  • 25쪽

    font-style: italics ---> font-style: italic

  • 26쪽

    체트된 라디오 버튼 ---> 체크된

  • 39쪽

    'body') ---> $('body')

  • 57쪽

    항목의 개수를 상관없다 ---> 개수는

  • 64쪽

    포커스을 ---> 포커스를

  • 71쪽

    currentsize 변수 ---> num 변수

  • 73쪽

    'px ---> 'px'

  • 82쪽

    가변너비(flexiblie-witdth) ---> flexible-width

  • 84쪽

    .animation() 뿐만 아니라 -> .animate() 뿐 아니라

  • 96쪽

    도규먼트 요소 ---> 도큐먼트

  • 102쪽

    일렬로 나열된 하나의 주석으로 보인다.

    --> 예제가 잘못되었습니다. 아래와 같이 문단 구분이 없이 한 줄로 보여야 합니다.

    노동자 계급 중에서도 그래도 좀더 나은 부류의 아들과 딸들의 결혼은 그의 자손에 가서는 거의 정삼각형에 가까운 그룹을 이루는 경우도 있다. 그리고 이후로는 이전까지의 집이나 친척집을 다시 방문하지 않겠다는 서약을 하게되는데,이는 무의식적으로 그들의 행동을 모방해 이전의 낮은 신분으로 떨어질까봐 염려해서다. 자연의 원리에 부합하도록 완전하다. 플랫랜드의 주에서 귀족 강령은 거의 신성하다고 말하고 싶다!

  • 108쪽

    ```

    <

    div class="chapter">:

    $('div.chapter p:eq(0)').clone(); ```

    불필요한 <div class="chapter">: 제거

  • 113쪽

    <span class="drop">를 생략부호로 바꾸었으니 예제의 '남자 아이는 아버지보다 변의 수가 하나 더 많은 도형으로 인정받는 법률을 만들었다.' 는 '남자 아이는 … 변의 수가 하나 더 많은 도형으로 인정받는 법률을 만들었다.' 로 나타나야 함.

  • 139쪽

    예제. strtoupper($_REQUEST'term');를 사용했으니 대문자로.

    Editor ---> EDITOR

  • 170쪽

    직업 DOM에 ---> 직접

  • 176쪽

    newDirection ---> sortDirection

  • 181쪽 예제

    vvar ---> var

  • 200쪽

    툴팁 텍스트를 선택하도 ---> 선택해도

  • 208쪽

    스트라이프가를 ---> 스트라이프를

  • 220쪽

    front-weight ---> font-weight

  • 225쪽

    1. 특정 브라우저에서 페이지를 갱신했을 때 생태를 ---> 상태를
  • 238쪽

    // 포커스를 잃을 때(blue) -> (blur)

  • 380쪽

    반환하도로 ---> 반환하도록

  • 390쪽

    자바스크립트에 대한 방대한 뉴스와 기능들에 ---> 기능들이

  • 397쪽

    니토비버그(Notobibug) ---> (NitobiBug)

예제코드 관련 GitHub 페이지

관련 글


엮인 글

엮인 글 주소: http://wikibook.co.kr/jquery-1-3/trackback/