구글 웹 툴킷, GWT는 오픈소스로 개발된 자바 소프트웨어 개발 프레임워크로서, 브라우저 관련 언어에 익숙하지 않은 개발자도 구글 맵이나 지메일 같은 AJAX 애플리케이션을 쉽게 제작하는 데 쓰인다.

GWT는 여러 브라우저 플랫폼에 적합한 강력하고 생산성 높은 애플리케이션을 제작하는 데 필요한 AJAX의 핵심 기능을 제공하고 있다. GWT를 통해 사용자 경험을 크게 향상시켜주면서 안정적으로 동작하는 유저 인터페이스를 만들 수 있다.


[ 책 소개 ]

AJAX 애플리케이션이란, 뛰어난 상호 작용성과 사용자 경험(user experience)을 제공하는 동시에, 기존 데스크탑 애플리케이션 수준의 기능을 제공하면서도 다운로드나 설치 과정 없이 사용할 수 있는 웹 애플리케이션이다.

AJAX 애플리케이션은 XML 데이터를 교환하는 기술과 인터페이스를 제공하기 위한 HTML 및 CSS 기술, 서버 애플리케이션과 비동기적으로 통신하기 위한 XMLHttpRequest 객체 기술, 그리고 애플리케이션에 제공된 데이터와 동적으로 상호 작용하기 위한 자바스크립트 기술 등을 조합해 작성한다. 이러한 AJAX 기술을 통해 웹 2.0 시대에 적합한 애플리케이션, 즉 데스크탑 애플리케이션 수준으로 동작하는 웹 애플리케이션을 제작할 수 있다. AJAX를 사용하면 웹 페이지를 다시 로딩하지 않고도 백그라운드에서 서버와 통신할 수 있을 뿐만 아니라, 화면 깜박임 없이 웹 페이지의 일부분만 부드럽게 변경할 수 있다. 뿐만 아니라 AJAX를 쓰면 워드프로세서나 스프레드시트, 그림판 등과 같은 기존의 데스크탑용 애플리케이션도 웹 기반으로 사용자에게 제공할 수 있다.

GWT는 이러한 AJAX 애플리케이션을 자바 언어를 이용하여 제작할 수 있는 자바 기반 개발 환경을 제공한다. GWT는 XMLHttpRequest 객체 API를 캡슐화하여 브라우저 호환성과 관련한 이슈를 최소화했다. 따라서 GWT를 사용하면 각 브라우저의 특성에 맞추는 작업을 최소화할 수 있기 때문에, 쉽고 빠르게 AJAX 애플리케이션을 만들 수 있다. 또한 사용자 인터페이스에 위젯을 사용할 수 있는 프레임워크를 제공하기 때문에, SWT(Standard Widget Toolkit)나 스윙 스타일의 프로그래밍도 가능하다. 자바 프로그래밍 언어와 이벤트 기반의 인터페이스 개발 프레임워크에 익숙한 개발자에게, GWT는 생산성을 높이고 개발 속도를 단축시키기 위한 뛰어난 도구가 될 것이다.

GWT에서는 가져다 쓰기만 하는 형태의 UI용 위젯들을 제공해 새로운 애플리케이션을 신속하게 제작할 수도 있다. 또한 기존 위젯들을 조합해 새로운 위젯을 만드는 기능도 제공한다. 이클립스 IDE로 AJAX 애플리케이션을 작성하고 디버깅하고 유닛 테스트를 수행할 수도 있고, GWT RPC 프레임워크를 사용하면 특정 기능을 웹 애플리케이션에서 비동기적으로 접근 가능하게 만드는 것도 쉽다. GWT는 다양한 언어로 작성된 서비스들과 쉽게 통합하는 기능을 제공하기 때문에, 기존에 작성된 애플리케이션의 사용자 경험을 빠른 시간에 향상시킬 수 있다.


[ 이 책에서 다루는 내용 ]

■ 이클립스에 GWT 개발 환경을 구축하는 방법
■ GWT 애플리케이션을 작성하고 테스트, 디버깅, 배포하는 방법
■ 달력 위젯과 날씨 위젯 예제를 통한 자신만의 위젯을 만드는 방법
■ GWT 애플리케이션을 국제화하는 방법
■ 그리드나 위치 변경할 수 있는 엘리먼트 등을 이용한 복잡한 인터페이스 제작 방법
■ GWT에서 JSNI를 사용해 Rico나 Moo.fx, Script.aculo.us 등과 같은 라이브러리를 통합해 UI를 멋지게 꾸며보는 방법


