Tổng Quan Về Google Web Toolkit (GWT)

1. Tổng Quan VềGoogle Web Toolkit (GWT)

2. 1. GWT làgì ? GWT làmộtopen sourceJava framework giúpchoviệcpháttriểncácứngdựngAjaxdễdànghơnmàkhôngcầnphảibiếtquánhiềungônngữ. Trướcđây, khipháttriểnmộtứngdụng web, phía client phảiviếtrấtnhiềumã JSP, HTML, JavaScript,... Nay với GWT, bạncóthểviếttoànbộứngdụng web phía client bằngmã Java, sauđó GWT sẽbiêndịch (compile) mã Java thànhmã JavaScript. Ta cóthểxem GWT làmộtbộbiêndịch Java sang JavaScript. Đồngthời GWT lạicóthể debug lỗi - mộtlợithếrấtlớnvìbảnthânJavascriptkhôngcóchếđộ debug, khiếnchorấtkhókhănđểxácđịnhđượcvịtrílỗitrong code JS, ...GWT đượcsửdụngbởinhiềusảnphẩmtại Google, baogồmcả Google Wave vàphiênbảnmớicủaAdWords. Đólàmãnguồnmở, hoàntoànmiễnphí, vàđượcsửdụngbởihàngngànnhàpháttriểntrênthếgiới.

3. Theo Google thì : - GWT là một Java framework mã nguồn mở cho phép bạn thoát khỏi ma trận các công nghệ để viết các ứng dụng AJAX quá khó khăn và nhiều lỗi. Với GWT, bạn có thể phát triển và kiểm tra lỗi các ứng dụng AJAX bằng ngôn ngữ Java, sử dụng các công cụ phát triển Java tuỳ theo ý thích. Khi bạn triển khai ứng dụng của mình, bộ biên dịch của GWT sẽ dịch ứng dụng Java của bạn sang Javascript và HTML.- GWT nhấn mạnh đến tính tái sử dụng, những giải pháp hiệu quả để chống lại những thách thức mà AJAX gặp phải. -Thay thế công cụ RPC: HTTPRequest, RequestBuilder, và FormPanel. -Đạt được khả năng tương tác trong GWT bằng JavaScript Object Notation (JSON). -Giao tiếp với GWT-RPC.

4. 2. Pháttriểnứngdụng GWT - Một ứng dụng GWT có thể chạy theo 2 cáchs: + Hosted mode : Ứng dụng sẽ chạy như một ứng dụng Java với JVM. Cách này chỉ sử dụng cho developer+ Web mode : Ứng dụng là Javascropt và HTML thuần, được biên dịch ra từ các đoạn code Java. Cách này là dành cho người sử dụng.- Để viết một ứng dụng GWT, có rất nhiều cách : + Notepad : Nếu ứng dụng chỉ là để test hoặc demo thì chỉ cần notepad cũng có thể viết được, vì chỉ có khoảng chục dòng code. Còn bộ compiler (vốn được tích hợp sẵn trong GWT) sẽ được chạy bằng các lệnh command-line

5. 2. Phát triển ứng dụng GWT(tt) + Googleclipse : Làmộtplugincho Eclipse, đểcác Java developer cóthểsửdụng IDE mãnguồnmởnàypháttriểncácứngdụng GWT. HiệntạiGoogleclipseđãđượctíchhợpsẵnvới Eclipse vàđượccôngbốbởiCypal Studio.(Eclipse đềcập ở đâylànền Eclipse, tứclàtấtcảcác IDE đượcpháttriểntrênnền Eclipse nhưJBuilder, Jdeveloper)+ GWT4NB : làplugindànhriêngchoNetBeans+ WindowBuilder : Làmột IDE khátoàndiện. Cho phépcóthểtạoracácđốitượng GWT bằngcáchkéothảvàsắpxếptrên panel theocác layout tuỳchọn.

6. GWT từđâu ?Tiếntrìnhpháttriểnứngdụng AJAX sử dụng GWT:

