Tag Archives: jsf

Fundamentals – ICEFaces with JPA


Its been a while since I put up some stuffs in here, yet not to fear since I’ve just been drafting my writings. For this post, I’ll be going through my first hands- on experience in using ICEFaces Web Framework. You can view ICEFaces very details description here: Click Me.

For my hands-on experience, I tried putting up a simple Inventory Input Form like this:

The business case here is that the user must have the ability to create inventory items, the user must be able to automatically see the data in the table below after creating a new item.

Inserting a new Data using: Ice:Popup

A pre-defined (or in technical term, intrinsic function) libraries are included with the Framework. Its basically a new Web Framework that completely uses the Web 2.0 concepts as well as Ajax technologies to refine and define the user experience.

The popup dialog below is actually just a tag library call from the page itself. Pre-defined validation occurs (see those * there). After saving the entry, the dialog closes and the table underneath will automatically re-rendered to show the newly added entry.

Delete and Edit:

An entry will have buttons that will let user delete or edit data. The Edit button will re-use the popup dialog and pass the values to it.

After editing:

Note that no loading happened in this scenarios, all of which are Ajax driven and no Javascript was coded for this. It really showcased the power of JSF technologies for REAs Development.

Technologies Used:

  1. Apache Tomcat 7 – I’m using Tomcat 7 as it supports the latest JEE6 Reference Implementation libraries required to run the application.
  2. MySQL Database – The Enterprise Ready Toy Database
  3. Eclipse EE with IceFaces Installed – JPA Libraries are pre-installed in JEE Eclipse.

The ICEFaces Framework – showcased a lot of useful libraries for user interface. JSF really made its promise by minimizing the Javascript needed for development and for this case, I didn’t have to write any. Heres a link to the ICEFaces Library Showcase site: Click Me

To save you from trying to create this basic stuff, heres the link to the WAR file I created (includes the SQL File as well) along with the necessary libraries to run the application: POSv1.war

Just put it in your Apache Tomcat 7 webapps folder, create the database with a user: root / <no password> and your good to go!

Java EE 6 – Observer Pattern


The Observer Pattern has been one of the most widely used design pattern in Software Development. If not most, many use the pattern for their development to call different independent modules to do processes after the initial action from another module. Certain scenarios like, a display table was updated after an insert call, a window resize after a clicked of a button.

JEE6 introduced a more easy way of using the observer pattern.

Assuming that you have a ManagedBean, with a register transaction method.

Observe this:

  1. Event<?> will be the one responsible for storing entity or object to be observed.
  2. A fire method is called passing the entity. (memberEventSrc.fire(newMember));

Once the fire event method is called, it will search for all ManagedBean observing this entity.

Observer this:

  1. @Observe annotation is used for the final Member class in the method, this is our flag for the method call
  2. This is located on the ManagedBean – We need a POJO that is class loaded for this process.

The MessageProducerList class is also a ManagedBean that is called after a transaction is made. The fire event from the MemberRegistration ManagedBean will call the method (on the screenshot) to load all the members. These list of members is then loaded to the JSF Page.

Download Source Code
Note: You need Eclipse EE with JBoss Tools installed.

Enjoy! :)

ICEFaces – Self Serve Training


Interested in learning ICEFaces Technology? Here’s a free video introduction.

http://www.icefaces.org/main/training/selfserve.iface?mkt_tok=3RkMMJWWfF9wsRonvqjMZKXonjHpfsX%2B4uklW6%2Bg38431UFwdcjKPmjr1YUDTtQhcOuuEwcWGog8yQ9dCe%2BTaA%3D%3D

ICEfaces is more than a Ajax JSF component library, it’s an J2EE Ajax framework for developing and deploying rich enterprise applications (REAs). With ICEfaces, enterprise Java developers can easily develop rich enterprise applications in Java, not JavaScript.

Oracle JDeveloper 11g – First Hand on EJB/JPA Development