[ 이 책의 대상 독자 ]

이 책에는 GWT를 사용해 전문적인 웹 애플리케이션에 필요한 인터페이스를 제작하는 데 필요한 내용을 담고 있다. 따라서 자바로 고급 애플리케이션을 작성해본 독자를 대상으로 했다. 웹 기반 유저 인터페이스를 제작해 본 경험이 있다면 큰 도움은 되겠지만, 반드시 자바스크립트나 DHTML에 대해 잘 알고 있을 필요는 없다. 이러한 부분은 GWT가 알아서 처리해준다.


[ 이 책의 구성 ]

1장에서는 GWT에 대해 간략히 소개하고, GWT를 다운로드하고 설치한 다음, 예제 애플리케이션을 실행시켜본다.

2장에서는 다른 도구의 도움 없이 GWT 애플리케이션을 직접 작성해본 다음, 이클립스에서 GWT 프로젝트를 생성해 랜덤 인용문 생성기를 작성하고 실행시켜 본다.

3장에서는 GWT의 비동기 서비스에 대해 개괄적으로 살펴본 다음, 소수 판별 서비스를 작성해본다.

4장에서는 GWT로 사용자와 상호 작용하는 간단한 유저 인터페이스를 만들어본다. 여기서 라이브 검색, 폼 자동 완성, 테이블 정렬 기능, 동적 리스트, 플리커 스타일의 에디터블 레이블 등을 만들어본다.

5장에서는 좀더 복잡한 유저 인터페이스를 구현하는 데 필요한 GWT의 고급 기능을 소개한다. 이 장에서는 페이지 방식 테이블, 에디터블 트리 노드, 로그 스파이, 포스트잇, 직소 퍼즐 등을 만들어본다.

6장에서는 자바스크립트 네이티브 인터페이스(JSNI, Javascript Native Interface)를 소개하고, 이를 이용해 Moo.fx나 Rico와 같은 써드 파티 라이브러리를 사용해본다. 또한 JSNI 대신 gwt-widgets 프로젝트를 사용하여 Script.aculo.us에서 제공하는 여러 가지 이펙트도 사용해본다.

7장에서는 자신만의 GWT 위젯을 만드는 방법에 대해 설명한다. 이를 위해 달력 위젯과 날씨 위젯을 만들어본다.

8장에서는 GWT 서비스와 애플리케이션에 대한 유닛 테스트를 작성하고 실행하는 방법을 소개한다.

9장에서는 GWT에서 제공하는 국제화(I18N) 지원 기능과 클라이언트 부분의 XML 지원 기능에 대해 살펴본다.

10장에서는 앤트와 이클립스를 사용해 GWT 애플리케이션을 배포하는 방법에 대해 설명한다.

[ 저자 소개 ]

프라바카 샤간티
아틀란타 외곽의 소프트웨어 회사에서 엔터프라이즈 소프트웨어 아키텍트이자 오픈 소스 에반젤리스트로서 활동하고 있으며, 리눅스와 루비, 파이썬, 자바, 가상화 등에 관심이 많다. 그는 2006년 VMW에서 가장 혁신적인 버추얼 어플라이언스를 선정하는 얼티밋 글로벌 버추얼 어플라이언스 챌린지(Ultimate Global Virtual Appliance Challenge)에서 커뮤니티 초이스 어워드를 수상한 바 있다.


[ 저자 서문 ]

짧은 기간 동안 클라이언트/서버 아키텍처에 너무나 많은 변화가 있었다. 초기에는 애플리케이션마다 자체 UI를 갖춘 클라이언트 소프트웨어를 별도로 제공했다. 그래서 애플리케이션을 사용하려면 전용 소프트웨어를 설치해야 할 뿐만 아니라, 애플리케이션이 변경될 때마다 매번 업데이트해야 했다. 웹의 시대가 도래하면서 애플리케이션을 인터넷에 배포하여, 언제 어디서나 웹 브라우저만 있으면 애플리케이션을 사용할 수 있게 되었다. 웹의 등장이 큰 혁신을 불러일으키긴 했으나 여전히 성능에 관련된 문제점이 지적되고 있으며, UI나 응답 속도가 기존 데스크탑 애플리케이션보다 떨어지는 경향이 있다. 이러한 상황에 AJAX가 등장해 웹 페이지의 UI와 응답 속도를 데스크탑 애플리케이션 수준으로 끌어올릴 수 있게 되었다. AJAX는 웹 2.0이라는 최신 동향에 부합하는 애플리케이션 개발에도 핵심적인 역할을 하고 있다. 하지만 AJAX 애플리케이션을 제작하려면, 개발자가 최소한 HTML과 XML, 자바스크립트에 대해 잘 알고 있어야 한다.

