introduction to google web toolkit - part 1

31
Introduction to Google Web Toolkit Introduction to Google Web Toolkit part-1 part-1 1 Muhammad “Ghanoz” Ghazali Muhammad “Ghanoz” Ghazali JUG Bandung board member JUG Bandung board member

Upload: muhammad-ghazali

Post on 15-May-2015

2.447 views

Category:

Technology


10 download

DESCRIPTION

My presentation about Google Web Toolkit on Java User MeetUp, May 8th 2010.

TRANSCRIPT

Page 1: Introduction to Google Web Toolkit - part 1

Introduction to Google Web ToolkitIntroduction to Google Web Toolkitpart-1part-1

1

Muhammad “Ghanoz” GhazaliMuhammad “Ghanoz” GhazaliJUG Bandung board memberJUG Bandung board member

Page 2: Introduction to Google Web Toolkit - part 1

2

Who am I?● Muhammad Ghazali a.k.a. Ghanoz● JUG Bandung board member● Mahasiswa “tingkat akhir” Teknik Informatika

Universitas Widyatama● Ketua himpunan mahasiswa teknik informatika

Universitas Widyatama● OSUM leader Universitas Widyatama

Page 3: Introduction to Google Web Toolkit - part 1

3

GWT(Google Web Toolkit)

Page 4: Introduction to Google Web Toolkit - part 1

4

Agenda➔ What is GWT➔ Why GWT➔ GWT can do what➔ Development Workflow➔ Major GWT components➔ GWT app run mode➔ Available widgets➔ GWT plugins for IDEs➔ Getting Started➔ Resources

Page 5: Introduction to Google Web Toolkit - part 1

5

What is GWT

Page 6: Introduction to Google Web Toolkit - part 1

6

Apa itu GWT● Web app framework● toolkit for building and optimizing complex

browser-based applications

Page 7: Introduction to Google Web Toolkit - part 1

7

Why GWT

Page 8: Introduction to Google Web Toolkit - part 1

8

Why GWT➔ GWT handles all cross-browser issues for the

developer.➔ Optimize the JavaScript script downloads based on

user profile➔ Google Web Toolkit is open source software

Page 9: Introduction to Google Web Toolkit - part 1

9

GWT can do what

Page 10: Introduction to Google Web Toolkit - part 1

10

GWT can do what➔ Help you to create an ajax-based web app using Java➔ Avoid you to write a JavaScript code to create a cool web

app➔ Give web app the feel of dektop app

Page 11: Introduction to Google Web Toolkit - part 1

11

Development workflow

Page 12: Introduction to Google Web Toolkit - part 1

12

Development workflow➔ Edit Java code, then view changes immediately without re-

compiling➔ Step through live AJAX code with your Java debugger➔ Compile and deploy optimized, cross-browser JavaScript

Page 13: Introduction to Google Web Toolkit - part 1

13

Major GWT components

Page 14: Introduction to Google Web Toolkit - part 1

14

Major GWT components➔ GWT Java-to-JavaScript Compiler

Java → JavaScript➔ GWT Hosted Web Browser

run and execute app in hosted mode, commonly used for debugging

➔ JRE emulation libraryJavaScript implementations of the commonly used classes in the Java standard class library

➔ GWT Web UI class libraryA set of custom interfaces and classes for creating widgets.

Page 15: Introduction to Google Web Toolkit - part 1

15

GWT app run mode

Page 16: Introduction to Google Web Toolkit - part 1

16

GWT app run mode● Hosted mode

Run as Java bytecode (within JVM). Used for development, supporting hot swapping of code and debugging.

● Web modeThe app run as pure JavaScript and HTML. Used for deployment.

Page 17: Introduction to Google Web Toolkit - part 1

17

Available widgets

Page 18: Introduction to Google Web Toolkit - part 1

18

Available widgets● HTML primitives (Button, Radio Button, Checkbox,

TextBox, PasswordTextBox, TextArea, Hyperlink, ListBox, Table etc.)

● PushButton, ToggleButton● MenuBar● Tree● TabBar● DialogBox●

Page 19: Introduction to Google Web Toolkit - part 1

19

Available widgets● Panels (PopupPanel, StackPanel, HorizontalPanel,

VerticalPanel, FlowPanel, VerticalSplitPanel, HorizontalSplitPanel, DockPanel, TabPanel, DisclosurePanel)

● RichTextArea● SuggestBox (auto-complete)

Page 20: Introduction to Google Web Toolkit - part 1

20

Available widgets

Page 21: Introduction to Google Web Toolkit - part 1

21

Available widgets

Page 22: Introduction to Google Web Toolkit - part 1

22

GWT plugin for IDEs

Page 23: Introduction to Google Web Toolkit - part 1

23

GWT plugin for IDEs● GWT4NB for NetBeans

https://gwt4nb.dev.java.net/● Cypal Studio for GWT

http://code.google.com/p/cypal-studio/● Eclipse

http://code.google.com/eclipse/

Page 24: Introduction to Google Web Toolkit - part 1

24

Getting Started

Page 25: Introduction to Google Web Toolkit - part 1

25

Getting started● Download GWT:

http://code.google.com/webtoolkit/download.html● GWT starting guide

http://code.google.com/webtoolkit/documentation/● GWT tutorial

http://code.google.com/webtoolkit/doc/latest/tutorial/● GWT FAQs

http://code.google.com/support/bin/topic.py?topic=10034

Page 26: Introduction to Google Web Toolkit - part 1

26

Resources

Page 27: Introduction to Google Web Toolkit - part 1

27

Resource● GWT homepage

http://code.google.com/webtoolkit/● GWT starting guide

http://code.google.com/webtoolkit/documentation/● GWT FAQs

http://code.google.com/support/bin/topic.py?topic=10034● GWT official Blog

http://googlewebtoolkit.blogspot.com/

Page 28: Introduction to Google Web Toolkit - part 1

28

Resource● GWT application examples

http://code.google.com/webtoolkit/examples/● GWT 2.0 Developers Guide

http://code.google.com/webtoolkit/doc/latest/DevGuide.html● Coding Basic

http://code.google.com/webtoolkit/doc/latest/DevGuideCodingBasics.html

● GWT official tutorial:http://code.google.com/webtoolkit/doc/latest/tutorial/

Page 29: Introduction to Google Web Toolkit - part 1

29

Questions?

Page 30: Introduction to Google Web Toolkit - part 1

30

Let's keep in touch...

Blog: http://muhammadghazali.web.id/blog

Facebook: Muhammad Ghanoz Ghazali

Twitter: @muhghazali

Plurk: http://plurk.com/muhammadghazali

GoogleTalk: muhammadghazali2480

e-mail:● [email protected]

Page 31: Introduction to Google Web Toolkit - part 1

31

Thank You :)