wtorek, 23 lutego 2010

JSF + Tomcat 6 + Eclipse - Hello World

Konfiguracja Apache Tomcat 6
Zaczniemy od przygotowani środowiska pracy. Potrzebujemy oczywiście zainstalowanego Tomcat'a oraz pliku jstl-1.2.jar. Plik jar ściągamy i kopiujemy do katalogu tomcat_home\lib.

Pierwsza aplikacja Java Serwer Faces
Uruchamiamy eclipse i tworzymy nowy Dynamic Web Project.

Wpisujemy nazwę naszego produktu i ustawiamy:

  • Target runtime: na Apache Tomcat v6.0
  • Dynamic web model version: na 2.5
  • Configuration: na JavaSerwer Faces v1.2 Project

Wszystko powinno wyglądać mniej więcej tak:

Następnie klikamy Next > do momentu aż pojawi się okienko z ustawieniami JSF. Klikamy na Download library.
Po krótkiej chwili pojawi się okienko z dostępnymi bibliotekami do JSF. Wybieramy JSF 1.2 (Apache MyFaces) i klikamy Next >.
Akceptujemy licencję i klikamy Finish.

Dodajemy do URL Mapping Patterns: *.jsf.

Jeśli wszystkie kroki wykonaliśmy prawidłowo wszystko powinno wyglądać tak:


Właśnie stworzyliśmy strukturę projektu. Jak pewnie już zauważyliście jest to normalny Web Projekt z katalogiem Web Content w którym znajduje się katalog WEB-INF z plikiem web.xml. Jest jednak mała różnica, w katalogu WEB-INF znajduje się plik o nazwie faces-config.xml. Jest to plik gdzie znajduje się cała konfiguracja odnośnie JSF. Na razie plik ten jest pusty. 
Zaczniemy od stworzenia prostej klasy zarządzającej treścią strony, tzw. bean, warto zwrócić tutaj uwagę że klasa powinna być napisana zgodnie z prostymi zasadami nazewniczymi dla metod zwracających (getNazwaZmiennej) i ustawiających (setNazwaZmiennej) . W katalogu src tworzymy pakiet com.blogspot.mkorwel.jsf a w nim klasę MyBean. Klasa będzie posiadać funkcję która zwróci nam napis "Hello World !!!".

package com.blogspot.mkorwel.jsf;


/**
 * 
 * @author mkorwel
 * 
 */
public class MyBean {


  private String hello = "Hello World !!!";


  public String getHello() {


   return this.hello;
  }

}

Żeby klasę MyBean móc wykorzystywać w JSF musimy dodać ją w faces-config.xml. Otwiera plik XML na zakładce ManagedBean,


zaznaczamy w lewym okienku session i klikamy Add.


Klikamy przycisk Browse... i wybieramy klasę com.blogspot.mkorwel.jsf.MyBean.


W tym momencie możemy już kliknąć Finish. Zapisujemy wprowadzone zmiany i zabieramy się do stworzenia podstawowego widoku, który wyświetli nam napis "Hello World !!!" z klasy MyBean.
W katalogu WebContent tworzymy hello.jsp w którym wyświetlimy napis. Plik u mnie wygląda tak:
<%@ taglib prefix="f"  uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h"  uri="http://java.sun.com/jsf/html"%>
<html>
<head>
<title>JSF Tutorial</title>
</head>
<body>
<f:view>
<h:outputText value="#{myBean.hello}"></h:outputText>
</f:view>
</body>
</html>
W pierwszych dwóch linkach naszej strony definiujemy dwa zbiory znaczników.
Wszystkie znaczniki technologii JSF znajdują się pomiędzy znacznikiem <f:view>.
Znacznik <h:outputText value="#{myBean.hello}"></h:outputText> wyświetla tekst na ekranie, w atrybucie value precyzujemy skąd ma być wzięta treść. W naszym przypadku będzie to klasa która w pliku faces-config.xml nazywa się myBean (czyli klasa com.blogspot.mkorwel.jsf). Po kropce definiujemy metode typu get która ma się wykonać, w naszym przypadku będzie to metoda getHello(), która zwróci "Hello World !!!".

W tym momencie cała aplikacja jest gotowa, wiec możemy ją zdeployować na serwerze. Stronę możemy obejrzeć pod adresem http://localhost:8080/JSFHelloWorld/faces/hello.jsp , http://127.0.0.1:8080/JSFHelloWorld/faces/hello.jsphttp://localhost:8080/JSFHelloWorld/hello.jsf, lub http://127.0.0.1:8080/JSFHelloWorld/hello.jsf.

Brak komentarzy:

Prześlij komentarz