Tutorial Webentwicklung (mit JSF) II

Die erste Webapplikation

Im Folgenden wird eine rudimentäre Webapplikation erstellt – und zwar nur soweit, wie sie als Grundgerüst von Netbeans generiert wird. Weitere Funktionalität wird noch nicht zugefügt. Und doch liefert dieser Einstieg wichtige Grundlagen.

Sie können das Beispiel wahlweise an Ihrem Rechner nachvollziehen – oder aber einfach den Screenshots folgen, abhängig von Ihrer persönlichen Vorliebe zum Erlernen neuer Technologien.

Nach dem Start von NetBeans wählen ein neues Projekt (Tastenkombination {Strg}+{Umschalt}+{N}). Es erscheint der folgende Dialog, in dem Sie “Java Web” und daraus “Web Application” wählen. Der Dialog kann bei Ihnen eventuell etwas anders aussehen, je nachdem, welche (Sprach-) Version von NetBeans und welches Betriebssystem Sie nutzen.

Betätigen Sie die Schaltfläche [Next]. Im folgenden Dialog wählen Sie einen passenden Projektnamen, hier “JSFTutorial”. Soweit Sie Ihre Projekte in einem anderen Verzeichnis als dem vorgeschlagenen Standard ablegen möchten, passen Sie noch das Projektverzeichnis (Project Location) an. Weiter geht es wieder mit [Next].

Soweit Sie NetBeans ab Version 6.9 in der Standard-Konfiguration nutzen, sollte bei Ihnen im folgenden Dialog der GlassFish Sever 3.0 oder jünger voreingestellt sein. Sofern Sie noch eine ältere Version nutzen, ist jetzt der ideale Zeitpunkt für ein Update gekommen. Für die Beispiele in diesem Buch wird die Java Enterprise Edition in der Version 6 genutzt.

 

Wie Sie erkennen können, bietet Ihnen der Dialog die Möglichkeit, Context und Dependency Injection (CDI) nutzen zu können. Damit versetzen Sie den Application Server in die Lage, Objekte in Ihre Applikation zu “injizieren”. Mittels einer einfachen Annotation weisen Sie so den Server an, Ihnen innerhalb einer sogenannten Bean Referenzen auf bestimmte Objekte zur Verfügung zu stellen. Die Lebensdauer einer solchen Bean können Sie festlegen, sei es, dass sie für eine Anfrage, eine Sitzung oder sonstiges gilt. Auch mit JSF können Sie die Lebensdauer einer Bean festlegen. Leider verhalten sich CDI und JSF hier leicht unterschiedlich, so dass wir dieses starke Feature vorerst nicht nutzen.

Mittels Context Path geben Sie an, unter welchem Pfad die Applikation angesprochen wird. Dieser ist mit dem Projektnamen vorbelegt und Sie können dies so belassen. Bei Bedarf lässt sich der Pfad zu einem späteren Zeitpunkt auch wieder ändern.

Wie gewohnt geht es weiter mit [Next].