구글 웹 툴킷(GWT, Google Web Toolkit)은 자바 프로그래밍 언어만으로 AJAX 애플리케이션을 쉽게 작성할 수 있는 도구다. GWT는 오픈 소스 프레임워크로서, 개발자로 하여금 브라우저와 플랫폼 호환성에 대한 고민으로부터 해방시켜주는 점이 가장 큰 특징이라고 볼 수 있다. GWT는 자바로 작성한 코드를 자바스크립트와 HTML로 변환해 브라우저에서 실행할 수 있기 때문에, 모듈화에 대한 고민도 자연스레 해결해준다. 또한 스윙이나 AWT, SWT 등과 같은 GUI 툴킷으로 자바 애플리케이션을 개발하는 기존 프로그래밍 환경과 유사한 프레임워크를 제공한다. GWT는 핵심적인 유저 인터페이스 위젯과 이러한 위젯에 발생하는 이벤트를 처리하는 리스너를 제공하고 있을 뿐만 아니라, 이 둘을 잘 조합해 GWT 개발팀조차 상상하지 못한 새로운 위젯을 만드는 기능도 제공한다. 또한 GWT를 통해 기존 프로그램을 쉽게 재활용할 수 있어서, 새로운 기능을 도입하기 위해 매번 생소한 기술을 익혀야 하는 부담도 최소화할 수 있다. 자바에 익숙한 개발자라면 이클립스 같은 친숙한 IDE에서 AJAX GWT 애플리케이션을 자바로 작성하고 디버깅할 수 있다. 물론 코드에서 브레이크 포인트를 설정할 수도 있고, 클라이언트와 서버 부분을 하나의 애플리케이션처럼 자연스럽게 디버깅할 수 있다. 이렇게 작성한 애플리케이션은 어떠한 서블릿 컨테이너에도 배포할 수 있으며, 유닛 테스트를 수행할 수도 있다. 즉 자바 애플리케이션을 개발하듯 GWT 애플리케이션을 개발할 수 있다. 이 책을 읽고 이클립스를 띄운 다음, AJAX와 GWT 프로그래밍 세계에 한번 빠져보자.

이 책에서는 먼저 GWT를 다운로드하고 설치하는 방법을 소개한 다음, GWT 애플리케이션을 작성하고, 테스트하고, 디버깅하고, 배포하는 방법을 차례대로 설명한다. 이 과정에서 재미있고 인터랙티브한 유저 인터페이스도 만들어보고, JSNI를 이용해 GWT에서 Rico나 Moo.fx 라이브러리도 사용해볼 것이다. GWT에서 기본적으로 제공하지 않는 맞춤형 위젯을 제작하는 방법을 배우면서 달력과 날씨 위젯을 만들어본다. GWT에서 제공하는 I18N과 XML 관련 기능을 살펴보고, 유닛 테스트를 제작하는 방법을 배운 다음, 마지막으로 GWT 애플리케이션을 톰캣과 같은 서블릿 컨테이너에 배포하는 방법도 설명한다. 이 책은 실습을 중심으로 다양한 주제를 설명한다. 즉 먼저 해당 주제에 대한 예제를 작성해본 다음, 기술적인 내용을 자세히 설명한다.


[ 감수자 소개 ]

루카 마시니
1971년 플로랑스에서 출생했으며, 소프트웨어 엔지니어와 웹 아키텍트로 활동하고 있다. 자바가 처음 나올 때부터 이탈리아 은행과 회사에서 컨설턴트로서 소프트웨어를 개발했으며 다양한 플래그쉽 프로젝트를 이끈 테크니컬 리더이기도 하다. 당시 코볼을 주로 사용하던 시스템에 썬의 J2EE를 도입했으며, 오픈 소스에도 관심을 두면서 IoC 컨테이너, ORM 툴, UI 프레임워크 등을 개발했다. 스프링, 하이버네이트, 스트럿츠 등과 같은 제품을 일찍 도입해 고객에게 새로운 기술을 일찍 맛볼 수 있게 해주기도 했다. 작년에는 GWT에 푹 빠져있는 와중에도 오라클의 ADF Faces 프레임워크에 비주얼 IDE로 JDeveloper를 사용하는 프로젝트를 수행하기도 했다.

