구글 웹 툴킷

1. 개요

구글 웹 툴킷(GWT)은 자바를 사용하여 웹 애플리케이션을 개발하기 위한 오픈 소스 프레임워크이다. GWT는 자바 코드를 자바스크립트로 컴파일하여 개발자가 자바 개발 도구를 사용하여 Ajax 애플리케이션을 만들고 디버깅할 수 있게 한다. 2006년에 처음 출시되었으며, 구글은 2012년에 GWT를 오픈 소스 프로젝트로 전환했다. GWT는 자바 대 자바스크립트 컴파일러, 개발 모드, JRE 에뮬레이션 라이브러리, 웹 UI 클래스 라이브러리 등으로 구성된다. 2.0 버전부터 브라우저 내 개발 모드, 코드 분할, 선언적 사용자 인터페이스, 리소스 번들링 등의 기능이 추가되었다. GWT는 다양한 위젯과 패널을 제공하며, 모바일 앱 개발에도 활용될 수 있다.

2. 역사

GWT 버전 1.0 RC 1은 2006년 5월 16일에 출시되었다. 구글은 자바원 콘퍼런스에서 GWT를 발표하였다.

2010년 8월, 구글은 이클립스 자바 개발자 도구에 주력하는 회사인 Instantiations를 인수했는데, 여기에는 현재 이클립스용 구글 플러그인에 포함된 GWT 디자이너가 들어있다.

2011년 Dart 프로그래밍 언어가 소개되면서, 구글은 GWT가 앞으로도 계속 지원될 것이라고 밝혔고, 구조화된 웹 프로그래밍에 대한 두 가지 구글 접근 방식 간의 화해 가능성을 암시했다. 그러나 이전에 GWT에서 작업하던 여러 엔지니어가 현재 Dart에서 작업하고 있다고 언급했다.

2.1. 주요 버전 출시 기록

2.2. 오픈 소스 전환

2012년, 구글은 연례 I/O 컨퍼런스에서 GWT를 구글 프로젝트에서 완전히 오픈 소스 프로젝트로 전환할 것이라고 발표했다. 2013년 7월, 구글은 GWT 블로그에 오픈 소스 프로젝트로의 전환이 완료되었다고 게시했다.

3. 구성 요소

GWT는 다음과 같은 주요 구성 요소를 가지고 있다.

GWT를 사용하면 개발자는 자바 개발 도구를 사용하여 자바 언어로 Ajax 애플리케이션을 개발하고 디버깅할 수 있다. 애플리케이션 배포 시, GWT 크로스 컴파일러는 자바 애플리케이션을 난독화되고 최적화된 자바스크립트 파일로 변환한다. GWT는 사용자 인터페이스 프로그래밍뿐만 아니라, 고성능 클라이언트 측 자바스크립트 기능을 구축하기 위한 광범위한 도구 집합을 제공한다.

3.1. GWT 자바 대 자바스크립트 컴파일러

자바로 작성된 코드를 자바스크립트로 변환하는 핵심 구성 요소이다.

3.2. GWT 개발 모드 (Development Mode)

개발자가 GWT 애플리케이션을 개발 모드에서 실행하고 실행할 수 있도록 지원한다. 애플리케이션은 자바스크립트로 컴파일되지 않고 자바 가상 머신(JVM) 내에서 자바로 실행된다. 2.0 이전에는 GWT 호스트 모드에서 GWT 코드를 디버깅하기 위한 특수 목적의 "호스트 브라우저"를 제공했다. 2.0에서는 디버깅 중인 웹 페이지가 일반 브라우저 내에서 표시된다. 개발 모드는 많은 인기 있는 브라우저를 위한 Google Web Toolkit 개발자 플러그인이라고 하는 네이티브 코드 플러그인을 사용하여 지원된다.

2014년에는 브라우저 업데이트로 인해 Dev 모드의 기존 구현이 사용할 수 없게 되었고, 더 호환성이 높은 슈퍼 Dev 모드로 대체되었으며, 이 모드는 GWT 2.7에서 기본 모드가 되었다.

3.3. JRE 에뮬레이션 라이브러리

자바 표준 클래스 라이브러리에서 흔히 사용되는 클래스(예: `java.lang` 패키지의 대부분 클래스 및 `java.util` 패키지 클래스의 하위 집합)의 자바스크립트 구현체이다.

3.4. GWT 웹 UI 클래스 라이브러리

위젯 생성을 위한 사용자 정의 인터페이스 및 클래스 집합이다.

4. 기능

