Java Web Application Development With Click Framework/Quick Start

This section discusses how to get a Click web application up quickly. This section will not discuss how to configure your build system or IDE, but will focus on all the basic pieces you need to get a Click application running.

The following topics are covered:


 * Web Application Structure
 * JAR Files
 * Welcome File
 * Home Page
 * Border Template
 * Logging
 * What's Next?

Web Application Structure
First up add a click.xml and web.xml configuration file to your applications WEB-INF directory:

click.xml
Your click.xml file should contain:

web.xml
Your web.xml file should contain:

JAR Files
Add the following JAR files to your application WEB-INF/lib :


 * click-1.x.jar
 * click-extras-1.x.jar

You can obtain these files from the Click distribution dist directory.

Welcome File
To ensure default application requests (e.g. http://localhost:8080/quickstart/ ) are sent to your applications home page we will add a redirect.html file to the web root directory. This file should contain:

This <tt>redirect.html</tt> file is configured in our <tt>web.xml</tt>, and any default requests will be served this file:

When the browser processes the <tt>redirect.html</tt> it will redirect to the applications home.htm page.

Home Page
Now we are ready to add our first Click page which will be our applications home page.

First we define a <tt>HomePage</tt> class, and ensure the class file is published to our web applications <tt>WEB-INF/classes</tt> directory:

Next we add a corresponding Home page home.htm in the web root directory:

Next add a <tt>style.css</tt> file to your web root directory:

You should now have the following web files:



Now, if your web application is deployed to the context path quickstart you should now be able to make the request:


 *  http://localhost:8080/quickstart/ 

Your browser should be redirected to your <tt>HomePage</tt> and you should see your page rendered as:

Home

Welcome to Home page your application starting point.

In this example the Click automatically maps the <tt>home.htm</tt> request to our <tt>HomePage</tt> class and uses this class to process the request.

Border Template
Now we want to create a page border template so application pages will have a common look and feel.

First create a <tt>border-template.htm</tt> file in the web root directory. In this file include the HTML content:

Now we define a <tt>BorderPage</tt> class which specifies its template as the new <tt>border-template.htm</tt> file:

Note we named the template file <tt>border-template.htm</tt> so that it is not automatically mapped by Click to our <tt>BorderPage</tt> class.

Now we are going to modify our <tt>HomePage</tt> class to extend <tt>BorderPage</tt> and define a title value.

Next we modify our home.htm to remove the page border and only include the specific Home page content.

You should now have the following web files:



Now if you make browser request to your updated home page you should see identical HTML content being rendered.

Home

Welcome to Home page your application starting point.

Logging
Click has some handy logging features which will show you how your page templates are being automatically mapped to you page classes. To enable debug logging add a mode value of "debug" to your <tt>click.xml</tt> file:

When the Click application starts up it will write out the following logging messages:

[Click] [debug] automapped pages: [Click] [debug] /border-template.htm -&gt; CLASS NOT FOUND [Click] [debug] /home.htm -&gt; com.quickstart.page.HomePage [Click] [info ] initialized in debug mode

Click is telling us here that the <tt>border-template.htm</tt> template is not mapped to any Page class, while the <tt>home.htm</tt> template is mapped to our <tt>HomePage</tt> class. We are also informed that Click is running in <tt>debug</tt> mode.

When making a request to our home page we may get the following output:

[Click] [debug] GET http://localhost:8080/quickstart/home.htm [Click] [info ] renderTemplate: /home.htm,border-template.htm - 46 ms [Click] [info ] handleRequest: /home.htm - 62 ms

This is telling us the HTTP request that the ClickServlet received. Then we can see that it is rendering the page path <tt>home.htm</tt> and template <tt>border-template.htm</tt> files in 46 milliseconds. Finally we can see that the total time to handle this request was 62 milliseconds

If you need more detailed debugging information change the application mode to <tt>trace</tt>. Now if we make the browser request:


 *  http://localhost:8080/quickstart/home.htm?user=malcolm&amp;password=secret 

We will see the request parameters logged. This can be very handy for debugging form posts.

[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.&lt;&lt;init&gt;&gt; [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

What's Next
After you have the Quick Start application up and running you might be wondering, where do I go from here? There are lot of good code examples and patterns you can lift into your application: Use the Menu <tt>$menu.isUserInRoles</tt> method in your menu rendering macro to only display a user's authorized menu options.
 * 1) Add a Menu control to your <tt>border-template.htm</tt> to provide application wide navigation.
 * 2) Integrate J2EE Security into your application.