8. 3. Các thành phần của GWT - Bộbiêndịch Java-to-javascript: Dùngđểdịchtấtcảcácmãnguồn Java củaứngdụng GWT sang code Javascriptvà HTML.- Trìnhduyệtdànhcho Hosted Mode: Dùngđểcác developer chạyứngdụng GWT bằng hosted mode (tấtnhiênlàvới JVM)- Thưviện JRE : Chỉcó 2 thưviệnchuẩncủa Java đượcsửdụngtrong GWT làjava.langvàjava.util.- Cácthưviệncủa GWT đểthiếtkếgiaodiện.Làcácgiaodiệnvàcáclớpđượctạosẵnhoặc do ngườidùngtựtạo, dùngđểtạocácđốitượng AJAX bằng Java trongcácứngdụng GWT. Chúngcònđượcgọilàcác widgets

9. 4. Những widgets được tạo sẵn *GWT hỗ trợ tạo ra những widget sau : Trong phiênbản 1.4, GWT hỗ trợ tạo ra những widget sau : - Các đối tượng chuẩn HTML (Button, Radio Button, Checkbox, TextBox, PasswordTextBox, TextArea, Hyperlink, ListBox, Table v.v...)- PushButton, ToggleButton.- MenuBar.- Tree.- TabBar.- DialogBox.- Panels (PopupPanel, StackPanel, HorizontalPanel, VerticalPanel, FlowPanel, VerticalSplitPanel, HorizontalSplitPanel, DockPanel, TabPanel, DisclosurePanel).- RichTextArea.- SuggestBox (auto-complete).

10. 4. Những widgets đượctạosẵn(tt) *Hệ điều hành mà GWT hỗ trợ: Do viết trên Java, GWT có thể chạy trên Windows, Linux, Mac OS. Yêu cầu cài đặt: Bạn sẽ cần Java SDK phiên bản 1.5 hoặc mới hơn. Nếu cần thiết, tải về và cài đặt Java SE Development Kit (JDK) Mac người sử dụng, tải và cài đặt phiên bản mới nhất của Java Developer Kit có sẵn cho Mac OS X. Apache Ant cũng là cần thiết để chạy các lệnh. Nếu bạn chưa có nó, cài đặt Apache Ant .

11. Càiđặt GWT: + Các yêu cầu hệ thống:Google Web Toolkit được thiết kế để chạy trên các hệ thống đáp ứng các yêu cầu sau: Java: Sun Java 2 Runtime Environment 1,5 Hệ điều hành: Windows Vista/XP/2000, Mac OS X 10.4 + (Tiger hoặc Leopard), hoặc Linux với GTK + 2.2.1 Phần cứng: ~ 100MB dung lượng đĩa trống, 512MB RAM

12. Cácbướccàiđặt 3 bướcsau: Càiđặt Java SDK (cáinàychắcbạnnàosửdụng Java cũngđãlàmrồi) Download GWT. Unzip vàomộtthưmụcnàođó. Đểđơngiản, bạn unzip GWT vào c:\dev\gwt (trong Windows) hoặc /home/your_user_name/dev/gwt (trong Linux). Trên Windows, tríchxuấtcáctập tin từthưmụcnén gwt-2.0.3.zip Trên Mac hoặc Linux, bạncóthểgiảinéngóivớimộtlệnhnhư unzip gwt-2.0.3.zip giảinén gwt-2.0.3.zip Các SDK GWT khôngcómộtứngdụngcàiđặt. Tấtcảcáctập tin bạncầnphảichạyvàsửdụng SDK đượcđặttrongthưmụctríchxuất.

13. + Trình duyệt hỗ trợ GWT: Đến giữa năm 2008, GWT hỗ trợ các trình duyệt sau: Firefox, 1.5, 2.0 và 3.0 Explorer 6 và 7 Safari 2 và 3 Opera 9,0 GWT phát triển các phần mềm thương mại GWT phát hành với Apache 2.0 open source license, nên có thể sử dụng để phát triển các ứng dụng thương mại, phi thương mại và doanh nghiệp (enterprise)