GWT를 사용하면 개발자는 자바 개발 도구를 사용하여 자바 언어로 Ajax 애플리케이션을 개발하고 디버깅할 수 있다. 애플리케이션이 배포되면 GWT 크로스 컴파일러는 자바 애플리케이션을 난독화되고 고도로 최적화된 독립형 자바스크립트 파일로 변환한다. 필요에 따라 자바스크립트는 자바 주석을 사용하여 자바 코드에 직접 포함될 수도 있다.

GWT는 사용자 인터페이스 프로그래밍뿐만 아니라 고성능 클라이언트 측 자바스크립트 기능을 구축하기 위한 광범위한 도구 집합이다. GWT의 미션 선언문은 GWT 역할과 개발자 역할의 철학적 구분을 명확히 한다. 기록(History)이 그 예시 중 하나인데, GWT는 사용자가 브라우저에서 뒤로 또는 앞으로를 클릭할 때 기록 토큰을 관리하지만, 기록 토큰을 애플리케이션 상태에 매핑하는 방법은 개발자에게 맡긴다.

GWT 애플리케이션은 두 가지 모드로 실행할 수 있다.

* 개발 모드 (이전의 호스트 모드): 애플리케이션은 자바 가상 머신(JVM) 내에서 자바 바이트 코드로 실행된다. 이 모드는 일반적으로 개발에 사용되며, 코드 핫 스와핑 및 디버깅을 지원한다. 2014년에는 브라우저 업데이트로 인해 Dev 모드의 기존 구현이 사용할 수 없게 되었고, 더 호환성이 높은 슈퍼 Dev 모드로 대체되었으며, 이 모드는 GWT 2.7에서 기본 모드가 되었다.
* 프로덕션 모드 (이전의 웹 모드): 애플리케이션은 자바 소스에서 컴파일된 순수한 자바스크립트 및 HTML로 실행된다. 이 모드는 일반적으로 배포에 사용된다.

GWT 개발을 다른 IDE에서 더 쉽게 만들 수 있도록 여러 오픈 소스 플러그인이 제공된다. 여기에는 NetBeans용 GWT4NB, GWT용 Cypal Studio (이클립스 플러그인) 및 JDeveloper용 GWT Developer가 있다. Google Plugin for Eclipse는 프로젝트 생성, GWT 컴파일러 호출, GWT 시작 구성 생성, 유효성 검사 및 구문 강조를 포함하여 IDE에서 대부분의 GWT 관련 작업을 처리한다.

GWT는 다음과 같은 기타 기능들을 제공한다.

* 단위 테스트 통합
* 국제화 및 지역화 지원
* HTML 캔버스 지원 (API 변경에 따라)
* 개발자는 JavaScript Native Interface (JSNI)를 사용하여 Java 소스 코드에 직접 작성한 JavaScript를 혼합할 수 있다.
* GWT 애플리케이션에서 Google API 사용 지원 (초기에는 Google Gears 지원).
* 오픈 소스
* 개발자는 Java를 사용하므로 (JavaScript 대신) 순수한 객체 지향 방식으로 애플리케이션을 설계하고 개발할 수 있다. 오타 및 타입 불일치와 같은 일반적인 JavaScript 오류는 컴파일 시간에 감지된다.
* GWT 컴파일러가 생성하는 JavaScript는 난독화되지 않은 상태(소스 맵 또는 소스 코드)로 이해하기 쉽게 하거나 난독화하고 압축하도록 맞춤 설정할 수 있다.
* Google 및 타사에서 GWT용 다양한 라이브러리를 사용할 수 있다. 이는 툴킷의 기능을 확장한다.

4.1. 사용 가능한 위젯

2011년 9월 버전 2.4 기준으로 구글 웹 툴킷은 다음의 여러 위젯을 제공한다.

GWT에서 찾을 수 없는 많은 일반적인 위젯은 타사 라이브러리에 구현되어 있다.

4.2. 사용 가능한 패널

GWT는 UI 레이아웃 구성을 돕는 여러 패널을 제공한다.

* 팝업 패널
* 스택 패널
* 스택 레이아웃 패널
* 수평 패널
* 수직 패널
* 플로우 패널
* 수직 분할 패널
* 수평 분할 패널
* 분할 레이아웃 패널
* 도킹 패널
* 도킹 레이아웃 패널
* 탭 패널
* 탭 레이아웃 패널
* 공개 패널

2011년 9월 버전 2.4 기준으로, 구글 웹 툴킷은 아래와 같은 위젯 및 패널들을 제공한다.

4.3. 기타 기능

