NHN은 이렇게 한다! 자바스크립트 UI 개발과 Jindo 프레임워크

Part 01 자바스크립트 프레임워크와 Jindo 프레임워크

01_ 자바스크립트 프레임워크와 UI 개발
AJAX 기술의 등장과 UI 개발의 시작
웹 애플리케이션과 UI 개발
자바스크립트 프레임워크

02_Jindo 프레임워크
Jindo 프레임워크의 역사
Jindo의 특징
Jindo 프레임워크의 구조
Jindo 프레임워크 사용

Part 02 Jindo 프레임워크

03_요소 선택과 조작
문서 객체 모델(DOM)과 요소 선택
CSS 선택자(Selector)와 요소 선택
요소 조작

04_ 브라우저와 문서 영역 조작하기
브라우저 창과 문서 영역
브라우저와 문서 영역 조작

05_이벤트와 이벤트 처리
이벤트와 이벤트 처리
Jindo의 이벤트 핸들링과 함수 바인딩

06_데이터 다루기
데이터 타입과 래퍼 객체
Jindo의 데이터 래퍼 객체

07_폼 데이터 검증
이벤트를 활용한 폼 데이터 검증
간단한 데이터 검증

08_서버와 통신하기
XHR 객체 이해하기
XHR 객체로 통신하기
$Ajax( ) 객체 기본 사용법
$Ajax( ) 객체 실습하기
그 외의 $Ajax( ) 객체 사용법

09_클래스와 템플릿
객체지향적으로 설계하기
템플릿을 활용한 DOM 구성

10_ 그 밖의 유용한 객체
날짜 조작하기
쿠키 사용하기
브라우저 정보 확인

Part 03 자바스크립트 UI 개발 실전 사례

11_레이어 다루기
레이어 보이기와 숨기기
레이어 배치하기
영역 크기 구하기
레이어 응용하기

12_드래그 앤드 드롭
드래그 앤드 드롭 과정
기본 구현
고급 구현 및 문제 해결
HTML5의 드래그 앤드 드롭

13_타이머
기본 사용법
응용 패턴 익히기

14_애니메이션
구현방법
CSS 속성을 이용한 애니메이션
타이머를 이용한 애니메이션

15_AJAX 고급 응용
크로스 도메인 문제
AJAX 히스토리

16_실시간 급상승 검색어의 롤링
UI 요구사항
롤링 동작 구현
마우스 오버 동작 처리
재사용 가능한 클래스 객체로 만들기

17_ 도서 관리 웹 애플리케이션 만들기
웹 애플리케이션 기획
요구사항
인터페이스 만들기
애플리케이션 설계
모델 만들기
컨트롤러 만들기
이벤트 적용
기능 개선

Part 04 부록

부록 A _코드 최소화를 통한 성능 향상
최소화(Minification)의 원리
최소화 도구 - YUI Compressor
최소화 코드 복원 - 코드 포매팅

부록 B _디버깅
브라우저 개발 도구
HTTP 트래픽 정보를 활용한 디버깅

부록 C _정규 표현식
정규 표현식과 문자열
정규 표현식 선언하기
캡처링(Capturing) 사용하기
비캡처링(Non-Capturing) 활용
test( ) 메서드와 exec( ) 메서드의 성능 차이
lastIndex 속성과 g플래그 옵션

부록 D _자바스크립트 코딩 컨벤션
네이밍 규칙
코드 작성 규칙
AJAX 응답 포맷 작성 규칙
소스 코드 표기법

네이버의 UI 웹 페이지 가운데 대부분은 'Jindo'라는 자바스크립트 프레임워크를 사용합니다. 다양하고 복잡한 웹 UI를 포함하는 포털 사이트에서 수년간의 UI 개발로 다져진 탄탄한 API와 컴포넌트들은 여러분들이 귀찮아하고 어려워하는 호환성 문제를 말끔히 해결해 줄 수 있으며 개발 생산성을 높여줄 것입니다. 또한 네이버 개발자센터에서 Jindo 프레임워크 개발자와 이 책의 저자들의 직접적인 지원을 받을 수도 있습니다.

이 책은 네이버의 UI 개발을 담당하는 개발자들이 지금까지 경험한 지식을 일반화한 것입니다. 이 책에서는 갖은 브라우저 호환성 이슈를 해결하기 위해 노력하고 메일이나 지도 같은 대형 AJAX 서비스를 만드는 과정에서 축적한 지식을 풀어서 설명합니다. 네이버의 UI는 대부분 이 책에서 제시하는 코드 및 패턴과 크게 다르지 않습니다.

또한 이 책에서는 언어적인 문법을 자세히 설명하지 않지만 실무에서 바로 활용할 정도의 수준으로 실용성을 높이게끔 구성돼 있습니다. 프레임워크의 API만 나열하는 참고서 역할을 벗어나 책의 절반에 해당하는 분량을 예제 위주로 구성했습니다. 심지어 2부의 프레임워크의 설명에서도 많은 예제를 바탕으로 실제 사용법에 관해 자세히 설명합니다. 이처럼 예제 위주로 책을 구성하면 독자가 프로그래밍 서적을 읽고 나서 '이제 내가 실전에 활용하려면 어떻게 해야 할까?'라는 고민을 덜 수 있습니다.

아울러 이 책에서는 처음부터 끝까지 원리를 잘 설명하고 있습니다. 예제를 모두 따라 해보거나 암기 위주로 책을 보지 않아도 순간순간 다른 책에서는 보기 어려운 원리 설명이 분명히 크게 도움될 것입니다. 이 책의 저자들은 수년간 네이버의 UI를 설계하고 개발해 온 UI 개발의 최고 전문가로 인정받고 있습니다. 그뿐 아니라 웹 서비스의 프런트엔드 성능 교육을 전담하며 HTML5와 하이브리드 애플리케이션 같은 최신 기술에 대해서도 전문가로 활동하고 있습니다.

자바스크립트 UI 개발은 점점 복잡하고 어려워지고 있으며 전문 개발자 또한 매우 부족한 상황입니다. 이 책으로 더 많은 국내 개발자들이 UI 개발에 대한 기술력을 향상시키고 조금 더 쉽게 지식과 경험을 습득해서 이 분야의 전문가로 성장하기를 기대합니다.

"자, 이제 주저하지 마시고 이 책을 얼른 펼쳐서 읽어 나가시길 바랍니다."