14. Nềntảng GWT cungcấp: GWT inActionnhằmmụcđíchcungcấpchobạnmộtnềntảngvữngchắcđểpháttriểncácứngdụng GWT. It puts all the tools and development tasks into the context of typical application development, ensuring that you can understand and avoid the problems faced in GWT development. Nóđặttấtcảcáccôngcụvànhiệmvụpháttriểnvàobốicảnhpháttriểnứngdụngđiểnhình, đảmbảorằngbạncóthểhiểuvàtránhnhữngvấnđềphảiđốimặttrong GWT pháttriển. Throughout the book, the development of a Dashboard application, together with various component applications for the Dashboard, provides the mechanism we use to explain GWT concepts. Trongsuốtcuốnsách, việcpháttriểnmộtứngdụngBảngđiềukhiển, cùngvớicácứngdụngthànhphầnkhácnhauchoBảngđiềukhiển, cungcấpcơchếchúngtasửdụngđểgiảithíchkháiniệm GWT.

15. Nền tảng GWT cung cấp(tt) Bắtđầubằngcáchcungcấpmộtnềntảngvữngchắcvềcácvấnđềcơbản, nhìnvàocáccôngcụđượcsửdụngvàđangsửdụngpháttriểnđiểnhình. Then, we consider widgets, panels, and events, discussing those provided by GWT and how to create your own (leaning heavily on our experience from developing components for the GWT Widget Library). Sauđó, xemxétcácbảng, vàcácsựkiện, thảoluậnvềnhữngngườicungcấpbởi GWT vàlàmthếnàođểtạora (dựarấtnhiềuvàokinhnghiệmtừcácthànhphầnpháttriểnchocác Widget GWT Library) củariêngbạn. Tíchhợpvới JavaScript thông qua JavaScript Native Interface (JSNI). Bấtkỳứngdụnglớnđòihỏicácthànhphầnphíamáychủ (mộtsựhiểubiếtthấuđáovềchủ-kháchtruyềnthôngkỹthuậtcủa GWT).

16. Nền tảng GWT cung cấp(tt) Vídụ: JSON chếbiếnbằngcáchsửdụngmáychủ proxy (của Yahoo Search thànhphần). GWT-RPC: kỹthuật, cácvấnđề, vàcácgiảipháp (xemphầnTrạngthái Server). Xửlý XML (đượcsửdụngtrongtrìnhđơnchocácứngdụngBảngđiềukhiểnđầyđủ). Hìnhthứcxửlý, baogồmcảcáctập tin tảilên. Sửdụnggiaotiếptruyềnthống Ajax . Cácđiểmchốtquantrọnglàđểcóđượcmộtsựhiểubiếtcủamỗiphươngpháptiếpcậntrong GWT đểnhìnthấysựlinhhoạtvàcóthểchọnphíamáychủmộtcáchthíchhợp. Đốitượngtiếpcận GWT: JSON processing using proxy servers (the Yahoo Search component) Bấtcứaicóquantâmđến GWT. Độcgiảđếntừnguồngốckhácnhaulậptrình-JavaScript tìmkiếmđểxemnhữnggìphiềnphức, lậptrìnhviên Java biếtrằnghọcóthểlậptrìnhcácứngdụng Ajax đơngiản, pháttriểnquantâmđếnsựhiểubiết GWT-RPC, thiếtkế web tìmkiếmđểhiểuđượcnhữnggìhữuíchpháttriểnphươngtiệnchohọ, vànhiềungườikhác.

17. 5.Các phiênbảng: Phiênbảngmớinhất: GWT 2,1 RC1 Mộttrongcácthànhphầnnàylàmột Editor khuônkhổmớichophépbạnkết DTOs củabạnvàomộtgiaodiệnngườidùngtùybiếnmàxửlýtấtcảcáccôngviệckhókhăncầnthiếtcủaviệcđồngbộhoábộthayđổi. Mộtlàsựsẵncócủa HTMLHTMLthànhphầnvàhộinhậpcủanótrongcác widget. Google Web Toolkit (GWT) is an open source vượtxahầuhếtcáckhung Ajax bằngcáchlàmchonódễdàngđểxâydựngcácứngdụngmáytínhđểbàngiốngnhưchạytrongcáctrìnhduyệtphổbiến, nơimàsựphongphúcủacácgiaodiệnngườidùngđượcgiớihạnbởitrítưởngtượngcủapháttriển.

