Wicketフレームワークの概要
1. 概要
Wicket は、デスクトップUI開発で知られているパターンを導入することにより、Webインターフェイスの構築を簡素化することを目的としたJavaサーバー側のWebコンポーネント指向のフレームワークです。
Wicketを使用すると、JavaコードとXHTML準拠のHTMLページのみを使用してWebアプリケーションを構築できます。 JavascriptやXML構成ファイルは必要ありません。
これは、要求/応答サイクル全体にレイヤーを提供し、低レベルでの作業を防ぎ、開発者がビジネスロジックに集中できるようにします。
この記事では、 HelloWorld W icketアプリケーションを構築することで基本を紹介し、続いて相互に通信する2つの組み込みコンポーネントを使用した完全な例を紹介します。
2. 設定
Wicketプロジェクトを実行するには、次の依存関係を追加しましょう。
<dependency>
<groupId>org.apache.wicket</groupId>
<artifactId>wicket-core</artifactId>
<version>7.4.0</version>
</dependency>
Maven Centralリポジトリで最新バージョンのWicketを確認することをお勧めします。これは、読んだ時点で、ここで使用されているものと一致しない場合があります。
これで、最初のWicketアプリケーションを構築する準備が整いました。
3. HelloWorldウィケット
Wicketのサブクラス化から始めましょうウェブアプリケーションクラス。少なくとも、オーバーライドする必要があります。
Wicketは、このクラスをアプリケーションのメインエントリポイントとして使用します。 メソッド内で、 HelloWorld:という名前のクラスのclassオブジェクトを返すだけです。
public class HelloWorldApplication extends WebApplication {
@Override
public Class<? extends Page> getHomePage() {
return HelloWorld.class;
}
}
Wicketは設定より規約を優先します。 アプリケーションに新しいWebページを追加するには、同じディレクトリに同じ名前(ただし拡張子が異なる)のJavaファイルとHTMLファイルの2つのファイルを作成する必要があります。 追加の構成が必要になるのは、デフォルトの動作を変更する場合のみです。
ソースコードのパッケージディレクトリで、最初にHelloWorld。javaを追加します。
public class HelloWorld extends WebPage {
public HelloWorld() {
add(new Label("hello", "Hello World!"));
}
}
次にHelloWorld.html:
<html>
<body>
<span wicket:id="hello"></span>
</body>
</html>
最後のステップとして、 web.xml:内にフィルター定義を追加します
<filter>
<filter-name>wicket.examples</filter-name>
<filter-class>
org.apache.wicket.protocol.http.WicketFilter
</filter-class>
<init-param>
<param-name>applicationClassName</param-name>
<param-value>
com.baeldung.wicket.examples.HelloWorldApplication
</param-value>
</init-param>
</filter>
それでおしまい。 最初のWicketWebアプリケーションをコーディングしました。
war ファイル(コマンドラインから mvn package )をビルドしてプロジェクトを実行し、JettyやTomcatなどのサーブレットコンテナーにデプロイします。
ブラウザでhttp:// localhost:8080 / HelloWorld/にアクセスしてみましょう。 メッセージのある空のページ
4. ウィケットコンポーネント
Wicketのコンポーネントは、Javaクラス、HTMLマークアップ、およびモデルで構成されるトライアドです。 モデルは、コンポーネントがデータにアクセスするために使用するファサードです。
この構造は、関心の分離をうまく分離し、コンポーネントをデータ中心の操作から切り離すことにより、コードの再利用を増やします。
次の例は、Ajaxの動作をコンポーネントに追加する方法を示しています。 ドロップダウンメニューとラベルの2つの要素を持つページで構成されています。 ドロップダウンの選択が変更されると、ラベル(およびラベルのみ)が更新されます。
HTMLファイルCafeSelector.htmlの本文は最小限に抑えられ、ドロップダウンメニューとラベルの2つの要素のみが含まれます。
<select wicket:id="cafes"></select>
<p>
Address: <span wicket:id="address">address</span>
</p>
Java側で、ラベルを作成しましょう。
Label addressLabel = new Label("address",
new PropertyModel<String>(this.address, "address"));
addressLabel.setOutputMarkupId(true);
HTMLファイルで割り当てられたwicket:idと一致するLabelコンストラクターの最初の引数。 2番目の引数は、コンポーネントのモデルであり、コンポーネントに表示される基になるデータのラッパーです。
setOutputMarkupId メソッドは、コンポーネントをAjaxによる変更の対象にします。 ドロップダウンリストを作成して、Ajaxの動作を追加しましょう。
DropDownChoice<String> cafeDropdown
= new DropDownChoice<>(
"cafes",
new PropertyModel<String>(this, "selectedCafe"),
cafeNames);
cafeDropdown.add(new AjaxFormComponentUpdatingBehavior("onchange") {
@Override
protected void onUpdate(AjaxRequestTarget target) {
String name = (String) cafeDropdown.getDefaultModel().getObject();
address.setAddress(cafeNamesAndAddresses.get(name).getAddress());
target.add(addressLabel);
}
});
作成はラベルの作成に似ており、コンストラクターは改札ID、モデル、およびカフェ名のリストを受け入れます。
次に、 AjaxFormComponentUpdatingBehavior が、 onUpdate コールバックメソッドとともに追加されます。このコールバックメソッドは、ajaxリクエストが発行されるとラベルのモデルを更新します。 最後に、ラベルコンポーネントが更新のターゲットとして設定されます。
最後に、ラベルコンポーネントが更新のターゲットとして設定されます。
ご覧のとおり、すべてがJavaであるため、1行のJavascriptは必要ありませんでした。 ラベルの表示を変更するために、POJOを変更しただけです。 Javaオブジェクトの変更がWebページの変更に変換されるメカニズムは、カーテンの後ろで発生し、開発者には関係ありません。
Wicketは、AJAX対応のコンポーネントの大きなセットをすぐに提供します。 実例を含むコンポーネントのカタログは、こちらで入手できます。
5. 結論
この紹介記事では、JavaのコンポーネントベースのWebフレームワークであるWicketの基本について説明しました。
Wicketは、配管コードを完全に排除することを目的とした抽象化レイヤーを提供します。
このフレームワークを使用した開発がどのように見えるかを味わうために、GitHubにあるの2つの簡単な例を含めました。