Cloud-Lösungen der Zukunft - Testen!

Revolutionäre Cloud-Technologie, ganz ohne versteckte Kosten. Profitieren Sie von unserer Testphase und entdecken Sie umfassende Funktionen. Der Anmeldeprozess ist transparent und unkompliziert. Starten Sie jetzt Ihre Reise in die Cloud - Kostenfrei!

Mit E-Mail anmeldenMit Google anmeldenMit GitHub anmelden
Mit E-Mail anmeldenMit Google anmeldenMit GitHub anmelden

Kategorien

Apache

Databases

Docker

JavaScript

Kubernetes

Linux Basis

MySQL

Python

React

Security

Ubuntu

JSF Tutorial für Anfänger

Willkommen beim JSF Tutorial für Anfänger. Java Server Faces (JSF) ist ein Frontend-Framework, das die Erstellung von Benutzeroberflächenkomponenten durch Wiederverwendung von UI-Komponenten erleichtert. JSF basiert auf dem Model View Controller (MVC)-Muster, das Präsentation, Steuerung und Geschäftslogik voneinander trennt.

Im MVC-Muster enthält das Modell die Geschäftslogik, die für die Umsetzung des Geschäftsszenarios erforderlich ist, die Ansicht repräsentiert die Präsentationsebene wie JSP- oder JSF-Seiten und der Controller steuert die Übermittlung der Kontrolle an das Modell/die Ansicht je nach der angeforderten Operation. JSF bietet die folgenden Komponenten, um eine Benutzeroberfläche zu erstellen:

  • Standard-Basiseingabeelemente wie Felder, Buttons usw., die den Satz der Basis-UI-Komponenten bilden.
  • Rendering-Fähigkeit von JSF abhängig von den Anforderungen des Clients
  • Kernbibliothek
  • Erweiterung verfügbarer UI-Komponenten, um zusätzliche Komponenten hinzuzufügen und sie zur Erfüllung von Kundenanforderungen zu nutzen.

JSF Tutorial für Anfänger – Einrichtung der Umgebung

Hier gehen wir alle notwendigen Schritte durch, um Ihren Computer für die Erstellung Ihrer ersten JSF-Anwendung vorzubereiten.

JDK-Installation

Laden Sie das JDK von der folgenden Oracle-Website herunter und setzen Sie die Umgebungsvariable JAVA_HOME auf den Binärpfad des installierten JDKs. Fügen Sie auch JAVA_HOME\bin zur PATH-Variable hinzu, um die Java-Binärdateien lokalisieren zu können. Überprüfen Sie nun, ob Java erfolgreich auf Ihrem Rechner installiert ist, indem Sie javac im Befehlsfenster eingeben, was alle verfügbaren Optionen anzeigen sollte, oder „java -version“, was die Version von Java anzeigen sollte, die auf Ihrem Rechner installiert ist.

IDE-Installation

Einige der beliebten verfügbaren IDEs umfassen Eclipse, NetBeans und IntelliJ IDEA. Laden Sie Eclipse von dem folgenden Link herunter und führen Sie die heruntergeladene Binärdatei aus, um Eclipse auf Ihrem Rechner zu installieren. Für NetBeans laden Sie die NetBeans IDE von herunter und schließen Sie die Installation ab.

Apache Tomcat-Installation

Laden Sie Tomcat von dem folgenden Link herunter. Führen Sie die heruntergeladene Binärdatei aus und setzen Sie die CATALINA_HOME-Variable auf den Installationspfad. Starten Sie jetzt den Server und gehen Sie in Ihrem bevorzugten Browser zu , was die Standard-Tomcat-Seite anzeigen sollte, wenn sie erfolgreich installiert wurde. Unsere Basiseinrichtung ist bereit, gehen wir zur Erstellung unserer ersten JSF-Anwendung über.

JSF Tutorial für Anfänger – Hallo-Welt-Anwendung

Lassen Sie uns nun eine einfache Hallo-Welt-JSF-Webanwendung erstellen. Laden Sie die folgenden Jars herunter, die notwendig sind, um JSF-bezogenen Code auszuführen. Diese können vom Maven-Zentralrepository heruntergeladen werden. Eine klarere Art, Abhängigkeiten zu verwalten, ist die Nutzung eines Build-Systems wie Maven. Für alle unsere Beispiele werden wir Maven verwenden. Bitte beziehen Sie sich für Abhängigkeiten auf die pom.xml.

Copy Code 


