Java Server Faces (JSF) ile Primefaces kullanımı (İlk Kurulum anlatım)

Merhaba

JSF ile Merhaba Dünya uygulamasını yapmıştım. Buradan inceleyebilirsiniz ve kaynak kodları indirebilirsiniz.

Oluşturduğum Hello JSF projesi üstüne Primefaces araç kütüphanesini eklemeyi anlatacağım.

Hello JSF projesini import edelim veya aynı adımlarla yeniden oluşturalım.

POM XML içine

Primefaces repo(Kütüphane adresi)

<repository>
  <id>prime-repo</id>
  <name>Prime Repo</name>
  <url>http://repository.primefaces.org</url>
</repository>

Primefaces kütüphanesini

<!-- Primefaces -->
 <dependency>
	<groupId>org.primefaces</groupId>
	<artifactId>primefaces</artifactId>
	<version>6.0</version>
</dependency>

Primefaces tema kütüphanesini ekleyelim.

<!-- PrimeFaces Theme -->
<dependency>
	<groupId>org.primefaces.themes</groupId>
	<artifactId>all-themes</artifactId>
	<version>1.0.10</version>
</dependency>

POM XMLin son hali

<project xmlns="http://maven.apache.org/POM/4.0.0" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<groupId>com.atakancoban</groupId>
	<artifactId>hellojsf</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<packaging>war</packaging>
	<name>Hello JSF</name>



	<!-- PrimeFaces Repository -->
	<repositories>
		<repository>
			<id>prime-repo</id>
			<name>Prime Repo</name>
			<url>http://repository.primefaces.org</url>
		</repository>
	</repositories>






	<!-- JSF Dependency -->
	<dependencies>
		<dependency>
			<groupId>com.sun.faces</groupId>
			<artifactId>jsf-api</artifactId>
			<version>2.2.14</version>
		</dependency>
		<dependency>
			<groupId>com.sun.faces</groupId>
			<artifactId>jsf-impl</artifactId>
			<version>2.2.14</version>
		</dependency>
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>javax.servlet-api</artifactId>
			<version>3.1.0</version>
		</dependency>


		<!-- Primefaces -->
		<dependency>
			<groupId>org.primefaces</groupId>
			<artifactId>primefaces</artifactId>
			<version>6.0</version>
		</dependency>

		<!-- PrimeFaces Theme -->
		<dependency>
			<groupId>org.primefaces.themes</groupId>
			<artifactId>all-themes</artifactId>
			<version>1.0.10</version>
		</dependency>



	</dependencies>

	<!-- Build Maven WAR -->
	<build>

		<plugins>
			<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-compiler-plugin</artifactId>
				<version>3.6.2</version>
				<configuration>
					<!-- Java version -->
					<source>1.8</source>
					<target>1.8</target>
				</configuration>
			</plugin>
		</plugins>

	</build>




</project>

Pom xml dosyamızı güncelledikten sonra (HELLO JSF anlatımında gösterdiğim gibi)

Maven Update

Maven Clean

Maven İnstall

işlemlerini yapalım ve jar dosyalarını projemize çekelim.

WEB XML içine hangi temayı kullanacağımızı belirtelim.Ücretsiz veya ücretli primefaces temalarını bu adresten görebilirsiniz.Primefaces Themes

Ben Ücretsiz temalardan glass-x temasını ayarlamayı örnek gösterdim.

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xmlns="http://xmlns.jcp.org/xml/ns/javaee" 
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
 version="3.1">
	<display-name>hellojsf</display-name>
	<welcome-file-list>
		<welcome-file>index.xhtml</welcome-file>
	</welcome-file-list>

	<!-- Primefaces Select Theme -->
	<context-param>
		<param-name>primefaces.THEME</param-name>
		<param-value>glass-x</param-value>
	</context-param>


	<context-param>
		<param-name>javax.faces.DEFAULT_SUFFIX</param-name>
		<param-value>.xhtml</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>*.xhtml</url-pattern>
	</servlet-mapping>



</web-app>

Web xmlde temamızı da belirttikten sonra XHTML dosyamızda  primefaces araçlarını bu sayfada kullanacağımızı belirtelim. xmlns:p=”http://primefaces.org/ui”

<!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"
 xmlns:ui="http://java.sun.com/jsf/facelets" 
 xmlns:f="http://java.sun.com/jsf/core" 
 xmlns:h="http://java.sun.com/jsf/html" 
 xmlns:p="http://primefaces.org/ui">

<h:head></h:head>
<body>
	<h:inputText value="#{helloBean.message}" />
	<p:commandButton value="#{helloBean.message}"></p:commandButton>
	<p:inputText value="#{helloBean.message}" />
</body>
</html>

Son olarak RUN!

Primefaces araçlarını kullanmaya hazır. Projeyi github hesabımdan indirebilirsiniz.