クイックスタート・ガイド
このセクションでは迅速にClickによるWebアプリケーションを立ち上げる方法を解説します。ビルドシステムやIDEの設定方法については触れませんが、あなたがClickによるWebアプリケーションを実行するために必要な全ての事柄について焦点をあてています。
次の事項がカバーされています。
Webアプリケーションの構造
まず最初に、click.xmlとweb.xmlをアプリケーションのWEB-INFディレクトリに配置します。
click.xml
click.xmlの内容は以下の通りです:
web.xml
web.xmlの内容は以下の通りです:
JARファイル群
以下のJARファイルをアプリケーションのWEB-INF/libディレクトリに追加します。
- click-x.x.x-incubating.jar
- click-extras-x.x.x-incubating.jar
x.x.xはClickのバージョンを指します。
これらのファイルはClickのディストリビューションのdistディレクトリにあります。
ウェルカム・ファイル
デフォルトのアプリケーションへのリクエスト(例えば、http://localhost:8080/quickstart/ )があなたのアプリケーションのホームページに送信されるようにするために、redirect.htmlをウェブアプリケーションのルートディレクトリに追加します。このファイルの内容は以下の通りです。
このredirect.htmlはweb.xmlにおいてデフォルトのリクエストに対して割り当てられています。
Webブラウザがredirect.htmlを処理すると、アプリケーションのhome.htmにリダイレクトされます。
ホームページ
さて、これでアプリケーションのホームページとなる最初のClickページを追加する準備が整いました。
まずはHomePageクラスを定義します。そしてクラスファイルをWebアプリケーションのWEB-INF/classesディレクトリに配置してください。
次に対応するhome.htmをWebアプリケーションのルートディレクトリに作成します。
さらにstyle.cssをWebアプリケーションのルートディレクトリに追加します。
Webアプリケーションは以下のような構造になっているはずです。
Webアプリケーションがquickstartというコンテキストパスにデプロイされているとすると、以下のリクエストが可能なはずです。
ブラウザはHomePageにリダイレクトされ、以下のようなページが表示されるはずです。
この例では、Clickはhome.htmへのリクエストを自動的にHomePageクラスにマッピングし、リクエストを処理するためにこのクラスを使用します。
ボーダー・テンプレート
次にページボーダーのテンプレートを作成しましょう。これによって複数のページが共通のルック＆フィールを持つことができます。
はじめにborder-template.htmをWebアプリケーションのルートディレクトリに作成します。このファイルの内容は以下の通りです。
テンプレートとして新しく作成したborder-template.htmを使用するBorderPageクラスを定義します。
テンプレートファイルをborder-template.htmという名前にしましたが、これはBorderPageに自動的にマッピングされないことに注意してください。
次にHomePageクラスを、BorderPageを継承してtitleの値を定義するよう修正します。
そしてhome.htmからページボーダーを取り除き、以下の内容だけを含むように修正します。
ここまでの作業でWebアプリケーションは以下のようになっているはずです:
変更したホームページへブラウザでアクセスすると、以下のようなHTMLが表示されるはずです。
ロギング
Clickはページテンプレートとページクラスがどのように自動マッピングされているかを表示するための便利なロギング機能を持っています。デバッグログを有効にするにはvalue属性に"debug"を指定したmode要素をclick.xmlに追加します。
Clickアプリケーションが起動すると、以下のようなロギング・メッセージが出力されます。
[Click] [debug] automapped pages: [Click] [debug] /border-template.htm -> CLASS NOT FOUND [Click] [debug] /home.htm -> com.quickstart.page.HomePage [Click] [info ] initialized in debug mode
Clickはここでhome.htmはHomePageクラスにマッピングされるものの、border-template.htmがどのページクラスにもマッピングされていないと言っています。また、Clickがデバッグモードで実行されていることもわかります。
ホームページへのリクエストを行うと、以下のような出力が得られるはずです。
[Click] [debug] GET http://localhost:8888/quickstart/home.htm [Click] [info ] renderTemplate: /home.htm,border-template.htm - 46 ms [Click] [info ] handleRequest: /home.htm - 62 ms
これはClickServletがHTTPリクエストを受信したことを知らせています。そしてページパスであるhome.htmとテンプレートであるborder-template.htmが46ミリ秒で行われたこと、最終的にこのリクエストを処理するのに62ミリ秒かかったということがわかります。
もしあなたがより詳細なデバッグ情報を必要とするのであれば、アプリケーションモードをtraceに変更してください。そしてブラウザから以下のURLをリクエストしてみます:
リクエストパラメータがログに出力されます。これはフォームのポストをデバッグする際にとても便利です。
[Click] [debug] GET http://localhost:8080/quickstart/home.htm [Click] [trace] request param: password=secret [Click] [trace] request param: user=malcolm [Click] [trace] invoked: HomePage.<<init>> [Click] [trace] invoked: HomePage.onSecurityCheck() : true [Click] [trace] invoked: HomePage.onInit() [Click] [trace] invoked: HomePage.onGet() [Click] [trace] invoked: HomePage.onRender() [Click] [info ] renderTemplate: /user/home.htm,border-template.htm - 6 ms [Click] [trace] invoked: HomePage.onDestroy() [Click] [info ] handleRequest: /home.htm - 24 ms
次のステップ
あなたはこのクイックスタートを終えて疑問に感じることがあったかもしれません。次のステップとして以下をお薦めします。
- Quick Start Project Builder を利用するとより完全なプロジェクトサンプルを生成できます。
- Clickのベスト・プラクティスを読んでください。
- Clickのサンプルアプリケーションを見てみてください。そこにはあなたのアプリケーションに組み込むことのできる多くのサンプルコードとパターンがあります。
- 幅広いナビゲーションを提供するためにMenuコントロールをあなたのborder-template.htmに追加してください。
- J2EEセキュリティをあなたのアプリケーションに統合してください。メニューをレンダリングするマクロにおいて認証されたユーザ用のメニュー項目を表示するには$menu.isUserInRoles()を使用してください。
Quick Start Project Builder
Click Webアプリケーションを立ち上げて実行するもっとも早い方法は project-quick-start Antタスクを利用することです。このAntタスクでは、以下の機能を含むアプリケーションをビルドします。
- JEEコンテナセキュリティモデルと統合されたログイン画面
- 幅広のナビゲーションによるメニュー制御
- ボーダーテンプレート
必要条件
project-quick-start Antタスクを実行するには以下の用件が満たされていることを確認してください。
- JAVA_HOME環境変数が設定されており、JDKのインストール場所を指していることを確認する。（1.4かそれ以上）
- ANT_HOME環境変数が設定されており、Antのインストール場所を指していることを確認する。（1.7.0かそれ以上）
- Antのget-depsタスクを実行し依存関係にあるライブラリをダウンロードしていることを確認する。
QuickStartの実行
quick start application builderを実行するには単に以下の例の様にしてください：
ant project-quick-start
Buildfile: build.xml
project-quick-start:
[input] Please enter the project name (e.g. quickstart): [quickstart]
quickstart
[input] Please enter the root package name (e.g. com.quickstart): [com.quickstart]
com.quickstart
[input] Please enter the web app context path: [quickstart]
quickstart
[input] The directory 'C:\quickstart' will be deleted. Continue (y/n)? (y, n)
y
[copy] Copying 20 files to C:\quickstart\WebContent
[copy] Copied 9 empty directories to 2 empty directory under C:\quickstart\WebContent
[copy] Copying 1 file to C:\quickstart\WebContent\WEB-INF\lib
[copy] Copying 1 file to C:\quickstart\WebContent\WEB-INF\lib
[copy] Copying 1 file to C:\quickstart\WebContent\WEB-INF\lib
[copy] Copying 1 file to C:\quickstart\lib
[copy] Copying 1 file to C:\quickstart\
[copy] Copying 1 file to C:\quickstart\
[copy] Copying 11 files to C:\quickstart\src\com\quickstart
BUILD SUCCESSFUL
Total time: 18 seconds
一度タスクが完了すると以下のようなディレクトリが作成されます：
[quickstart] プロジェクトルートディレクトリ | +---[lib] ビルド時に使用するJarライブラリディレクトリ | +---[src] Javaソースファイルディレクトリ | +---[WebContent] Webアプリケーションルートディレクトリ | | | +---[admin] Admin ロールページディレクトリ | | | +---[assets] アプリケーションの静的な資産ディレクトリ | | | +---[click] Clickの静的な資産ディレクトリ | | | +---[META-INF] Tomcat context.xml ディレクトリ | | | +---[user] User ロールページディレクトリ | | | +---[WEB-INF] 保護された Web-INF ディレクトリ | | | +---[lib] 実行時Jarライブラリディレクトリ | +---build.xml Ant build スクリプトファイル | +---README.txt READMEファイル
Tomcatにデプロイ
Tomcatでquickstartアプリケーションを実行するためには、userとadminのセキュリティロール設定と数人のユーザ追加が必要です。$TOMCAT\conf にあるtomat-users.xmlファイルに追加します。例えば：
ほかのJEEアプリケーションサーバーを利用する場合は、そのサーバでのセキュリティ設定について調べる必要があります。
次にquickstart.warファイルを$TOMCAT\webappsディレクトリにコピーし、立ち上がったWebアプリケーションにユーザ：admin1 / password でログインします。