18. 5.Các phiên bảng(tt) GWT mà bạn cần để thực hiện thực tế ứng dụng với giao diện người dùng phong phú nhưng không có trong JavaScript và các công nghệ Ajax có liên quan khác. Each solution in this practical, hands-on book is more than a recipe. Mỗi giải pháp trong thực tế. Các chương trình mẫu được cẩn thận giải thích chi tiết để giúp nhanh chóng làm chủ kỹ thuật GWT tiên tiến, chẳng hạn như thực hiện kéo-và-thả, tích hợp các thư viện JavaScript, và sử dụng các phương pháp xử lý sự kiện cao cấp.

19. Giải pháp bao gồm • Xâydựng GWT widget tùychỉnh, baogồmcảvậtliệutổnghợpcaocấpvàthấpcấpcácthànhphần• ThựchiệnmộtlớpkhungnhìnbaogồmiPhonetheophongcáchdichuyểntựđộng• Tíchhợpcácdịchvụ web vớicácứngdụng GWT • Kếthợpcác Script.aculo.us JavaScript khungvàocácứngdụng GWT • Kếthợp Hibernate và GWT đểthựchiệncácứngdụng web cơsởdữliệu, saolưu• Mởrộng GWT PopupPanellớpđểthựchiệnmộtcửasổkéovàthayđổikíchthước

20. Giải pháp bao gồm • Tạomột module kéo-và-thả, hoànthànhvớinguồnkéovàthảcácmụctiêu• Triểnkhaicácứngdụng GWT sang mộtmáychủbênngoài• độngcácthayđổikíchthướcbảng flex • Sửdụngcácvậtdụng GWT trongcácứngdụngkếthừapháttriểnvớicáckhuônkhổkhác, chẳnghạnnhư Struts vàJavaServer Faces Cùngvớicácthànhphầnvàtínhnăngmới: kiêncốhóacáchoạtđộng / Địađiểm ,dựatrên widget API. Vì vậy, nếubạnđangtìmkiếmđểbắtđầumộtdựánvới GWT 2.1, bạn có thể cảmthấytự tin nhómcủabạn sẽ khôngphải mã cấutrúc vì chúngtôiđã chuyểnragiaodiệntừ bâygiờ chođếncuốicùng.

21. Các GWT pháttriểncósẳnvàmiễnphí: GWT 2,1 RC có sẵn trên Google và là phiên bản 2.1-SNAPSHOT trong Maven Google GWT Designer : Công cụ phát triển mạnh mẽ dựa trên Eclipse cho phép nhà phát triển Java nhanh chóng tạo ra các giao diện người sử dụng Ajax sử dụng Google Web Toolkit (GWT).

22. Bạn có thể dễ dàng thêm bất cứ thành phần bằng cách sử dụng kéo-và-thả, thêm một xử lý sự kiện để điều khiển của bạn, thay đổi các thuộc tính khác nhau của các điều khiển. Tạo mã không cần bất kỳ thư viện tùy chỉnh để biên dịch và chạy: trong những tạo ra có thể mã được sử dụng mà không cần phải cài đặt GWT Designer. Tất cả các GWT Designer có thể đọc và ghi hầu hết các định dạng và ngược lại-kỹ sư phần lớn viết tay mã Java GUI. Nó cũng hỗ trợ chỉnh sửa mẫu mã miễn phí.Thành phần giao diện nươời dùng: Design View - các chính bố trí trực quan. Source View - - viết mã và xem xét các mã được tạo ra.Structure View - bao gồm các cây phần và các Pane.Component Tree - cho thấy mối quan hệ phân cấp giữa tất cả các thành phần. Property Pane - hiển thị các thuộc tính và các sự kiện của các thành phần được chọn. Palette - cung cấp truy cập nhanh vào các thành phần cụ thể của bộ công cụ. Toolbar - cung cấp truy cập để sử dụng các lệnh thông thường. Context Menu- cung cấp truy cập để sử dụng các lệnh thông thường.

