Java EE Tutorial - Create Distributed App with Maven, JSF

DISTRIBUTED PROGRAMMING (DIP417B) TOTURIAL 1
This tutorial guide is intended to help you get started with the development of Java EE applications.
Please follow the steps outlined in the guide to create your first application.
Step 1: Create a maven project as shown in the screens below. Please make sure the name of the
project is as shown in the screen.
Step 2: create a sub maven project called common. This project will contain your common services.
Step 3: Create a Data Transfer Object (DTO) called PersonDTO as shown in the screens below. This
object will be used to transfer data from the presentation layer to business processing layer and vice
versa.
Step 4: Add the common project as a dependency to both pmsystem-service and pmsystem-web
projects following the 2 screen shots below. The file to which this common project should be added
dependency is called pom.xml, this file is found in each of these 2 projects:
Step 5: Now go to the pmsystem-service project and delete the auto created session bean as shown
in the screen below.
Step 6: Create a session bean interface called PersonServiceLocal in pmsystem-service project.

Please ensure that the package name is as shown in the screen below which is za.ac.tut
Step 7: Create a Stateless session bean service called PersonService in pmsystem-service project.
Please ensure that the package name is as shown in the screen below which is za.ac.tut
Step 8: Now go to pmsystem-web project and add dependencies needed for our front-end
development. These dependencies are prime faces and bootsfaces frameworks. We will use this 2
frameworks to build our user interface. Follow the screens below to add the above mentioned
dependencies.
Step 9 : Now build your project using maven build management tool as shown in the screen below.
Make sure you computer is connected to the internet before running the build. This is because
maven will first search for the newly added dependencies locally and if these dependencies are not
found in your local repository, maven will download them from the internet. Please note whenever
you want to run the build, right click on the parent project which is pmsystem and select (clean and
build) option.
Step 10: The successful build output screen will look like the screen below.
Step 11: Download the template and resources folders and persons.xhtml file from
https://mytutor.tut.ac.za/ and place them in the pmsystem-web project in the folder called Web
Pages as shown in the screen below. The purpose of these 2 folders and a file will explained in our
next class.
Step 12 : Add pmsystem-service project as the dependency into pmsystem-web as shown in the
screen below.
Step 13: Download faces-config.xml from https://mytutor.tut.ac.za/and place in the WEB-INF folder
as shown below.
Step 14: Download web.xml from https://mytutor.tut.ac.za/

Step 14: Create Java Server Page (JSF) managed bean called PersonManagedBean.
Step 15: The screen below shows the view page. persons.xhtml is a jsf page through the end-user
will user to interact with our system. This page consists of 2 panels. The first panel is used to display
data on the table. Prime faces datatable component was used to wire up the personal details. The
person instance was accessed through the managed bean instance called personManagedBean. The
second panel is used to create form for capturing personal details.
To create the form we need combination of prime faces, bootsfaces and the managed bean. Every
tag element which starts with <p: comes from prime faces framework and every tag element which
starts with <b: comes from the bootsfaces framework. The integration of these to framework offers
us a great look and feel. To access the properties of the personDTO to which captured data must be
set, we use personManagedBean.personDTO as shown in the persons.xhtml that was downloaded
from mytutor.
Step 16: Congratulations, you have just created your first Java EE application. To test our
application, we should create a build that will be deployed into the application server or container as
shown in the screen below. The container to be used in this course is Jboss WildFly 10. This
application server, maven and activeMQ should be downloaded by every student from mytutor as
indicated in the Development Software and Tools announcement email. When you create the build,
you should run the parent project called pmsystem. pmsystem is the parent project, common,
pmsystem-app, pmsystem-serivce and pmsystem-web are sub projects.
Step 17: Once your build has run successfully, use file explorer to go to your project folder. In my
case the project folder was : D:\work\2021\tut. Browser your project looking for the folder called
target in pmsystem-web sub project. The target folder get created each time the build is run and
that is where your artefact or .war or .ear or .jar files gets created. In our case, the artefact we are
looking for is pmsytem-web-1.0-SNAPSHOT.war . Copy this pmsytem-web-1.0-SNAPSHOT.war and
paste in the following directory of your WildFly installation:
D:\dev\wildfly-10.0.0.Final\standalone\deployments (Please note that is my directory path which

might be different from yours unless you have installed WildFly in the directory same as mine)
Step 18: Start your application server to deploy your application. The start the application server, go
to the bin folder through the command line as shown below and run the following command:
Step 19: If your deployment is successful, your command line prompt will look like the following
screen, if not go back to step one to check where mistakes were committed and fix them:
Step 20: Once your application has been successfully deployed, run the following url to view your
first Java EE application.
http://localhost:8080/pmsytem-web-1.0-SNAPSHOT
Step 21: Click the Add button to open personal details form and capture your details
Step 22: Click save button to save your details. Please note that since we have covered the database
part in the class, the data being captured is saved in the List.
Step 23: Immediately after clicking the save button, the record you just added will appear in the
display table as shown in the screen below with update and delete option. This implies you can
delete or update the record you have just added.
Step 24: Congratulations, you rock, you have just successfully created and deployed your Java EE
application on the Jboss runtime container.

Java EE Tutorial - Create Distributed App with Maven, JSF

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Java EE Tutorial - Create Distributed App with Maven, JSF

Uploaded by

Copyright:

Available Formats

DISTRIBUTED PROGRAMMING (DIP417B) TOTURIAL 1

Step 6: Create a session bean interface called PersonServiceLocal in pmsystem-service project.

Step 14: Download web.xml from https://mytutor.tut.ac.za/

D:\dev\wildfly-10.0.0.Final\standalone\deployments (Please note that is my directory path which

You might also like