I find EJB/JPA Development in Oracle JDeveloper too good to be true! :) Seriously. I tried developing a new Java EE Application using JDeveloper:

The wizard created 2 components in the project. A ViewController package and a Model Package.

ViewController Package – Is where all JSF/JSP and Servlets go, basically the view and controller sources. Model – Business Components such as EJBs and JPA entities are placed in this package.

Lets try creating an end to end Person Registration! :)

1st Step: Design the Model.

Go to New  > Offline Database

Start by creating a dummy database – developers can create an offline database (oracle database emulator) that will run with your application.

Then lets create a table on that offline database we just created.

Click on OK. After creating the table, new database components will be created on the project setup.

What we did with the first step is just to create a database and a table to store our Person Registration.

2nd Step: Create Model Diagram (EJB/JPA Diagram) and Components

After creating the database and table, we now need to create the components that will interact with the database from our application.

Create EJB/JPA Diagram: Developers usually skip the part of creating a diagram first – I would say that this process is one of the most under-rated process for any developer regardless of the platform  (I sometimes wonder how one can develop without even doing some drawing to visualize the flow of their application logic).

After hitting “OK”, a blank diagramming canvass will be displayed. Note: This canvass I believe is one of the most powerful feature of Oracle JDeveloper! – Keep reading.

Next, drag the PERSON table on the canvass. This will create a new Entity Bean (JPA entity bean), create a new Persistence unit and a persistence XML for its definition.

Note: I move the generated entity class to a new package (this is one of the features I actually don’t like about all this automation stuff).

Create a simple Stateless Session Bean. Drag a new Session Bean from the EJB Component Palette on the right side to the canvass.

This will open up a wizard to create the new Session Bean.

Methods will be automatically generated. These generated methods will perform basic querying, insertion, delete and update.

Put the Session Bean on the beans package.

Remote and Local Interface (Both interface will be placed on the beansiface package).

Session Beans are now created. :)

We just created our Model Layer. We can now use the Session Beans to do Database Transaction from our Controller.

3rd Step: Develop the Page and ManagedBean

Open the faces-config.xml – We will create 2 JSP that will handle user input and a success page.

After creating creating the Page Flow, we now create the actual page. Right click on the diagram page component to create page.

Pages can be created from a template or a blank page. I will discuss Page template development in another post. :)

Create a ManagedBean – this is the controller class where in we put form fields and actual call to the business logic. From the faces-config.xml, right click on the canvas to create the managedbean. This will create a new ManageBean entry on the xml file.

After the ManagedBean is created, put the fields First Name and Last Name (Generate or create Accessors) in it. Put also the logic to insert the new Person data.

Create a Registration Form. Open the registerperson page to create the form and map the fields to its corresponding ManagedBean mapping.

Success Page:

4th Step: Test the Person Registration

Right Click on the Register Person Page.

Test the Person Registration:

As I’m trying this stuff, it took me a while to get a hang of getting my source running. The first thing I did was not to rely on automation scripts to really experience how to assemble each piece of components together. Yet as I go along some roadblocks and issues, I would really say that if I’ll be using this IDE for J2EE Development, I would rather build it using the automation tools available.

The Diagram tool is amazing, drag and drop your components and your off and running.

Offline database is cool. You don’t have to mind how much memory would it consume your terminal just to try a EJB/JPA, you can just use the offline database (which is basically just a file) and your good to go.

JSF Flow Diagram is great. I’ve use the faces-config diagram and its like mapping the flow of your pages. All drag and drop components are available, page and beans generate are also available.

One thing I didn’t like at all is the package management, it seems that if you have a convention of creating sub-packages, you’ll likely to be irritated by that fact that it can’t create sub-package for itself. You’ll have to create one sub-package after the other.

Overall, I’m impress how Oracle manage to put a lot of automation in the IDE. The Diagramming canvass is perfect for modelling (EJB and JPA generated), the offline database is too good to be true for development trials and the JSF Diagram canvass from faces-config and bean generators really did put the ease on developing view components.

Download the project here