[RIA] 如何編譯與散佈最簡單的 GWT 程式

如果你下載了 GWT SDK,  解開後應該會有一個 Hello 範例. 我們就以這個為例子描述如何快速的完成下面的目標.

預計閱讀與實作時間:    1 hour

本文主要內容:

1. 設定編譯你的編譯環境
     - Download & Install Software
     - Setup your environment variables
     - Tomcat 與 Apache 連動部分的設定
2. 開始編譯 Hello 範例
3. 安裝與部署你的 Hello.war
4. 滑鼠 double-click 自動化完成編譯與部署

5. 如何安裝與部署你的 SmartGWT 程式

Key words: RIA (Rich Internet Application), GWT (Google Web Toolkit), SmartGWT

文章開始

設定編譯你的編譯環境

Step 1: Download & Install Software

            1. GWT SDK: 寫 GWT 的套件

            2. Ant: 編譯 GWT 程式的工具 & JDK
            3.  Tomcat: 執行 War 的 Server
            4. Apache: Web Server

            5. Apache Tomcat Connector: 負責 Apache 與 Tomcat 連動

 

Step 2: Setup your environment variables

            1. 新增 Path 指向的 Ant bin 位置
                 ex: c:\apache-ant-1.7.1-bin\bin

              2.  加入 ANT_HOME 指向 C:\apache-ant-1.7.1-bin

             3.  加入 JAVA_HOME 指向
                   C:\Program Files\Java\jdk1.6.0_17 

              4. 加入 GWT_HOME 指向 C:\gwt-2.0.0

Step 3: Tomcat 與 Apache 連動部分設定
我希望將來有關 RIA 應用程式的網頁, 主要的對外門戶是 Apache. 所以利用 Connector 模組, 幫我們將 RIA 相關的 request 轉送給 Tomcat 伺服器處理.

            1. 改名:
                 mod_jk-1.2.28-httpd-2.2.3.so -> mod_jk.so

            2. 安裝 Connector 到 Apache 模組
                copy the mod_jk.so to ${apache_home} \ modules

 

                            3. 自動產生 mod_jk.conf 檔 (3 steps)
                                 從這個檔案的資訊, 告知 Apache 在哪裡載入 Connector
                                  module 以及相關的 log 檔 

                                  a. 編輯 c:\Program Files\Apache Software
                                                Foundation\Tomcat 6.0\conf\server.xml 檔
                                  b. 加入下面的內容:

                                    c. restart your tomcat server                                       d. 自動產生的 mod_jk.conf 設定檔, 會放在
                                          C:\Program Files\Apache Software
                                           Foundation\Tomcat 6.0\conf\auto\

 

                         4. 將 workers.properties 檔 複製到 C:\Program Files\Apache
                              Software Foundation\Tomcat 6.0\conf\jk 目錄中

                              (workers.properties 這個檔
                              你可以從  Connector source code 封裝檔裡面找到範例)

                         5. 修改 workers.properties 中 必要的路徑

                          例如:

開始編譯 Hello 範例

Step 1: cd C:\gwt-2.0.0\samples\Hello

Step 2: ant war

安裝與部署你的 Hello.war

     Step 1: Copy your hello.war file to Tomcat\webapps

     Step 2: Restart Tomcat and then restart Apache

     Step 3: Test your hello.html

滑鼠 double-click 自動化完成編譯與部署

 

Smart GWT 擴充套件?

這個套件很厲害! 可以讓你在很短時間內, 建立非常美觀的 Rich Internet Applications

    

好了, 我們直接看怎麼編譯然後怎麼用?

Requirement (2 notes)

1. 你需要安裝 Google Web Toolkit (GWT): http://code.google.com/webtoolkit/

2. 設定環境變數 GWT_HOME 指向 C:\gwt-2.0.0

ex:

Compile (2 steps)

  Step 1: C:\smartgwt-2.0\helloworld-2.0

  Step 2: 直接下指令編譯 ant war

 

Deploy (3 steps)

  Step 1: Install your war file to the webapps directory
      copy *.war "C:\Program Files\Apache Software Foundation\
      Tomcat 6.0\webapps"

  Step 2: Restart Tomcat
       net stop "Tomcat6"
       net start "Tomcat6"

  Step 3: Restart Apache
       net stop "Apache2.2"
       net start "Apache2.2"

Testing (1 steps)

      http://localhost/HelloWorld/HelloWorld.html

Enjoy!

 

by Jing.