트래비스 S. 슈미트
현재 아이오와 대학의 위생학 연구소에서 애플리케이션 개발자로 일하고 있다. 수년간 웹 기반 클라이언트를 설계하고 개발한 경험이 있으며, 최근에는 구글 웹 툴킷으로 시스템을 구축한 바 있다.


[ 역자 소개 ]

남기혁
고려대 컴퓨터학과를 졸업하고 동 대학원 정형기법연구실에서 석사 학위를 받았다. 한국전자통신연구원에서 개인용 웹 플랫폼 및 서비스 기술에 대한 연구에 참여하고 있으며, 기술서적 번역과 자동차에 푹 빠져 살고 있다.


[ 역자 서문 ]

웹 사이트에서 회원 가입을 할 때 입력한 정보를 서버로 전송하기 전에 주민등록번호나 비밀번호 등을 간단히 검사하는 용도로만 사용하는 줄 알았던 자바스크립트가 여러 차례 발전을 거듭하여 최근에는 구글의 여러 서비스를 통해 널리 알려지며 AJAX라는 기술로 성장했습니다. 이제는 웹 애플리케이션을 구현하는 데 서버 부분보다는 AJAX를 이용한 클라이언트 구현이 더 큰 비중을 차지하지 않을까 생각될 정도입니다. 하지만 AJAX로 웹 애플리케이션을 작성하는 과정은 겉보기와 달리 깔끔하지 않습니다. HTML, 자바 스크립트, 여기에 비동기 요청/응답으로 인한 복잡한 동작까지 고려하다 보면, 차라리 기존 데스크탑 애플리케이션을 만드는 것이 편하다는 생각마저 들게 됩니다. GWT는 이러한 웹 애플리케이션의 클라이언트 구현에 대한 부담을 크게 덜어준다는 점에서 아주 매력적인 도구입니다. 웹 애플리케이션의 대부분을 자바 언어로만 작성할 수 있기 때문에, 여러 언어와 모듈로 인한 혼란으로부터 해방되어 애플리케이션의 로직에 좀 더 집중할 수 있다는 점은 특히 자바 웹 개발자에게 큰 장점으로 다가올 것입니다.

이 책은 자바와 기존 웹 기술에 어느 정도 익숙한 개발자가 GWT라는 새로운 도구의 기능과 사용법을 빠른 시간에 익힐 수 있도록, 이론을 장황하게 설명하기보다는 여러 가지 예제를 직접 작성하고 실행하는 방식으로 이야기를 풀어갑니다. 각 실습 과정이 핵심적인 부분을 중심으로 나열되어 있기 때문에, 독자가 책에 나온 대로 무작정 따라하기보다는 배운 내용을 곰곰이 생각하면서 부족한 부분은 나름대로 채워 나갈 수만 있다면, GWT 핵심을 빠른 시간에 파악할 수 있을 것입니다.

목차

• 1장 시작하기 21
  • GWT 소개 21
  • GWT 다운로드 23
    • 따라하기: GWT 다운로드 23
  • GWT 예제 살펴보기 28
    • 따라하기: KitchenSink 28
  • GWT 라이센스 32
  • 정리 33
    
• 2장 GWT 애플리케이션 35
  • 애플리케이션 자동 생성 35
    • 따라하기: applicationCreator 스크립트 사용법 36
  • 이클립스를 지원하는 애플리케이션 생성 42
    • 따라하기: HelloGWT 수정 42
  • 랜덤 인용문 생성기 45
    • 따라하기: 자동 생성된 코드 수정 45
  • 호스트 모드에서 애플리케이션 실행하기 50
    • 따라하기: HelloGWT-Shell 스크립트 51
  • 웹 모드에서 애플리케이션 실행하기 52
    • 따라하기: 애플리케이션 컴파일 52
  • 정리 56
    
• 3장 서비스 만들기 57
  • 서비스 정의 인터페이스 58
    • 따라하기: 소수 판별 서비스 58
  • 비동기 서비스 정의 인터페이스 60
    • 따라하기: AJAX 지원 기능 활용하기 60
  • 서비스 구현 61
    • 따라하기: 서비스 구현하기 61
  • 서비스 사용 66
    • 따라하기: 클라이언트 만들기 66
  • 정리 69
    