* 동적이고 재사용 가능한 UI 컴포넌트: 프로그래머는 드래그 앤 드롭 또는 복잡한 시각적 트리 구조와 같이 시간 소모적인 동적 동작을 구현하기 위해 내장 클래스를 사용할 수 있다.
* 간단한 RPC 메커니즘
* 브라우저 기록 관리
* 완전한 기능을 갖춘 Java 디버깅 지원
* GWT는 개발자를 위해 일부 크로스 브라우저 문제를 처리한다.
* 단위 테스트 통합
* 국제화 및 지역화 지원
* HTML 캔버스 지원 (API 변경에 따라)
* 개발자는 JavaScript Native Interface (JSNI)를 사용하여 Java 소스 코드에 직접 작성한 JavaScript를 혼합할 수 있다.
* GWT 애플리케이션에서 Google API 사용 지원 (초기에는 Google Gears 지원).
* 오픈 소스

5. GWT 2.0의 주요 특징

2009년 12월 8일, 구글은 Speed Tracer와 함께 구글 웹 툴킷 2.0을 출시했다.

GWT 2.0은 다음과 같은 여러 가지 새로운 기능을 제공한다.

* 브라우저 내 개발 모드 (이전에는 Out Of Process Hosted Mode, OOPHM으로 알려짐): 개발 모드를 통해 브라우저 플러그인을 사용하여 디버깅 중인 페이지를 모든 브라우저에서 볼 수 있다.
* 코드 분할: GWT 컴파일러가 자바스크립트 코드를 여러 개의 작은 청크로 분할할 수 있다.
* 선언적 사용자 인터페이스: UiBinder라는 새로운 기능을 통해 선언을 통해 사용자 인터페이스를 만들 수 있다.
* 리소스 번들링: ClientBundle 인터페이스를 사용하면 이미지, CSS, 텍스트 등 모든 유형의 리소스를 함께 묶어 한 번의 다운로드로 전송할 수 있다.

새로운 개발 모드는 대부분의 플랫폼별 코드를 제거했으므로, 새로운 버전은 이전 버전과 달리 지원되는 플랫폼별로 하나씩 배포되는 대신 단일 아카이브로 배포된다.

5.1. 브라우저 내 개발 모드

구글 웹 툴킷 2.0 이전 버전에서는 개발 중에 애플리케이션의 바이트코드 버전을 실행하기 위해 수정된 브라우저를 임베드하는 호스팅 모드가 사용되었다. 2.0 버전에서는 "개발 모드"로 이름이 변경된 호스팅 모드를 통해 브라우저 플러그인을 사용하여 디버깅 중인 페이지를 모든 (지원되는) 브라우저에서 볼 수 있다. 플러그인은 TCP/IP를 사용하여 개발 모드 셸과 통신하므로 플랫폼 간 디버깅이 가능하다 (예: Linux 머신에서 실행되는 개발 모드 셸에서 Windows의 인터넷 익스플로러에서 디버깅).

5.2. 코드 분할

개발자가 소스 코드에 "분할 지점"을 지정하면, GWT 컴파일러가 자바스크립트 코드를 여러 개의 작은 청크로 분할한다. 이렇게 하면 초기 다운로드 크기가 줄어들어 애플리케이션 시작 시간이 단축된다.

5.3. 선언적 사용자 인터페이스

UiBinder라는 새로운 기능을 통해 XML 형식을 사용하여 코드 대신 선언을 통해 사용자 인터페이스를 만들 수 있다. 이를 통해 UI 구성과 동작 구현을 깔끔하게 분리할 수 있다.

5.4. 리소스 번들링

ClientBundle 인터페이스를 사용하면 이미지, CSS, 텍스트 등 모든 유형의 리소스를 함께 묶어 한 번의 다운로드로 전송할 수 있으므로 서버 왕복 횟수를 줄여 애플리케이션 대기 시간을 단축할 수 있다.

6. 엔터프라이즈 활용

GWT는 자바, 아파치 톰캣, 이클립스 IDE, 인터넷 익스플로러 등을 사용하거나 지원하며, 자바 기반의 리치 웹 애플리케이션(RIA) 개발에 활용된다. 구글은 블로거, 애드워즈, 플라이트, 월렛, 오퍼스, 그룹스, 인박스 등 자사 제품 중 일부가 GWT 기반으로 개발되었다고 밝혔다.

7. GWT와 모바일 개발

GWT는 웹 앱 제작을 위한 일반적인 프레임워크로서, 필요한 위젯과 애니메이션을 처음부터 만들거나 GWT용 모바일 프레임워크 중 하나를 사용하여 모바일 및 태블릿 앱을 제작하는 데에도 사용할 수 있다. GWT로 작성된 HTML5 앱은 태블릿과 휴대폰에 대한 별도의 보기를 가질 수 있다.