[[Developing_JSF_Project_Using,_Maven_and_IntelliJ]]
= Developing JSF Project Using JBoss AS7, Maven and IntelliJ
ifdef::env-github[:imagesdir: ../images/]

JBoss AS7 is a very 'modern' application server that has very fast
startup speed. So it's an excellent container to test your JSF project.
In this article, I'd like to show you how to use AS7, maven and IntelliJ
together to develop your JSF project.

In this article I'd like to introduce the following things:

* Create a project using Maven
* Add JSF into project
* Writing Code
* Add JBoss AS 7 deploy plugin into project
* Deploy project to JBoss AS 7
* Import project into IntelliJ
* Add IntelliJ JSF support to project
* Add JBoss AS7 to IntelliJ
* Debugging project with IntelliJ and AS7

I won't explain many basic concepts about AS7, maven and IntelliJ in
this article because there are already many good introductions on these
topics. So before doing the real work, there some preparations should be
done firstly:

*Download JBoss AS7*

It could be downloaded from here:
https://www.jboss.org/jbossas/downloads/

Using the latest release would be fine. When I'm writing this article
the latest version is 7.1.1.Final.

*Install Maven*

Please make sure you have maven installed on your machine. Here is my
environment:

[source,options="nowrap"]
----
weli@power:~$ mvn -version
Apache Maven 3.0.3 (r1075438; 2011-03-01 01:31:09+0800)
Maven home: /usr/share/maven
Java version: 1.6.0_33, vendor: Apple Inc.
Java home: /System/Library/Java/JavaVirtualMachines/1.6.0.jdk/Contents/Home
Default locale: en_US, platform encoding: MacRoman
OS name: "mac os x", version: "10.8", arch: "x86_64", family: "mac"
----

*Get IntelliJ*

In this article I'd like to use IntelliJ Ultimate Edition as the IDE for
development, it's a commercial software and can be downloaded from:
https://www.jetbrains.com/idea/

The version I'm using is IntelliJ IDEA Ultimate 11.1

After all of these prepared, we can dive into the real work:

[[create-a-project-using-maven]]
== Create a project using Maven

Use the following maven command to create a web project:

[source,options="nowrap"]
----
mvn archetype:create -DarchetypeGroupId=org.apache.maven.archetypes \
-DarchetypeArtifactId=maven-archetype-webapp \
-DarchetypeVersion=1.0 \
-DgroupId=net.bluedash \
-DartifactId=jsfdemo \
-Dversion=1.0-SNAPSHOT
----

If everything goes fine maven will generate the project for us:

image:jsf/8108c4f111aab2c3465472eb84cf1d9b7cf912d0.jpg[images/jsf/8108c4f111aab2c3465472eb84cf1d9b7cf912d0.jpg]

The contents of the project is shown as above.

[[add-jsf-into-project]]
== Add JSF into project

The JSF library is now included in maven repo, so we can let maven to
manage the download for us. First is to add repository into our pom.xml:

[source,java,options="nowrap"]
----
<repository>
  <id>jvnet-nexus-releases</id>
  <name>jvnet-nexus-releases</name>
  <url>https://maven.java.net/content/repositories/releases/</url>
</repository>
----

Then we add JSF dependency into pom.xml:

[source,xml,options="nowrap"]
----
<dependency>
    <groupId>javax.faces</groupId>
    <artifactId>jsf-api</artifactId>
    <version>2.1</version>
    <scope>provided</scope>
</dependency>
----

Please note the 'scope' is 'provided', because we don't want to bundle
the jsf.jar into the war produced by our project later, as JBoss AS7
already have jsf bundled in.

Then we run 'mvn install' to update the project, and maven will download
jsf-api for us automatically.

[[writing-code]]
== Writing Code

Writing JSF code in this article is trivial, so I've put written a
project called 'jsfdemo' onto github:

https://github.com/liweinan/jsfdemo

Please clone this project into your local machine, and import it into
IntelliJ following the steps described as above.

[[add-jboss-as-7-deploy-plugin-into-project]]
== Add JBoss AS 7 deploy plugin into project

JBoss AS7 has provide a set of convenient maven plugins to perform daily
tasks such as deploying project into AS7. In this step let's see how to
use it in our project.