In diesem Dialog wählen Sie die JavaServerFaces als Framework. Darunter erscheint ein Tabulator-Element zur Konfiguration. Ein JEE6 kompatibler Server wie GlassFish verfügt bereits über die passenden Bibliotheken und so können Sie diese Vorreinstellung belassen. Bei Nutzung eines anderen Servers, z. B. Apache Tomcat, müssen Sie ggf. Die JSF-Bibliotheken mit bereitstellen. In einem solchen Fall wählen Sie “Registered Libraries”. Bevor Sie den Dialog abschließen, wählen Sie noch den Reiter “Configuration” und ändern das URL Pattern auf “*.xhtml”. NetBeans schlägt hier standardmäßig “/faces/*” vor. Dies führt dazu, dass der Pfad im Browser scheinbar um ein Verzeichnis länger wird. Der Funktionalität tut dies keinen Abbruch. Hier müssen Sie selber entscheiden.

Die bevorzugte Seitensprache ist mit “Facelets” vorbelegt. Alternativ ist auch “JSP” (Java Server Pages) möglich. In beiden Fällen werden bestimmte Namensräume bzw. Bibliotheken (Tag Libraries) eingebunden, die es Ihnen ermöglichen, spezielle Anweisungen in der HTML-Seite unterzubringen, die serverseitig vor Auslieferung an den Browser abgearbeitet werden. JSP existieren schon länger und waren bis JSF 1.2 die Standard-Seitensprache. Sie haben jedoch einen etwas anderen Lebenszyklus als JSF. Facelets wurden dagegen speziell für JSF entwickelt und sind seit JSF 2 Teil der Spezifikation und bevorzugte Seitensprache.

Nun ist genug gewählt und Sie beenden den Dialog mittels [Finish].

Daraufhin generiert NetBeans ein vollständig lauffähiges Projekt und öffnet die Seite Index.xhtml im Sourcecode-Editor.

Wie an der Deklaration zu erkennen, handelt sich dabei um eine XHTML-Seite. Im öffnenden HTML-Tag ist entsprechend der Namensraum für xhtml angegeben und zusätzlich der Namensraum für jsf/html. Dieser erhält traditionell das Präfix “h”. Eine erste Nutzung erkennen Sie in den Tags für head und body. Hier ist dieses Präfix vorangestellt. Vor Auslieferung der Seite wird dies verarbeitet – und dabei werden diese Tags einfach durch die Standard-HTML-Tags ersetzt. Insofern passiert hier nichts Aufregendes.

Auf der linken Seite erkennen Sie im Projekt-Tree, dass NetBeans Ihnen neben dieser Seite auch einige Konfigurationsdateien, die weiter unten beschrieben werden, generiert hat. Des Weiteren wurden die benötigten Bibliotheken in das Projekt eingebunden. Kurz, es ist alles vorhanden, um das Projekt starten zu können. Dies geschieht mittels {F6}.

Der erste Start dauert etwas länger. NetBeans startet GlassFish, stellt die Applikation bereit und startet diese. Das Bereitstellen der Applikation wird als “Deploy” bezeichnet. Dies alles erledigt NetBeans für Sie. In einer produktiven Umgebung werden Sie jedoch nicht den lokalen Server nutzen – und den Server schon gar nicht jeweils neu starten. Hier müssen Sie vielmehr manuell deployen oder scripten – wie dies vonstatten geht, erfahren Sie in einem späteren Teil des Tutorials.

Nachdem der Server gestartet wurde, ruft NetBeans den Browser auf. Das Ergebnis ist rech unspektakulär: Hello from Facelets.

Ein Blick auf die URL zeigt, dass hier eine Anfrage an den lokalen Server gestellt wurde, und zwar im Verzeichnis JSFTutorial. Erinnern Sie sich? Dies ist genau der Context Path, den Sie im Assistenten angegeben haben, bzw. der aus dem Projektnamen übernommen wurde.

Ein Blick auf den Sourcecode der Seite (bei Firefox mittels {Ctrl}{u} erreichbar), zeigt normales XHTML:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Facelet Title</title>
    </head>
    <body>
      Hello from Facelets
    </body>
</html>

Vergleichen Sie dies mit dem Sourcecode, so fällt auf, dass die Angabe des JSF-HTML Namespaces verschwunden sind, ebenso wie die “h:” Präfixe. Hier hat also bereits der Server im Hintergrund gewerkelt: Die spezifischen Tags wurden analysiert und ersetzt. Im vorliegenden Fall nur durch einfachen HTML Code. In späteren Projekten auch dynamisch durch die Ausgabe der Applikationen. Es wird also spannend.

An diesere Stelle sollte sich eigentlich eine Erläuterung dessen anschließen, was denn da serverseitig so alles passiert. Doch vor einem solch “trockenem” Thema gibt es im nächsten Abschnitt erst einmal eine kleine interaktive Applikation. Sie haben doch sicherlich auch erst einmal erlebt, wie ein Auto fährt, bevor Sie selbst zur Fahrschule gingen, oder?

Web Development with Java and JSF

A Journey through Java EE Technologies whilst developing Web Applications with JavaServer Faces.

Get your copy of my book here

This entry was posted in Programmierung, Tutorial, Webentwicklung and tagged , , , , , , . Bookmark the permalink.

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>