SlideShare une entreprise Scribd logo
1  sur  25
Google Web Toolkit


  Autor: Bartosz Wójcik
http://kuzniasukcesu.net/
    (cc) by-nc-nd 2009
http://kuzniasukcesu.net/




   Google Web Toolkit (GWT)

    GWT - środowisko programowania aplikacji
     webowych z wykorzystaniem technologii AJAX
http://kuzniasukcesu.net/




    Wykorzystane technologie:

                           JAVA
                             ↓
                   JavaScript + XML (AJAX)


    • Aplikacje pisane w Javie (np. w środowisku
      Eclipse), potem kompilowane do JavaScript
http://kuzniasukcesu.net/



    Możliwości:
    • w fazie implementacji i testowania programujemy w Javie, kod
      produkcyjny jest kompilowany do JavaScript


     public class HelloWorld implements EntryPoint
     {
         private Button clickMeButton;
         public void onModuleLoad {
             RootPanel rootPanel = RootPanel.get();
             clickMeButton = new Button();
             rootPanel.add(clickMeButton);
             clickMeButton.setText(„Click me!”);
             clickMeButton.addClickListener(new ClickListener() {
                 public void onClick(Widget sender) {
                     Window.alert(„Hello, GWT World!”);
                 }
             }
         }
     }
http://kuzniasukcesu.net/




    • możliwość tworzenia na poziomie Javy wstawek w JavaScript (JSNI)

            public static native void alert(String msg) /*-{
                $wnd.alert(msg);
            }-*/;
http://kuzniasukcesu.net/



    • testowanie oraz debugowanie aplikacji WWW w taki sam sposób jak
      aplikacji Windowsowej
http://kuzniasukcesu.net/



    • skompilowany do JavaScript kod jest zoptymalizowany i
      dostosowany do różnych przeglądarek (aktualnie IE, Firefox,
      Mozilla, Safari, Opera) – zrealizowane jest to przy pomocy techniki
      „opóźnionego wiązania” (ang. deferred binding)
http://kuzniasukcesu.net/



    Możliwości, c.d.:

    • możliwość ponownego wykorzystania komponentów UI w innych
      projektach

    • możliwość tworzenia UnitTestów dla kodu za pomocą np. Junit

    • obsługa RPC (Remote Procedure Calls)
http://kuzniasukcesu.net/




   Za i przeciw
    + skompilowany przez maszynę kod w JavaScript jest bezpieczniejszy
      niż JavaScript wygenerowany przez człowieka
    + taki kod jest też lepiej zoptymalizowany
    + łatwe debugowanie kodu
    + nie trzeba się martwić o kompatybilność pomiędzy przeglądarkami

    – standardowe widgety są niewystarczające
    – brak darmowych edytorów interfejsu użytkownika
    – powolnie działanie w trybie hostowanym przy dużych projektach
http://kuzniasukcesu.net/



   Przykładowe aplikacje
    • Contact Office
       http://beta.contactoffice.com/
http://kuzniasukcesu.net/


    • QueWeb
       http://demo.queplix.com/
http://kuzniasukcesu.net/


    • MyNetImages
       http://www.mynetimages.com/
http://kuzniasukcesu.net/


    • Mail App
       http://code.google.com/webtoolkit/documentation/examples/desktopclo
http://kuzniasukcesu.net/




   Jak zacząć?
    • Instalacja Java SDK.
         http://java.sun.com/javase/downloads/

    • Ściągnięcie i rozpakowanie GWT.
         http://code.google.com/webtoolkit/download.html
http://kuzniasukcesu.net/




   Tworzenie nowego projektu
    •    Za pomocą narzędzia applicationCreator
         tworzymy pliki projektu.

               applicationCreator com.client.MojaAplikacja
http://kuzniasukcesu.net/



   Tworzenie nowego projektu dla
   środowiska Eclipse
       1. Za pomocą narzędzia projectCreator tworzymy
          nowy projekt Eclipse:
           projectCreator -eclipse MojProjekt
http://kuzniasukcesu.net/




       1. Tworzymy pliki projektu dla naszej aplikacji:
         applicationCreator -eclipse MojProjekt
             com.client.MojaAplikacja
http://kuzniasukcesu.net/




   Struktura projektu
    • Nazwa: com.MojaAplikacja
    • Katalog bazowy: com
       ▫ mieści zawartość projektu
    • Katalog publiczny: com.public
       ▫ mieści pliki HTML, CSS oraz obrazki
    • Katalog zawierający kod klienta: com.client
       ▫ mieści pliki *.java kompilowane do JavaScript
    • Katalog zawierający kod serwera: com.server
       ▫ mieści kod w Javie, który będzie wykonywany na serwerze
    • Plik opisujący projekt GWT: MojaAplikacja.gwt.xml
http://kuzniasukcesu.net/




   Kompilacja projektu do JavaScript
    Uruchomienie skryptu MojaAplikacja-compile.cmd
http://kuzniasukcesu.net/



   Uruchamianie aplikacji w środowisku
   Google’a
    Uruchomienie skryptu MojaAplikacja-shell.cmd
http://kuzniasukcesu.net/




   Dodawanie projektu do Eclipse
http://kuzniasukcesu.net/



   Wstawianie GWT do HTML
    • cały serwis WWW może zostać wykonany w technologii
      GWT
http://kuzniasukcesu.net/



    • GWT może też występować jako wstawki do istniejącej
      strony w HTML
                            Fragment strony w HTML




                            Fragment kodu w Javie
                        odnoszącego się do strony HTML
http://kuzniasukcesu.net/




   Biblioteki kontrolek
    • Podstawowa biblioteka:
       http://gwt.google.com/samples/Showcase/Showcase.html

    • Biblioteka rozszerzona (wypasiona):
       http://www.gwt-ext.com/demo/
http://kuzniasukcesu.net/




   Do poczytania
    • Strona domowa projektu:
      http://code.google.com/webtoolkit/

    • http://www.scribd.com/doc/44602/Google-Web-Toolkit

    • http://www.devbg.org/seminars/seminar-GWT-26-september-2007/AJA

    • http://www.slideshare.net/dgirard/gwt-gears-the-browser-is-the-platform

Contenu connexe

Tendances

Vagrant - RuPy Tuesday
Vagrant - RuPy TuesdayVagrant - RuPy Tuesday
Vagrant - RuPy Tuesday
GaldoMedia
 

Tendances (13)

Automatyzacja tworzenia maszyn wirtualnych Magdalena Wojnarowska
Automatyzacja tworzenia maszyn wirtualnych Magdalena WojnarowskaAutomatyzacja tworzenia maszyn wirtualnych Magdalena Wojnarowska
Automatyzacja tworzenia maszyn wirtualnych Magdalena Wojnarowska
 
Swoole w PHP. Czy to ma sens?
Swoole w PHP. Czy to ma sens?Swoole w PHP. Czy to ma sens?
Swoole w PHP. Czy to ma sens?
 
Daj się wyręczyć - Joomla Day Polska 2014
Daj się wyręczyć - Joomla Day Polska 2014Daj się wyręczyć - Joomla Day Polska 2014
Daj się wyręczyć - Joomla Day Polska 2014
 
Vagrant - RuPy Tuesday
Vagrant - RuPy TuesdayVagrant - RuPy Tuesday
Vagrant - RuPy Tuesday
 
Środowisko PWA
Środowisko PWAŚrodowisko PWA
Środowisko PWA
 
Hugo - make webdev fun again
Hugo - make webdev fun againHugo - make webdev fun again
Hugo - make webdev fun again
 
Google Web Toolkit - nie idź tą drogą
Google Web Toolkit - nie idź tą drogąGoogle Web Toolkit - nie idź tą drogą
Google Web Toolkit - nie idź tą drogą
 
7 Grzechów Głównych, czyli jak nie prowadzić (i nie ulepszać) strony opartej ...
7 Grzechów Głównych, czyli jak nie prowadzić (i nie ulepszać) strony opartej ...7 Grzechów Głównych, czyli jak nie prowadzić (i nie ulepszać) strony opartej ...
7 Grzechów Głównych, czyli jak nie prowadzić (i nie ulepszać) strony opartej ...
 
Bootstrap w Joomla - modyfikować, rozszerzać, nadpisywać oraz czy 
w ogól...
Bootstrap w Joomla - modyfikować, rozszerzać, nadpisywać oraz czy 
w ogól...Bootstrap w Joomla - modyfikować, rozszerzać, nadpisywać oraz czy 
w ogól...
Bootstrap w Joomla - modyfikować, rozszerzać, nadpisywać oraz czy 
w ogól...
 
SQL Server + docker - pierwsze kroki
SQL Server + docker - pierwsze krokiSQL Server + docker - pierwsze kroki
SQL Server + docker - pierwsze kroki
 
PIKLIST - Rapid WordPress Framework
PIKLIST - Rapid WordPress FrameworkPIKLIST - Rapid WordPress Framework
PIKLIST - Rapid WordPress Framework
 
Grok Prezentacja
Grok PrezentacjaGrok Prezentacja
Grok Prezentacja
 
REvolution, czyli o bardziej obiektowym podejściu w Railsach
REvolution, czyli o bardziej obiektowym podejściu w RailsachREvolution, czyli o bardziej obiektowym podejściu w Railsach
REvolution, czyli o bardziej obiektowym podejściu w Railsach
 

Similaire à Google Web Toolkit

Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.
Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.
Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.
Meet Magento Poland
 
Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...
Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...
Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...
Lukasz Kaluzny
 
C++. Wykorzystaj potęgę aplikacji graficznych
C++. Wykorzystaj potęgę aplikacji graficznychC++. Wykorzystaj potęgę aplikacji graficznych
C++. Wykorzystaj potęgę aplikacji graficznych
Wydawnictwo Helion
 
Extjs & netzke
Extjs & netzkeExtjs & netzke
Extjs & netzke
GaldoMedia
 
MySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalisty
MySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalistyMySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalisty
MySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalisty
Wydawnictwo Helion
 

Similaire à Google Web Toolkit (20)

JavaScript, Moduły
JavaScript, ModułyJavaScript, Moduły
JavaScript, Moduły
 
Jak zarabiać na testowaniu oprogramowania(konferencja MeeTTech Piła 27.07.2016)
Jak zarabiać na testowaniu oprogramowania(konferencja MeeTTech Piła 27.07.2016)Jak zarabiać na testowaniu oprogramowania(konferencja MeeTTech Piła 27.07.2016)
Jak zarabiać na testowaniu oprogramowania(konferencja MeeTTech Piła 27.07.2016)
 
Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.
Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.
Maciej Rudnicki: Zautomatyzowane środowisko deweloperskie.
 
Co nowego w ASP.NET MVC 4?
Co nowego w ASP.NET MVC 4?Co nowego w ASP.NET MVC 4?
Co nowego w ASP.NET MVC 4?
 
Webinar - Podstawy Node.js
Webinar - Podstawy Node.jsWebinar - Podstawy Node.js
Webinar - Podstawy Node.js
 
Jak oszczędzać czas zespołu w środowisku mikroserwisów, czyli efektywny flow ...
Jak oszczędzać czas zespołu w środowisku mikroserwisów, czyli efektywny flow ...Jak oszczędzać czas zespołu w środowisku mikroserwisów, czyli efektywny flow ...
Jak oszczędzać czas zespołu w środowisku mikroserwisów, czyli efektywny flow ...
 
Silverlight i PHP
Silverlight i PHPSilverlight i PHP
Silverlight i PHP
 
Silverlight i PHP - jak budować interfejs nowoczesnych aplikacji internetowych?
Silverlight i PHP - jak budować interfejs nowoczesnych aplikacji internetowych?Silverlight i PHP - jak budować interfejs nowoczesnych aplikacji internetowych?
Silverlight i PHP - jak budować interfejs nowoczesnych aplikacji internetowych?
 
AADays 2015 - Jak to zrobic w JavaScript
AADays 2015 - Jak to zrobic w JavaScriptAADays 2015 - Jak to zrobic w JavaScript
AADays 2015 - Jak to zrobic w JavaScript
 
4Developers 2015: Szybciej niż Struś Pędziwiatr - WebSockets w aplikacjach we...
4Developers 2015: Szybciej niż Struś Pędziwiatr - WebSockets w aplikacjach we...4Developers 2015: Szybciej niż Struś Pędziwiatr - WebSockets w aplikacjach we...
4Developers 2015: Szybciej niż Struś Pędziwiatr - WebSockets w aplikacjach we...
 
Exam: 70-511 Enhancing Usability - Windows Application
Exam: 70-511 Enhancing Usability - Windows ApplicationExam: 70-511 Enhancing Usability - Windows Application
Exam: 70-511 Enhancing Usability - Windows Application
 
Jak zostać mobile deweloperem w 1 dzień
Jak zostać mobile deweloperem w 1 dzieńJak zostać mobile deweloperem w 1 dzień
Jak zostać mobile deweloperem w 1 dzień
 
Devbox - wirtualne środowisko pracy
Devbox - wirtualne środowisko pracyDevbox - wirtualne środowisko pracy
Devbox - wirtualne środowisko pracy
 
Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...
Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...
Jak zbudować aplikacje z wykorzystaniem funkcjonalności windows server 2016...
 
C++. Wykorzystaj potęgę aplikacji graficznych
C++. Wykorzystaj potęgę aplikacji graficznychC++. Wykorzystaj potęgę aplikacji graficznych
C++. Wykorzystaj potęgę aplikacji graficznych
 
Wydajny frontend 2023
Wydajny frontend 2023Wydajny frontend 2023
Wydajny frontend 2023
 
Extjs & netzke
Extjs & netzkeExtjs & netzke
Extjs & netzke
 
Interfejs użytkownika w aplikacji mobilnej - LWUIT
Interfejs użytkownika w aplikacji mobilnej - LWUITInterfejs użytkownika w aplikacji mobilnej - LWUIT
Interfejs użytkownika w aplikacji mobilnej - LWUIT
 
WebView security on iOS (PL)
WebView security on iOS (PL)WebView security on iOS (PL)
WebView security on iOS (PL)
 
MySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalisty
MySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalistyMySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalisty
MySQL. Budowanie interfejsów użytkownika. Vademecum profesjonalisty
 

Google Web Toolkit

  • 1. Google Web Toolkit Autor: Bartosz Wójcik http://kuzniasukcesu.net/ (cc) by-nc-nd 2009
  • 2. http://kuzniasukcesu.net/ Google Web Toolkit (GWT) GWT - środowisko programowania aplikacji webowych z wykorzystaniem technologii AJAX
  • 3. http://kuzniasukcesu.net/ Wykorzystane technologie: JAVA ↓ JavaScript + XML (AJAX) • Aplikacje pisane w Javie (np. w środowisku Eclipse), potem kompilowane do JavaScript
  • 4. http://kuzniasukcesu.net/ Możliwości: • w fazie implementacji i testowania programujemy w Javie, kod produkcyjny jest kompilowany do JavaScript public class HelloWorld implements EntryPoint { private Button clickMeButton; public void onModuleLoad { RootPanel rootPanel = RootPanel.get(); clickMeButton = new Button(); rootPanel.add(clickMeButton); clickMeButton.setText(„Click me!”); clickMeButton.addClickListener(new ClickListener() { public void onClick(Widget sender) { Window.alert(„Hello, GWT World!”); } } } }
  • 5. http://kuzniasukcesu.net/ • możliwość tworzenia na poziomie Javy wstawek w JavaScript (JSNI) public static native void alert(String msg) /*-{ $wnd.alert(msg); }-*/;
  • 6. http://kuzniasukcesu.net/ • testowanie oraz debugowanie aplikacji WWW w taki sam sposób jak aplikacji Windowsowej
  • 7. http://kuzniasukcesu.net/ • skompilowany do JavaScript kod jest zoptymalizowany i dostosowany do różnych przeglądarek (aktualnie IE, Firefox, Mozilla, Safari, Opera) – zrealizowane jest to przy pomocy techniki „opóźnionego wiązania” (ang. deferred binding)
  • 8. http://kuzniasukcesu.net/ Możliwości, c.d.: • możliwość ponownego wykorzystania komponentów UI w innych projektach • możliwość tworzenia UnitTestów dla kodu za pomocą np. Junit • obsługa RPC (Remote Procedure Calls)
  • 9. http://kuzniasukcesu.net/ Za i przeciw + skompilowany przez maszynę kod w JavaScript jest bezpieczniejszy niż JavaScript wygenerowany przez człowieka + taki kod jest też lepiej zoptymalizowany + łatwe debugowanie kodu + nie trzeba się martwić o kompatybilność pomiędzy przeglądarkami – standardowe widgety są niewystarczające – brak darmowych edytorów interfejsu użytkownika – powolnie działanie w trybie hostowanym przy dużych projektach
  • 10. http://kuzniasukcesu.net/ Przykładowe aplikacje • Contact Office http://beta.contactoffice.com/
  • 11. http://kuzniasukcesu.net/ • QueWeb http://demo.queplix.com/
  • 12. http://kuzniasukcesu.net/ • MyNetImages http://www.mynetimages.com/
  • 13. http://kuzniasukcesu.net/ • Mail App http://code.google.com/webtoolkit/documentation/examples/desktopclo
  • 14. http://kuzniasukcesu.net/ Jak zacząć? • Instalacja Java SDK. http://java.sun.com/javase/downloads/ • Ściągnięcie i rozpakowanie GWT. http://code.google.com/webtoolkit/download.html
  • 15. http://kuzniasukcesu.net/ Tworzenie nowego projektu • Za pomocą narzędzia applicationCreator tworzymy pliki projektu. applicationCreator com.client.MojaAplikacja
  • 16. http://kuzniasukcesu.net/ Tworzenie nowego projektu dla środowiska Eclipse 1. Za pomocą narzędzia projectCreator tworzymy nowy projekt Eclipse: projectCreator -eclipse MojProjekt
  • 17. http://kuzniasukcesu.net/ 1. Tworzymy pliki projektu dla naszej aplikacji: applicationCreator -eclipse MojProjekt com.client.MojaAplikacja
  • 18. http://kuzniasukcesu.net/ Struktura projektu • Nazwa: com.MojaAplikacja • Katalog bazowy: com ▫ mieści zawartość projektu • Katalog publiczny: com.public ▫ mieści pliki HTML, CSS oraz obrazki • Katalog zawierający kod klienta: com.client ▫ mieści pliki *.java kompilowane do JavaScript • Katalog zawierający kod serwera: com.server ▫ mieści kod w Javie, który będzie wykonywany na serwerze • Plik opisujący projekt GWT: MojaAplikacja.gwt.xml
  • 19. http://kuzniasukcesu.net/ Kompilacja projektu do JavaScript Uruchomienie skryptu MojaAplikacja-compile.cmd
  • 20. http://kuzniasukcesu.net/ Uruchamianie aplikacji w środowisku Google’a Uruchomienie skryptu MojaAplikacja-shell.cmd
  • 21. http://kuzniasukcesu.net/ Dodawanie projektu do Eclipse
  • 22. http://kuzniasukcesu.net/ Wstawianie GWT do HTML • cały serwis WWW może zostać wykonany w technologii GWT
  • 23. http://kuzniasukcesu.net/ • GWT może też występować jako wstawki do istniejącej strony w HTML Fragment strony w HTML Fragment kodu w Javie odnoszącego się do strony HTML
  • 24. http://kuzniasukcesu.net/ Biblioteki kontrolek • Podstawowa biblioteka: http://gwt.google.com/samples/Showcase/Showcase.html • Biblioteka rozszerzona (wypasiona): http://www.gwt-ext.com/demo/
  • 25. http://kuzniasukcesu.net/ Do poczytania • Strona domowa projektu: http://code.google.com/webtoolkit/ • http://www.scribd.com/doc/44602/Google-Web-Toolkit • http://www.devbg.org/seminars/seminar-GWT-26-september-2007/AJA • http://www.slideshare.net/dgirard/gwt-gears-the-browser-is-the-platform