We should put AS7's repository into pom.xml:

[source,xml,options="nowrap"]
----
<repository>
    <id>jboss-public-repository-group</id>
    <name>JBoss Public Repository Group</name>
    <url>https://repository.jboss.org/nexus/content/groups/public/</url>
    <layout>default</layout>
    <releases>
        <enabled>true</enabled>
        <updatePolicy>never</updatePolicy>
    </releases>
    <snapshots>
        <enabled>true</enabled>
        <updatePolicy>never</updatePolicy>
    </snapshots>
</repository>
----

And also the plugin repository:

[source,java,options="nowrap"]
----
<pluginRepository>
    <id>jboss-public-repository-group</id>
    <name>JBoss Public Repository Group</name>
    <url>https://repository.jboss.org/nexus/content/groups/public/</url>
    <releases>
        <enabled>true</enabled>
    </releases>
    <snapshots>
        <enabled>true</enabled>
    </snapshots>
</pluginRepository>
----

And put jboss deploy plugin into 'build' section:

[source,java,options="nowrap"]
----
<plugin>
    <groupId>org.jboss.as.plugins</groupId>
    <artifactId>jboss-as-maven-plugin</artifactId>
    <executions>
        <execution>
            <phase>package</phase>
            <goals>
                <goal>deploy</goal>
            </goals>
        </execution>
    </executions>
</plugin>
----

I've put the final version pom.xml here to check whether your
modification is correct:

https://github.com/liweinan/jsfdemo/blob/master/pom.xml

Now we have finished the setup work for maven.

[[deploy-project-to-jboss-as-7]]
== Deploy project to JBoss AS 7

To deploy the project to JBoss AS7, we should start AS7 firstly. In
JBoss AS7 directory, run following command:

[source,java,options="nowrap"]
----
bin/standalone.sh
----

AS7 should start in a short time. Then let's go back to our project
directory and run maven command:

[source,java,options="nowrap"]
----
mvn -q jboss-as:deploy
----

Maven will use some time to download necessary components for a while,
so please wait patiently. After a while, we can see the result:

image:jsf/97d781c6be9db755aef80a110f1d9b29590610d6.jpg[images/jsf/97d781c6be9db755aef80a110f1d9b29590610d6.jpg]

And if you check the console output of AS7, you can see the project is
deployed:

image:jsf/2._java.jpg[images/jsf/2._java.jpg]

Now we have learnt how to create a JSF project and deploy it to AS7
without any help from graphical tools. Next let's see how to use
IntelliJ IDEA to go on developing/debugging our project.

[[import-project-into-intellij]]
== Import project into IntelliJ

Now it's time to import the project into IntelliJ. Now let's open
IntelliJ, and choose 'New Project...':

image:jsf/05222f3059e387df96ce04d2aea156c82af15096.jpg[images/jsf/05222f3059e387df96ce04d2aea156c82af15096.jpg]

The we choose 'Import project from external model':

image:jsf/d68a0cdbc8c90db3db8af998f34616f73c7fe809.jpg[images/jsf/d68a0cdbc8c90db3db8af998f34616f73c7fe809.jpg]

Next step is choosing 'Maven':

image:jsf/0b3d1cb5794fb54a2465da93648b5a0d1a6643f3.jpg[images/jsf/0b3d1cb5794fb54a2465da93648b5a0d1a6643f3.jpg]

Then IntelliJ will ask you the position of the project you want to
import. In 'Root directory' input your project's directory and leave
other options as default:

image:jsf/2f192d02993248c97e2ac42ea8f3105d855e5cdf.jpg[images/jsf/2f192d02993248c97e2ac42ea8f3105d855e5cdf.jpg]

For next step, just click 'Next':

image:jsf/3a3ee36eb581930822c4a66362795345f5d2f9a7.jpg[images/jsf/3a3ee36eb581930822c4a66362795345f5d2f9a7.jpg]

Finally click 'Finish':

image:jsf/91e40cd0b1545cff4622857d6dc9959f96faf056.jpg[images/jsf/91e40cd0b1545cff4622857d6dc9959f96faf056.jpg]