• 4장 인터랙티브 폼 71
  • Samples 애플리케이션 71
  • 라이브 검색 72
    • 따라하기: 라이브 검색 73
  • 패스워드 안전성 검사 80
    • 따라하기: 패스워드 안전성 검사 80
  • 폼 자동 완성 88
    • 따라하기: 폼 자동 완성 기능 88
  • 테이블 정렬 98
    • 따라하기: 테이블 정렬 기능 98
  • 동적 리스트 107
    • 따라하기: 동적 리스트 구현 107
  • 플리커 스타일의 에디터블 레이블 119
    • 따라하기: 커스텀 에디터블 레이블 119
  • 정리 127
    
• 5장 고급 인터페이스 129
  • 페이지 방식 테이블 129
    • 따라하기: 데이터 인터페이스 130
  • 에디터블 트리 노드 138
    • 따라하기: 노드 편집 기능 139
  • 로그 스파이 143
    • 따라하기: 로그 파일 업데이트 143
  • 스티키 노트 151
    • 따라하기: 스티키 노트 기능 152
  • 직소 퍼즐 156
    • 따라하기: 퍼즐 만들기 157
  • 정리 162
    
• 6장 JSNI와 자바스크립트 라이브러리를 이용한
  • 브라우저 효과 165
  • JSNI 소개 165
  • Moo.Fx 167
    • 따라하기: JSNI 활용 167
  • Rico 둥근 모서리 효과 176
    • 따라하기: 레이블 꾸미기 177
  • Rico 컬러 셀렉터 181
    • 따라하기: 컬러 메소드 181
  • Script.aculo.us 188
    • 따라하기: 효과 적용하기 189
  • 정리 197
    
• 7장 커스텀 위젯 199
  • 달력 위젯 199
    • 따라하기: 달력 만들기 200
  • 날씨 위젯 216
    • 따라하기: 날씨 정보 서비스 만들기 216
  • 정리 235
  • 8장 유닛 테스트 237
  • GWT 페이지 테스트 238
    • 따라하기: 유닛 테스트 생성 238
  • 비동기 서비스 테스트 242
    • 따라하기: 비동기 서비스 테스트하기 242
  • 비동기 서비스를 사용하는 GWT 페이지 테스트 246
    • 따라하기: 두 예제 합치기 246
  • 테스트 스위트 생성 및 실행 249
    • 따라하기: 테스트 스위트 제작 249
  • 정리 251
    
• 9장 I18N과 XML 253
  • 국제화 (I18N) 253
    • 따라하기: I18N 지원 기능 254
  • XML 문서 생성 261
    • 따라하기: XML 문서 생성 261
  • XML 문서 파싱 267
    • 따라하기: 클라이언트측에서 XML 파싱하기 267
  • 정리 271
  • 10장 배치 273
  • 톰캣에 직접 배치하기 273
    • 따라하기: GWT 애플리케이션 배치하기 273
  • 앤트를 이용한 자동 배치 279
    • 따라하기: 앤트 빌드 파일 작성 279
  • 이클립스에서 배치하기 282
    • 따라하기: 이클립스에서 앤트 실행 283
  • 정리 286
    

[ p60 코드 3행 ]
public void isPrimeNumber(int numberToVerify, AsyncCallbackcallback);
→ public void isPrimeNumber(int numberToVerify, AsyncCallback callback);

[ p67 코드 2행 ]
new ClickListener()) → new ClickListener()

[ p67 코드 12-18행 ]
if(((Boolean) result).booleanValue()){
Window.alert(primeNumber.getText() + "은(는) 소수가 아닙니다.");
}else{
Window.alert("+ primeNumber.getText() + "은(는) 소수가 아닙니다.");
}
↓
if(((Boolean) result).booleanValue()){
Window.alert(primeNumber.getText() + "은(는) 소수입니다.");
}else{
Window.alert(primeNumber.getText() + "은(는) 소수가 아닙니다.");
}

[ p75 두 번째 코드 2행 ]
endpoint.setServiceEntryPoint("/Samples/livesearch");
→ endpoint.setServiceEntryPoint(GWT.getModuleBaseURL() + "livesearch");

[ p144 세 번째 코드 2행 ]
private File logfile = new File("test2.log");
→ private File logfile = new File("test.log");
(참고로, 번역서용 예제에서는 Samples/data 아래에 두었습니다. 즉, data/test.log로 지정합니다.)