TOC

Wicketフレームワークの紹介

Wicketフレームワークの紹介

1. 概要

Wicketは、デスクトップUI開発で知られているパターンを導入することにより、Webインターフェイスの構築を簡素化することを目的としたJavaサーバー側Webコンポーネント指向のフレームワークです。

Wicketでは、JavaコードとXHTML準拠のHTMLページのみを使用してWebアプリケーションを構築できます。 JavascriptもXML構成ファイルも必要ありません。

これは、要求と応答のサイクル全体にわたってレイヤーを提供し、低レベルでの作業から保護し、開発者がビジネスロジックに集中できるようにします。

この記事では、HelloWorld Wicketアプリケーションを構築することで基本を紹介し、その後、相互に通信する2つの組み込みコンポーネントを使用した完全な例を紹介します。

2. セットアップ

Wicketプロジェクトを実行するには、次の依存関係を追加しましょう。 


    org.apache.wicket
    wicket-core
    7.4.0

Maven Central repositoryで最新バージョンのWicketを確認することをお勧めします。これは、読んだ時点では、ここで使用されているものと一致しない場合があります。

これで、最初のWicketアプリケーションを作成する準備が整いました。

3. HelloWorld Wicket

WicketのWebApplicationクラスをサブクラス化することから始めましょう。これには、少なくともClass<? extends Page> getHomePage()メソッドのオーバーライドが必要です。

Wicketはこのクラスをアプリケーションのメインエントリポイントとして使用します。 メソッド内で、HelloWorld:という名前のクラスのclassオブジェクトを返すだけです。 

public class HelloWorldApplication extends WebApplication {
    @Override
    public Class getHomePage() {
        return HelloWorld.class;
    }
}

Wicketは設定よりも規約を優先します。 アプリケーションに新しいWebページを追加するには、2つのファイルを作成する必要があります。Javaファイルと、同じディレクトリの下に同じ名前（ただし拡張子は異なる）のHTMLファイルです。 追加の構成は、デフォルトの動作を変更する場合にのみ必要です。

ソースコードのパッケージディレクトリで、最初にHelloWorld.javaを追加します。 

public class HelloWorld extends WebPage {
    public HelloWorld() {
        add(new Label("hello", "Hello World!"));
    }
}

次にHelloWorld.html：

最後のステップとして、web.xml:内にフィルター定義を追加します 


    wicket.examples
    
      org.apache.wicket.protocol.http.WicketFilter
    
    
        applicationClassName
        
          com.example.wicket.examples.HelloWorldApplication

それでおしまい。 最初のWicket Webアプリケーションをコーディングしました。

warファイル（コマンドラインからmvn package）をビルドしてプロジェクトを実行し、JettyやTomcatなどのサーブレットコンテナにデプロイします。

ブラウザでhttp://localhost:8080/HelloWorld/にアクセスしましょう。 メッセージHello World!のある空のページが表示されます。

4. 改札コンポーネント

Wicketのコンポーネントは、Javaクラス、HTMLマークアップ、およびモデルで構成されるトライアドです。 モデルは、コンポーネントがデータにアクセスするために使用するファサードです。

この構造は、懸念事項をうまく分離し、コンポーネントをデータ中心の操作から切り離すことにより、コードの再利用を促進します。

The example that followsは、Ajaxの動作をコンポーネントに追加する方法を示しています。 ドロップダウンメニューとラベルの2つの要素を持つページで構成されています。 ドロップダウンの選択が変更されると、ラベル（およびラベルのみ）が更新されます。

HTMLファイルCafeSelector.htmlの本文は最小限に抑えられ、ドロップダウンメニューとラベルの2つの要素のみが含まれます。 




    Address: address

Java側で、ラベルを作成しましょう。 

Label addressLabel = new Label("address",
  new PropertyModel(this.address, "address"));
addressLabel.setOutputMarkupId(true);

HTMLファイルで割り当てられたwicket:idと一致するLabelコンストラクターの最初の引数。 2番目の引数は、コンポーネントのモデルであり、コンポーネントに表示される基になるデータのラッパーです。

setOutputMarkupIdメソッドは、コンポーネントをAjaxによる変更の対象にします。 ドロップダウンリストを作成して、Ajaxビヘイビアーを追加しましょう。 

DropDownChoice cafeDropdown
  = new DropDownChoice<>(
    "cafes",
    new PropertyModel(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であるため、Javascriptを1行も必要としませんでした。 ラベルの表示内容を変更するために、POJOを変更しました。 Javaオブジェクトの変更がWebページの変更に変換されるメカニズムはカーテンの後ろで発生し、開発者には関係ありません。

Wicketは、すぐに使えるAJAX対応コンポーネントの大きなセットを提供します。 実例を含むコンポーネントのカタログは、hereで入手できます。

5. 結論

この紹介記事では、JavaのコンポーネントベースのWebフレームワークであるWicketの基本について説明しました。

Wicketは、配管コードを完全になくすことを目的とした抽象化レイヤーを提供します。

このフレームワークを使用した開発がどのように見えるかを味わうために、on GitHubにある2つの簡単な例を含めました。

Related