| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
| <title>Hello World! | Apache Wicket</title> |
| <meta charset="utf8"> |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> |
| |
| <link rel="shortcut icon" href="/favicon.ico" type="image/vnd.microsoft.icon" /> |
| <link rel="stylesheet" href="/css/style.css" type="text/css" media="screen" /> |
| <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" /> |
| |
| <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> |
| |
| </head> |
| |
| <body class=""> |
| <div class="header default"> |
| <div class="l-container"> |
| <nav class="mainmenu"> |
| <ul> |
| <!-- /start/quickstart.html || /learn/examples/helloworld.html --> |
| <li class=""><a href="/start/quickstart.html">Quick Start</a></li> |
| <!-- /start/download.html || /learn/examples/helloworld.html --> |
| <li class=""><a href="/start/download.html">Download</a></li> |
| <!-- /learn || /learn/examples/helloworld.html --> |
| <li class=""><a href="/learn">Documentation</a></li> |
| <!-- /help || /learn/examples/helloworld.html --> |
| <li class=""><a href="/help">Support</a></li> |
| <!-- /contribute || /learn/examples/helloworld.html --> |
| <li class=""><a href="/contribute">Contribute</a></li> |
| <!-- /apache || /learn/examples/helloworld.html --> |
| <li class=""><a href="/apache">Apache</a></li> |
| </ul> |
| </nav> |
| <div class="logo"> |
| <a href="/"><img src="/img/logo-apachewicket-white.svg" alt="Apache Wicket"></a> |
| </div> |
| </div> |
| </div> |
| <main> |
| <div class="l-container"> |
| <header class="l-full preamble"> |
| <h1>Hello World!</h1> |
| </header> |
| <section class="l-one-third right"> |
| <div id="toc" class="toc"><div id="toc-title"><h2>Table of Contents</h2></div><ul><li class="toc--level-1 toc--section-1"><a href="#ready-to-deploy"><span class="toc-number">1</span> <span class="toc-text">Ready to deploy</span></a></li></ul></div> |
| </section> |
| <section class="l-two-third left"> |
| <p>HelloWorld demonstrates the basic structure of a web application in Wicket. A |
| Label component is used to display a message on the home page for the |
| application.</p> |
| <p>In all the Wicket examples, you have to put all files in the same package |
| directory. This means putting the markup files and the java files next to one |
| another. It is possible to alter this behavior, but that is beyond the scope |
| of this example. The only exception is the obligatory web.xml file which |
| should reside in the WEB-INF/ directory of your web application root folder.</p> |
| <p>If you wish to start building this example, you may want to take a look at the |
| Wicket Quickstart project, which provides a quick way of getting up and |
| running without having to figure things out yourself. The Quickstart project |
| contains the necessary build files (Ant and Maven), libraries, minimal set of |
| Java and markup files and an embedded Jetty server to run your application |
| without having to go through the whole build-deploy cycle.</p> |
| <h3 id="helloworldapplicationjava">HelloWorldApplication.java</h3> |
| <p>Each Wicket application is defined by an Application object. This object |
| defines what the home page is, and allows for some configuration.</p> |
| <div class="highlight"><pre><code class="language-java" data-lang="java"><span class="kn">import</span> <span class="nn">org.apache.wicket.protocol.http.WebApplication</span><span class="o">;</span> |
| <span class="kd">public</span> <span class="kd">class</span> <span class="nc">HelloWorldApplication</span> <span class="kd">extends</span> <span class="n">WebApplication</span> <span class="o">{</span> |
| <span class="kd">public</span> <span class="nf">HelloWorldApplication</span><span class="o">()</span> <span class="o">{</span> |
| <span class="o">}</span> |
| <span class="cm">/**</span> |
| <span class="cm"> * @see org.apache.wicket.Application#getHomePage()</span> |
| <span class="cm"> */</span> |
| <span class="nd">@Override</span> |
| <span class="kd">public</span> <span class="n">Class</span> <span class="nf">getHomePage</span><span class="o">()</span> <span class="o">{</span> |
| <span class="k">return</span> <span class="n">HelloWorld</span><span class="o">.</span><span class="na">class</span><span class="o">;</span> |
| <span class="o">}</span> |
| <span class="o">}</span></code></pre></div> |
| <p>Here you can see that we define <code>wicket.examples.helloworld.HelloWorld</code> to be |
| our home page. When the base URL of our application is requested, the markup |
| rendered by the HelloWorld page is returned.</p> |
| <h3 id="helloworldjava">HelloWorld.java</h3> |
| <div class="highlight"><pre><code class="language-java" data-lang="java"><span class="kn">import</span> <span class="nn">org.apache.wicket.markup.html.WebPage</span><span class="o">;</span> |
| <span class="kn">import</span> <span class="nn">org.apache.wicket.markup.html.basic.Label</span><span class="o">;</span> |
| <span class="kd">public</span> <span class="kd">class</span> <span class="nc">HelloWorld</span> <span class="kd">extends</span> <span class="n">WebPage</span> <span class="o">{</span> |
| <span class="kd">public</span> <span class="nf">HelloWorld</span><span class="o">()</span> <span class="o">{</span> |
| <span class="n">add</span><span class="o">(</span><span class="k">new</span> <span class="nf">Label</span><span class="o">(</span><span class="s">"message"</span><span class="o">,</span> <span class="s">"Hello World!"</span><span class="o">));</span> |
| <span class="o">}</span> |
| <span class="o">}</span></code></pre></div> |
| <p>The Label is constructed using two parameters:</p> |
| <ol> |
| <li> |
| <p>“message”</p> |
| </li> |
| <li> |
| <p>“Hello World!”</p> |
| </li> |
| </ol> |
| <p>The first parameter is the component identifier, which Wicket uses to identify |
| the <code>Label</code> component in your HTML markup. The second parameter is the message |
| which the <code>Label</code> should render.</p> |
| <h3 id="helloworldhtml">HelloWorld.html</h3> |
| <p>The HTML file that defines our Hello World functionality is as follows:</p> |
| <div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt"><html></span> |
| <span class="nt"><body></span> |
| <span class="nt"><span</span> <span class="na">wicket:id=</span><span class="s">"message"</span><span class="nt">></span>Message goes here<span class="nt"></span></span> |
| <span class="nt"></body></span> |
| <span class="nt"></html></span></code></pre></div> |
| <p>In this file, you see two elements that need some attention:</p> |
| <ul> |
| <li> |
| <p>the component declaration <code><span wicket:id="message"></code></p> |
| </li> |
| <li> |
| <p>the text <code>Message goes here</code></p> |
| </li> |
| </ul> |
| <p>The component declaration consists of the Wicket identifier <code>wicket:id</code> and the |
| component identifier <code>message</code>. The component identifier should be the same as |
| the name of the component you defined in your <code>WebPage</code>. The text between |
| the <code><span></code> tags is removed when the component renders its message. The final |
| content of the component is determined by your Java code.</p> |
| <h3 id="webxml">web.xml</h3> |
| <p>In order to deploy our HelloWorld program, we need to make our application |
| known to the application server by means of the web.xml file.</p> |
| <div class="highlight"><pre><code class="language-xml" data-lang="xml"><span class="cp"><?xml version="1.0" encoding="UTF-8"?></span> |
| <span class="cp"><!DOCTYPE web-app</span> |
| <span class="cp"> PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"</span> |
| <span class="cp"> "http://java.sun.com/dtd/web-app_2_3.dtd"></span> |
| <span class="nt"><web-app></span> |
| <span class="nt"><display-name></span>Wicket Examples<span class="nt"></display-name></span> |
| <span class="nt"><filter></span> |
| <span class="nt"><filter-name></span>HelloWorldApplication<span class="nt"></filter-name></span> |
| <span class="nt"><filter-class></span>org.apache.wicket.protocol.http.WicketFilter<span class="nt"></filter-class></span> |
| <span class="nt"><init-param></span> |
| <span class="nt"><param-name></span>applicationClassName<span class="nt"></param-name></span> |
| <span class="nt"><param-value></span>org.apache.wicket.examples.helloworld.HelloWorldApplication<span class="nt"></param-value></span> |
| <span class="nt"></init-param></span> |
| <span class="nt"></filter></span> |
| <span class="nt"><filter-mapping></span> |
| <span class="nt"><filter-name></span>HelloWorldApplication<span class="nt"></filter-name></span> |
| <span class="nt"><url-pattern></span>/*<span class="nt"></url-pattern></span> |
| <span class="nt"></filter-mapping></span> |
| <span class="nt"></web-app></span></code></pre></div> |
| <p>In this definition you see the Wicket filter defined, which handles all |
| requests. In order to let Wicket know which application is available, only the |
| applicationClassName filter parameter is needed.</p> |
| <p>Also, notice the url-mapping to /*. The Wicket filter will only process |
| requests that are Wicket requests. If a request is not Wicket related, the |
| filter will pass the request on to the chain. This ensures that (static) |
| resources outside the realm of the Wicket application, such as style sheets, |
| JavaScript files, images and so forth will be served by the container.</p> |
| <h2 id="ready-to-deploy">Ready to deploy</h2> |
| <p>That’s it. No more configuration necessary! All you need to do now is to |
| deploy the web application into your favorite application server. Point your |
| browser to the url: <code>http://<servername>/<warfilename>/</code>, substituting |
| servername and warfilename to the appropriate values, such as |
| http://localhost:8080/helloworld/.</p> |
| <p>As you can see: no superfluous XML configuration files are needed to enable a |
| Wicket application. Only the markup (HTML) files, the Java class files and the |
| required web.xml were needed to create this application.</p> |
| </section> |
| </div> |
| </main> |
| <footer class="l-container"> |
| <div class="l-full"> |
| <img height="60px" src="/img/asf_logo.gif" style="float:left"> |
| Copyright © 2014 — The Apache Software Foundation. Apache Wicket, |
| Wicket, Apache, the Apache feather logo, and the Apache Wicket |
| project logo are trademarks of The Apache Software Foundation. All |
| other marks mentioned may be trademarks or registered trademarks of |
| their respective owners. |
| </div> |
| </footer> |
| </body> |
| |
| </html> |