23. Các tính năng chính: Bi-directional Code Generation - đọc và ghi hầu hết các định dạng và thay đổi kỹ thuật-tay viết code nhất Internationalization (i18n) / Localization - biểu lộ chuỗi thành phần, tạo và quản lý tài nguyên. Custom Composites & Panels - tạo tùy chỉnh, các thành phần tái sử dụng. Factories - tạo các lớp tuỳ chỉnh và các phương pháp. Visual Inheritance - tạo phân cấp. Event Handling - tạo và chỉnh sửa menubars, các mục menu và các menu popup. Morphing - chuyển đổi một loại thành phần vào một.

24. CodePro AnalytiX Chấtlượngphầnmềmtựđộngmãvàcáccôngcụphântíchbảomậtđểcảithiệnchấtlượngphầnmềm, độ tin cậy, vàbảotrì. Cáctínhnăng: Code Analysis:Năngđộng, mởrộngcôngcụpháthiện, báocáovàsửachữasailệchhoặckhôngtuânthủcáctiêuchuẩnmãhóađượcxácđịnhtrước, khungphổbiến, quyước. JUnit Test Generation: Tiếtkiệmthờigiansửdụngkỹthuậtphântíchtinh vi đểtựđộnghóaviệctạoracáchồiquykiểmtratoàndiệnJunit. Metrics: Tựđộnghóacôngcụđolườngvàchấtlượngbáocáovềcácchỉsốquantrọngtrongmộtmãnguồn Java. Code Coverage: Côngcụđểđolườngnhữnggìtỷlệphầntrămcủamãnàyđangđượcthựchiệnbằngcáchsửdụngthửnghiệmhoặctạoracáckịchbảnthửnghiệmdẫnsửdụng. JUnit Test EditorJUnit Test Editor: MộtJUnitkiểmtrachỉnhsửachophépnhanhchóngtạora, tổchức, sửađổi. Dependency Analysis: Côngcụtựđộngphântíchvàtrựcquanmiêutảsựphụthuộcgiữacácdựán. Similar Code Analysis: Hiệuquảkiểmtramã Java trùnglặphoặctươngtựnhưcácđoạnmãcóchứalỗi do dán, saochéphoặccóthểđượctáicấutrúcđểcảithiệnthiếtkếứngdụngvàbảotrì.

25. WindowBuilder Pro Java đồ họa thiết kế giao diện người dùng cho Swing, SWT, GWT, RCP, và XWT khung UI mà không chi tiêu nhiều thời gian viết code để hiển thị các hình thức đơn giản. Với WindowBuilder Pro bạn có thể tạo ra cửa sổ phức tạp trong vài phút. Sử dụng các công cụ bố trí WYSIWYG, bạn không cần phải viết bất kỳ dòng mã java - mã sẽ được tạo ra cho bạn bởi WindowBuilder Pro

26. WindowTester Pro Kiểm tra giao diện đồ họa tương tác trong các ứng dụng Java cho các khách hàng giàu SWT và Swing UI khung, động hoá giao diện thử nghiệm tăng năng suất của các nhà phát triển và bảo đảm chất lượng. Với khả năng kiểm tra và làm giảm thời gian cần thiết để mã kiểm tra tay. Sử dụng WindowTester Pro giúp các nhà phát triển và các công ty đều tiết kiệm đến 50% hoặc nhiều hơn thời gian cần thiết để viết các bài kiểm tra. Các xét nghiệm được tạo ra bởi WindowTester Pro được thử nghiệm JUnit tiêu chuẩn do đó có thể chạy trong môi trường Eclipse có thể được tự động chạy bằng cách sử dụng Ant.

27. WindowTester Pro

28. 6. Pháttriểnvới Google Web Toolkit Vào tháng Năm năm 2006 Google phát hành của Google Web Toolkit. GWT cho phép các nhà phát triển để tạo ra các ứng dụng Ajax trong Java. Với GWT, bạn có thể xây dựng các ứng dụng của bạn bằng cách sử dụng một ngôn ngữ hướng đối tượng thực sự và tận dụng các công cụ Java như Eclipse mà đã có sẵn. Thay vì cố gắng để mang lại công cụ hỗ trợ Ajax, Google đã đưa Ajax đến một nơi mà các công cụ đã tồn tại.