<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="https://maven.apache.org/POM/4.0.0" xmlns:xsi="https://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="https://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.journaldev.jsf</groupId>
    <artifactId>JSF_HelloWorld</artifactId>
    <version>1.0-SNAPSHOT</version>
    <packaging>war</packaging>

    <name>JSF_HelloWorld</name>

    <properties>
        <endorsed.dir>${project.build.directory}/endorsed</endorsed.dir>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    </properties>
    
    <dependencies>
        <dependency>
            <groupId>javax</groupId>
            <artifactId>javaee-web-api</artifactId>
            <version>7.0</version>
            <scope>provided</scope>
        </dependency>
        <dependency>
            <groupId>com.sun.faces</groupId>
            <artifactId>jsf-api</artifactId>
            <version>2.1.13</version>
        </dependency>
        <dependency>
            <groupId>com.sun.faces</groupId>
            <artifactId>jsf-impl</artifactId>
            <version>2.1.13</version>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>3.1</version>
                <configuration>
                    <source>1.7</source>
                    <target>1.7</target>
                    <compilerArguments>
                        <endorseddirs>${endorsed.dir}</endorseddirs>
                    </compilerArguments>
                </configuration>
            </plugin>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-war-plugin</artifactId>
                <version>2.3</version>
                <configuration>
                    <failOnMissingWebXml>false</failOnMissingWebXml>
                </configuration>
            </plugin>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-dependency-plugin</artifactId>
                <version>2.6</version>
                <executions>
                    <execution>
                        <phase>validate</phase>
                        <goals>
                            <goal>copy</goal>
                        </goals>
                        <configuration>
                            <outputDirectory>${endorsed.dir}</outputDirectory>
                            <silent>true</silent>
                            <artifactItems>
                                <artifactItem>
                                    <groupId>javax</groupId>
                                    <artifactId>javaee-endorsed-api</artifactId>
                                    <version>7.0</version>
                                    <type>jar</type>
                                </artifactItem>
                            </artifactItems>
                        </configuration>
                    </execution>
                </executions>
            </plugin>
        </plugins>
    </build>

</project>

JSF Tutorial für Anfänger – Erstellen eines Managed Bean

Ein Managed Bean ist eine Java-Klasse, die bei JSF registriert ist, was die Interaktion zwischen der Benutzeroberfläche und der Geschäftslogik ermöglicht. Erstellen Sie ein Managed Bean mit dem Namen HelloWorld.java unter Verwendung der Annotation @ManagedBean.

Copy Code 


package com.journaldev.jsf.helloworld;

import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean(name="helloWorld")
@SessionScoped
public class HelloWorld implements Serializable{
    
    private static final long serialVersionUID = -6913972022251814607L;
    
    private String s1 = "Hello World!!";

    public String getS1() {
        System.out.println(s1);
        return s1;
    }

    public void setS1(String s1) {
        this.s1 = s1;
    }
  
}

Die Annotation @ManagedBean zeigt an, dass die Klasse HelloWorld ein Managed Bean ist. Das @SessionScoped-Bean zeigt an, dass das Bean so lange lebt, wie die HttpSession gültig ist. Hier wird ein String s1 deklariert und mit „Hello World“ initialisiert und die Getter- und Setter-Methoden sind definiert, um den Wert des Strings s1 abzurufen. Man kann auch den Bean-Namen angeben, wie zum Beispiel @ManagedBean(name=“helloWorld“). Wenn kein Name angegeben ist, wird er gemäß den Java-Namenskonventionen abgeleitet. Es ist immer am besten, den Bean-Namen anzugeben.

JSF Tutorial für Anfänger – Ansichtsseite

Erstellen Sie nun eine JSF-Seite mit dem Namen helloWorld.xhtml, die mit dem HelloWorld-Bean interagiert und den Wert über die Getter-Methode abruft und denselben auf der Antwortseite ausgibt.

Copy Code 


<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml"
      xmlns:h="https://java.sun.com/jsf/html">
<h:head>
<title>Hello World JSF Example</title>
</h:head>
<h:body>
       #{helloWorld.s1}
<br /><br />

</h:body>
</html>

Hier rufen wir den Bean-Namen auf, gefolgt von der in der Bean deklarierten String-Variable „helloWorld.s1“, die den Wert „Hello World“ abruft.

Deployment Descriptor-Konfiguration

Der letzte Teil besteht darin, die JSF-Controller-Klasse zu konfigurieren, um die Client-Anfragen zu bearbeiten. Der JSF-Controller-Servlet ist FacesServlet, die endgültige web.xml-Konfiguration wird unten angegeben.

Copy Code 


<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.1" xmlns="https://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="https://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="https://xmlns.jcp.org/xml/ns/javaee https://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd">
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.jsf</url-pattern>
</servlet-mapping>
<session-config>
<session-timeout>
            30
</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>faces/helloWorld.xhtml</welcome-file>
</welcome-file-list>
</web-app>

In der web.xml spezifizieren wir den Eintrag der Faces-Konfigurationsdatei zusammen mit der Mapping-Servlet für Faces, Session-Timeout und die Willkommensdatei, die beim Start der Anwendung geladen wird. Sobald wir diese Änderungen vorgenommen haben, führen wir die Anwendung aus.

Das ist alles für das JSF Tutorial für Anfänger. Wir werden uns in den kommenden Beiträgen mit verschiedenen JSF-Seitenkomponenten beschäftigen.

Starten Sie Ihre Cloud-Reise mit unserer kostenlosen Trial-Version!

Entdecken Sie die grenzenlosen Möglichkeiten unserer Cloud-Dienste ganz unverbindlich. Melden Sie sich jetzt für unsere kostenlose Trial-Version an und erleben Sie, wie unsere innovativen Lösungen Ihr Business transformieren können.

Try for free!

You might be interested in:

https://www.centron.de/tutorial/verwendung-der-funktion-puts-in-c-c/

https://www.centron.de/en/tutorial/container-an-introduction/