Hooray! We've imported the project into IntelliJ now icon:smile-o[role="yellow"]

[[adding-intellij-jsf-support-to-project]]
== Adding IntelliJ JSF support to project

Let's see how to use IntelliJ and AS7 to debug the project. First we
need to add 'JSF' facet into project. Open project setting:

image:jsf/8b8d0051f4f15033f17cb859c65f2d8481914678.jpg[images/jsf/8b8d0051f4f15033f17cb859c65f2d8481914678.jpg]

Click on 'Facets' section on left; Select 'Web' facet that we already
have, and click the '+' on top, choose 'JSF':

image:jsf/e6947b84a56a698ca1392a440081bddfb5cae284.jpg[images/jsf/e6947b84a56a698ca1392a440081bddfb5cae284.jpg]

Select 'Web' as parent facet:

image:jsf/6b2296be1bb2d8a81952caef0f025a139a39b381.jpg[images/jsf/6b2296be1bb2d8a81952caef0f025a139a39b381.jpg]

Click 'Ok':

image:jsf/9988c572bad281146f405e9287f645a3da201885.jpg[images/jsf/9988c572bad281146f405e9287f645a3da201885.jpg]

Now we have enabled IntelliJ's JSF support for project.

[[add-jboss-as7-to-intellij]]
== Add JBoss AS7 to IntelliJ

Let's add JBoss AS7 into IntelliJ and use it to debug our project. First
please choose 'Edit Configuration' in menu tab:

image:jsf/dc0550785aae11f9d3eb439fdc0c51069affd25d.jpg[images/jsf/dc0550785aae11f9d3eb439fdc0c51069affd25d.jpg]

Click '+' and choose 'JBoss Server' -> 'Local':

image:jsf/1231420c938f087030cb3dcd37237b5585beb154.jpg[images/jsf/1231420c938f087030cb3dcd37237b5585beb154.jpg]

Click 'configure':

image:jsf/d7e6ab58230b2d31fdcd8fd5f14cd4eb47b05f64.jpg[images/jsf/d7e6ab58230b2d31fdcd8fd5f14cd4eb47b05f64.jpg]

and choose your JBoss AS7:

image:jsf/f7b29ac8009f04fc7f209222ced0bcf54f4b8d9a.jpg[images/jsf/f7b29ac8009f04fc7f209222ced0bcf54f4b8d9a.jpg]

Now we need to add our project into deployment. Click the 'Deployment'
tab:

image:jsf/6802fb7e29283d0e064a7cc4466b918995ba5645.jpg[images/jsf/6802fb7e29283d0e064a7cc4466b918995ba5645.jpg]

Choose 'Artifact', and add our project:

image:jsf/359484b8f6f2c655d94132e9cb6f9dbe5a058656.jpg[images/jsf/359484b8f6f2c655d94132e9cb6f9dbe5a058656.jpg]

Leave everything as default and click 'Ok', now we've added JBoss AS7
into IntelliJ

[[debugging-project-with-intellij-and-as7]]
== Debugging project with IntelliJ and AS7

Now comes the fun part. To debug our project, we cannot directly use the
'debug' feature provided by IntelliJ right now(maybe in the future
version this problem could be fixed). So now we should use the debugging
config provided by AS7 itself to enable JPDA feature, and then use the
remote debug function provided by IntelliJ to get things done. Let's
dive into the details now:

First we need to enable JPDA config inside AS7, open
'bin/standalone.conf' and find following lines:

[source,java,options="nowrap"]
----
# Sample JPDA settings for remote socket debugging
#JAVA_OPTS="$JAVA_OPTS -Xrunjdwp:transport=dt_socket,address=8787,server=y,suspend=n"
----

Enable the above config by removing the leading hash sign:

[source,java,options="nowrap"]
----
# Sample JPDA settings for remote socket debugging
JAVA_OPTS="$JAVA_OPTS -Xrunjdwp:transport=dt_socket,address=8787,server=y,suspend=n"
----

[IMPORTANT]

With WildFly you can directly start the server in debug mode:

[source,java,options="nowrap"]
----
bin/standalone.sh --debug --server-config=standalone.xml
----