29. Write GWT SDK cung cấp một bộ lõi Java API và Widgets. Điều này cho phép bạn viết các ứng dụng AJAX trong Java và sau đó biên dịch tối ưu hóa nguồn JavaScript chạy trên tất cả các trình duyệt, bao gồm cả trình duyệt di động cho Android và iPhone. Xây dựng các ứng dụng AJAX theo cách này hiệu quả hơn nhờ đến một mức độ trừu tượng cao hơn trên các khái niệm phổ biến như DOM thao tác và truyền XHR. Bất cứ điều gì bạn có thể làm với trình duyệt của DOM và JavaScript có thể được thực hiện trong GWT, bao gồm cả tương tác với viết tay JavaScript.

30. Debug Bạncóthể debug cácứngdụng AJAX trong IDE yêuthíchcủabạngiốngnhưmộtứngdụngmáytínhđểbàn, vàtrongtrìnhduyệtưathíchcủabạngiốngnếubạnđãđượcmãhóa JavaScript. Cácnhàpháttriển GWT pluginkéodàikhoảngcáchgiữa Java bytecode . Nhờsựpháttriển GWT plugin, khôngcóbiêndịchcủamãJavascriptđểxemnótrongtrìnhduyệt. Bạncóthểsửdụngchỉnhsửa, làmmới, sửdụngvới JavaScript, trongkhiđồngthờikiểmtracácbiến, cácđiểmngắtthiếtlập, vàsửdụngtấtcảcáccôngcụkháccósẵnchobạnvới Java. Vàbởivìchếđộpháttriểncủa GWT làbâygiờtrongtrìnhduyệt, bạncóthểsửdụngcáccôngcụnhư Firebug vàkhibạnmãtrong Java.

31. Optimize (Tối ưu hóa) Google Web Toolkit bao gồm hai công cụ mạnh để tạo ra các ứng dụng web tối ưu hóa. Trình biên dịch thực hiện tối ưu hóa toàn diện GWT trên cơ sở mã của bạn – trong phương pháp, loại bỏ mã chết, tối ưu hóa chuỗi, và nhiều hơn nữa. Bằng cách thiết lập chia điểm trong các mã, nó cũng có thể tải về các phân khúc của bạn thành nhiều đoạn JavaScript, chia tách các ứng dụng lớn cho thời gian khởi động nhanh hơn. Hiệu suất không giới hạn JavaScript. Google Web Toolkit cho phép bạn để chẩn đoán vấn đề hoạt động trong trình duyệt.

32. Run Khi bạn đã sẵn sàng để triển khai, GWT biên dịch mã nguồn Java của bạn vào tối ưu hóa, độc lập các tập tin JavaScript tự động chạy trên các trình duyệt lớn, cũng như các trình duyệt di động cho Android và iPhone. Một số ví dụ thực tế: Website để quản lý hình ảnh không gian địa lý. Một loạt các bộ hình ảnh - một số rất lớn. Vector dữ liệu - ranh giới chính trị, đường giao thông. Người sử dụng truy cập các điều khiển để truy cập các thành viên. Các tài liệu XML lấy từ máy chủ để cấu hình và cập nhật vào cửa WMS

33. Demo của GWT Gmail, Google Calendar, Google Docs là những ví dụ thực tế nhất về GWT. Ngoài ra bạn có thế xem thêm một số sample như: Mail Application Kitchen Sink JSON Interop Using JSNI ... và còn nhiều nữa tại Example Projects

34. Link tham khảo và ebook Ebookthamkhảo: GWT in Action Google™ Web Toolkit Solutions (Digital Short Cut) Cool & Useful Stuff Các link thamkhảo: http://gwt.vnonweb.net/2010/01/nhung-cau-hoi-thong-thuong-ve-gwt-cho.html http://code.google.com/webtoolkit/overview.html Tạiđâycungcấpthông tin về API, Tutorial:http://code.google.com/webtoolkit/overview.html http://www.vnecon.vn/showthread.php?t=603 http://googlewebtoolkit.blogspot.com/ http://code.google.com/webtoolkit/overview.html http://code.google.com/webtoolkit/doc/latest/tutorial/