Skip to main content

Getting started with Prime faces 2

Prime faces is an amazing JSF framework from Cagatay Civici (http://cagataycivici.wordpress.com/). Its wonderful because it is easy to use, minimal dependencies, has probably the widest set of controls among all JSF frameworks, easy to integrate with Spring (including Spring Security) , Java EE EJBs, and last but not the least mobile UI support. So I decided to give Prime faces a try, before selecting it to use in my projects.

Step 1 – Create Maven 2 project

As a first step to integrating Prime faces, create a Maven 2 project in Eclipse. You will need to select ‘maven-archetype-webapp’.

Step 2 – Add repositories and dependencies in pom.xml

I will be using Prime faces 2 with JSF 2 on Tomcat 6. Since the dependencies for Prime Faces and JSF 2 (JSF 2.0.3 is required) are available on different repositories, I will add them to my pom file first. The listing below shows my pom.xml

<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/maven-v4_0_0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<groupId>net.breezeware</groupId>
	<artifactId>hermesconsole</artifactId>
	<packaging>war</packaging>
	<version>0.0.1-SNAPSHOT</version>
	<name>hermesconsole Maven Webapp</name>
	<url>http://maven.apache.org</url>
	<dependencies>
		<dependency>
			<groupId>junit</groupId>
			<artifactId>junit</artifactId>
			<version>4.8.1</version>
			<scope>test</scope>
		</dependency>
		<dependency>
			<groupId>org.primefaces</groupId>
			<artifactId>primefaces</artifactId>
			<version>2.2.M1</version>
		</dependency>
		<dependency>
			<groupId>com.sun.faces</groupId>
			<artifactId>jsf-api</artifactId>
			<version>2.0.3</version>
		</dependency>
		<dependency>
			<groupId>com.sun.faces</groupId>
			<artifactId>jsf-impl</artifactId>
			<version>2.0.3</version>
		</dependency>
	</dependencies>


	<repositories>
		<repository>
			<id>prime-repo</id>
			<name>Prime Technology Maven Repository</name>
			<url>http://repository.prime.com.tr/</url>
		</repository>
		<repository>
			<id>maven2-repository.dev.java.net</id>
			<name>Java.net Repository for Maven</name>
			<url>http://download.java.net/maven/2/</url>
		</repository>
		
	</repositories>


	<build>
		<finalName>hermesconsole</finalName>
	</build>
</project>



Step 3 – Change web.xml


Add the JSF faces servlet in the web.xml file.

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
	xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" >
	
   	
    <context-param>
        <param-name>primefaces.skin</param-name>
        <param-value>none</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>*.jsf</url-pattern>
    </servlet-mapping>
	
    
</web-app>



Step 4 – Add a simple xhtml file – home.xhtml


Now let us see Prime faces in action, by adding a simple JSF snippet with 1 control from this library. 

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui">

<f:view contentType="text/html">

	<h:head>
		<title>Hermes Console - Trying PrimeFaces</title>
		
	
		
	</h:head>
	
	<h:body>
		<h:form>
			<p:commandButton value="Ajax Submit" />
		</h:form>
		
		
		
	</h:body>
	


</f:view>
</html>

Step 5 – Build and deloy


Now that we are done, the next step is to build and create the war file and deploy it in Tomcat 6. Then point your browser to - http://localhost:8080/hermesconsole/home.jsf


You will see the following command button on your browser:


Blog - 1

Labels:

Comments

  1. Yichun ZhaoDecember 17, 2010 at 11:52 AM

    I am using the setup as you, JSF2.0 + Tomcat 6.0.18, but the funny thing is, I just create a test web app with using Component "spinner", on the webpage,
    However, the two Arrow buttons they are not displayed. Why?
    Server logs has shown no any error/warning message.

    could you please contact with me on email
    zhaoyichun@hotmail.com thanks.

    ReplyDelete
  2. AnonymousDecember 23, 2012 at 5:58 AM

    java.lang.ClassNotFoundException: javax.faces.webapp.FacesServlet

    ReplyDelete

Post a Comment

Popular posts from this blog

CKEDITOR 3.x - Simplest Ajax Submit Plugin

  I have assumed that you have downloaded and got started with CKEDITOR. Step 1 – The html file is shown below: <html> <head> <title>Writer</title> <meta content="text/html; charset=utf-8" http-equiv="content-type" /> <script type="text/javascript" src="ckeditor/ckeditor.js"></script> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <style> .cke_contents { height: 400px !important; } </style> </head> <body> <form action="sample_posteddata.php" method="post"> <textarea id="editor" > </textarea> <script type="text/javascript"> //<![CDATA[ CKEDITOR.replace( 'editor', { fullPage : true, uiColor : '#9AB8F3', toolbar : 'MyToolbar' }); //]]> </script> </form> </body> </html> Note that the jquery js...
3 comments
Read more

Part 3 - Integrating Tiles, Thymeleaf and Spring MVC 3

In this post I will demonstrate how to integrate Apache Tiles with Thymeleaf. This is very simple. The first step is to include the tiles and thymeleaf-tiles extension dependencies. I will include them in the pom.xml. Note we wil lbe using Tiles 2.2.2 Listing 1 - parent/pom.xml --- thymeleaf-tiles and tiles dependencies <!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ --> <!-- Tiles --> <!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ --> <dependency> <groupId>org.apache.tiles</groupId> <artifactId>tiles-core</artifactId> <version>${tiles.version}</version> <scope>compile</scope> </dependency> <dependency> <groupId>org.apache.tiles</groupId> <artifactId>tiles-template</artifactId> <version>${tiles.version}</version> <scope>compile</s...
5 comments
Read more

How to implement Cache Aside Pattern with Spring?

Problem You want to boost application performance by loading data from a cache and prevent the network trip to the persistent store (and also the query execution). This can be achieved by loading data from a cache. However, you want to load data on demand or lazily. Also, you want the application to control the cache data management – loading, eviction, and retrieval. Forces Improve performance by loading data from cache lazily. Application code controls cache data management. The underlying caching system does not provide read-through, write-through/write-behind strategies (strange really ??). Solution Use cache aside design pattern to solve the problems outlined above. This is also one of many caching patterns/strategies. I believe it is named in this because aside from managing the data store, application code is responsible for managing the cache also. Let's now try to understand how this caching technique works and then explore how it solves the proble...
Post a Comment
Read more