Now we start AS7 in IntelliJ:

image:jsf/52369d67f9117c924213de24dd6642b48e47a436.png[images/jsf/52369d67f9117c924213de24dd6642b48e47a436.png]

Please note we should undeploy the existing 'jsfdemo' project in AS7 as
we've added by maven jboss deploy plugin before. Or AS7 will tell us
there is already existing project with same name so IntelliJ could not
deploy the project anymore.

If the project start correctly we can see from the IntelliJ console
window, and please check the debug option is enabled:

image:jsf/eaac5cb1a836809ab29513346b527fe051b7c7ac.png[images/jsf/eaac5cb1a836809ab29513346b527fe051b7c7ac.png]

Now we will setup the debug configuration, click 'debug' option on menu:

image:jsf/b8323caf6980c40c3d635db5e308b03847618d06.jpg[images/jsf/b8323caf6980c40c3d635db5e308b03847618d06.jpg]

Choose 'Edit Configurations':

image:jsf/8327bbe0e83cb7170dd84767631c98956e91c42c.jpg[images/jsf/8327bbe0e83cb7170dd84767631c98956e91c42c.jpg]

Then we click 'Add' and choose Remote:

image:jsf/7103da6b6323e515a03a04cafe111aa7c6b3169d.jpg[images/jsf/7103da6b6323e515a03a04cafe111aa7c6b3169d.jpg]

Set the 'port' to the one you used in AS7 config file 'standalone.conf':

image:jsf/30bbef45137c7d45ae300ba8d551423d1feefc96.png[images/jsf/30bbef45137c7d45ae300ba8d551423d1feefc96.png]

Leave other configurations as default and click 'Ok'. Now we need to set
breakpoints in project, let's choose TimeBean.java and set a breakpoint
on 'getNow()' method by clicking the left side of that line of code:

image:jsf/a96b7d32e04aa67956bd00a187f09b75a5af241e.jpg[images/jsf/a96b7d32e04aa67956bd00a187f09b75a5af241e.jpg]

Now we can use the profile to do debug:

image:jsf/5ea6987d1635c2c58d3ccdb1f5718f29d6a0fac3.png[images/jsf/5ea6987d1635c2c58d3ccdb1f5718f29d6a0fac3.png]

If everything goes fine we can see the console output:

image:jsf/1096ebbbf2b29e694e300e02a48d0fa4207cb746.jpg[images/jsf/1096ebbbf2b29e694e300e02a48d0fa4207cb746.jpg]

Now we go to web browser and see our project's main page, try to click
on 'Get current time':

image:jsf/5ad5d0216d3326e9bc29705042db59f11c3c1e70.png[images/jsf/5ad5d0216d3326e9bc29705042db59f11c3c1e70.png]

Then IntelliJ will popup and the code is pausing on break point:

image:jsf/2499d43c0dce2cab72ba472c8452a2b57999ac84.jpg[images/jsf/2499d43c0dce2cab72ba472c8452a2b57999ac84.jpg]

And we could inspect our project now.

[[conclusion]]
== Conclusion

In this article I've shown to you how to use maven to create a project
using JSF and deploy it in JBoss AS7, and I've also talked about the
usage of IntelliJ during project development phase. Hope the contents
are practical and helpful to you icon:smile-o[role="yellow"]

[[references]]
== References

* _https://developer.jboss.org/wiki/JBossAS7UsingJPDAToDebugTheASSourceCode[JBoss
AS7: Using JPDA to debug the AS source code]_
* _https://developer.jboss.org/wiki/MavenGettingStarted-Developers[Maven
Getting Started - Developers]_
* _https://blog.v-s-f.co.uk/2010/09/jsf-2-1-project-using-eclipse-and-maven-2/[JSF
2.1 project using Eclipse and Maven 2:http]_
* _https://www.amazon.com/Practical-RichFaces-Max-Katz/dp/1430234490/ref=dp_ob_title_bk[Practical
RichFaces]_
* _https://javaserverfaces.java.net/download.html[Oracle Mojarra
JavaServer Faces]_
* _https://github.com/jbossas/jboss-as-maven-plugin[JBoss AS7 Maven
Plugin]_
