2010. 6. 30. 10:38
framework/apache click

[Apache Click] - 환경설정을 해보자.

출처
http://click.apache.org/docs/quick-start.html

1.  Web Application Structure

WEB-INF/ 디렉토리에 click.xml 과 web.xml 파일을 추가한다.
Click application configuration files
  • WEB-INF/click.xml   -   Application Configuration
  • WEB-INF/web.xml   -   Servlet Configuration  
click.xml
- click.xml 에 아래의 내용을 추가한다.
- page class 와 htm 파일을 package name으로 매핑 시켜 준다.
<?xml version="1.0" encoding="UTF-8"?>
<click-app>
  <pages package="com.demo.page"/>
  <pages package="com.demo.page" autobinding="annotation"/>
</click-app>

web.xml
- web.xml에 아래의 내용을 추가한다.
<?xml version="1.0" encoding="UTF-8"?>
<web-app>

  <servlet>
    <servlet-name>ClickServlet</servlet-name>
    <servlet-class>org.apache.click.ClickServlet</servlet-class>
    <load-on-startup>0</load-on-startup>
  </servlet>
 
  <servlet-mapping>
    <servlet-name>ClickServlet</servlet-name>
    <url-pattern>*.htm</url-pattern>
  </servlet-mapping>
 
  <welcome-file-list>
    <welcome-file>redirect.html</welcome-file>
  </welcome-file-list>
 
</web-app> 

2.  JAR Files

아래의 jar 파일들을 WEB-INF/lib 디렉토리에 추가한다.
  • click-x.x.x.jar
  • click-extras-x.x.x.jar
'x.x.x' 는 Click 의 버전
jar 파일들은 다운로드 받은 Click 의 dist 디렉토리에서 얻을수 있다.

3.  Welcome File

web 루트 디렉토리에 redirect.html 파일을 생성하고, 아래의 내용을 추가해라. redirect.html 은 web.xml 의 welcome-file 에서 설정한 넘임.
<html>
<head><meta http-equiv="Refresh" content="0;URL=home.htm"></head>
</html>

4.  Home Page

welcom file 에서 추가한 home page(Click page)를 만들어야 한다.

4.1> Page를 상속받은 class를 만들고 home.htm 파일을 만들면 될듯.
HomePage.java
- 컴파일된 class 파일은 WEB-INF/classes 디렉토리에 생성되게 한다.
package com.demo.page;

import org.apache.click.Page;

public class HomePage extends Page {

}

4.2> 웹 root 디렉토리에 home.htm 파일을 추가한다.
home.htm
- 아래의 내용을 추가한다.
<html>
<head>
  <title>Home</title>
  <link rel="stylesheet" type="text/css" href="style.css" title="Style"/>
</head>

<body>
 
  <div id="header">
    <span id="title">Home</span>
  </div>

  <div id="container">
    <b>Welcome</b> to Home page your application starting point.
  </div>
 
</body>
</html>

4.3>  web root 디렉토리에 style.css 파일을 생성한다.
style.css
body {
    font-family: Arial;
}

#header {
    background-color: navy;
}

#title {
    color: white;
    font-size: 18px;
    font-weight: bolder;
}

#container {
    padding-top: 1em;
    padding-left: 1.5em;
    position: relative;
    z-index: 0;
}

h3.title {
    margin-top: 0em;
    margin-bottom: 1em;
}

밑 에 처럼 프로젝트를 구성하면 된다.


환 경설정이 성공적으로 끝나고 context path quickstart 면 아래와 같은 결과가 나와야 할듯.
http://localhost:8080/quickstart/


실행결과

Home

Welcome to Home page your application starting point.



5.  Border Template
Page class 를 상속받아서 BorderPage를 만들어 보자. 뭐 내가 아직 실제로 돌려보지 않아서 뭐가 뭔지. 해보면 되것지.. 쩌ㅃ~

우선은 border-template.htm 파일을 생성하고 아래 코드를 추가하면 된다.
border-template.htm
<html>
<head>
<title>Click Quickstart - $title</title>
<link rel="stylesheet" type="text/css" href="$context/assets/style.css" title="Style"/>
<link rel="stylesheet" type="text/css" href="style.css" title="Style"/>
</head>

<body>
 
  <div id="header">
    <span class="title">$title</span>
  </div>
 
  <div id="container">
    #parse($path)
  </div>
 
</body>
</html>

다음으로, border-tamplate.htm 파일의 템플릿을 가지는 BorderPage.java 를 만들자.
BorderPage.java
package com.demo.page;

import org.apache.click.Page;

public class BorderPage extends Page {

   public String getTemplate() {
      return "/border-template.htm";
   }

}

BorderPage 클래스에서 "/border-template.htm" 랑 자동으로 매핑 안해주니까. 알아서 잘 맞춰줘야할듯.

다음으로, HomePage 클래스를 수정해주자.
HomePage.java- Example를 그대로 실행시키고 싶으면 click.xml 의 page 설정을 변경시켜줘야 한다.
change : <pages package="com.demo.page" autobinding="annotation"/>
package com.demo.page;

import org.apache.click.util.Bindable;

public class HomePage extends BorderPage {

    // page 에서 어노테이션을 사용할려면 click.xml 참조 ..
    // <pages package="com.demo.page" autobinding="annotation"/>
    @Bindable protected String title = "Home";

    // 어노테이션 없이 사용할 수도 있음.
    public HomePage() {
        getModel().put("title", "Home");
    }
}


마지막으로, home.htm 에서 page border 를 삭제하고(??) 아래의 내용만 포함시켜라.
(?? 돌려봐야 알듯.. 뭔소린지.. 모르것음 ㅋ)
home.htm
<b>Welcome</b> to Home page your application starting point.

위에꺼 설정 맞춰주면 아래와 같은 구조가 되어야 한다.
Click application web files
하여튼.. 죄다 업데이트 하고 돌려보면 처음에 했던 넘이랑 똑같아 진단다. 쩌ㅃ~
(sytle.css 가 적용이 안되는듯.. 화면이 결과랑 틀리게 나옴)

실행결과

Home

Welcome to Home page your application starting point.


6.  Logging
click.xml 에서 dubug mode 로 설정하면 로그를 볼 수 있단다. 아래와 같이 따라 해보삼.
click.xml
<?xml version="1.0" encoding="UTF-8"?>
<click-app>

  <pages package="com.quickstart.page"/>

  <mode value="debug"/>

</click-app> 
실행결과는 알아서 보삼. 구찮다.

7.  Whats Next ?
After you have the Quick Start application up and running you might be wondering, where do I go from here? At this point you are recommended to:

   1. Use the Quick Start Project Builder to generate a more complete project example.
   2. Read the Click Best Practices topic.
   3. Review the Click Examples application.

      There is a lot of good code examples and patterns you can lift into your application. 

8.  Quick Start Project Builder
Ant task project-quick-start 를 사용하면 빨리 click web application을 만들수 있다고 한다.

자세한 내용은 출처 참고

내도 이제 시작해봐야할듯...

저작자표시 비영리

'framework > apache click' 카테고리의 다른 글

[Apache Click] - Simple Table 만들자  (0) 2010.06.30
[Apache Click] - Control Listener 사용하자  (0) 2010.06.30
[Apache Click] - 한글 설정하자  (0) 2010.06.30
Posted by 짱가쟁이

티스토리툴바