Tutorial01 - dwws-ufes/jbutler GitHub Wiki

JButler has moved!

The new version of JButler is now hosted at Labes/UFES and there is a new tutorial as well. This repository contains an older version, if you're interested.

JButler Tutorial, Part 01: create a new Web project

We are finally ready to move to Eclipse and start developing our application:

  1. Open Eclipse's Java EE perspective;
  2. Click on the File > New > Maven Project menu and click Next;
  3. Select the maven-archetype-webapp archetype (from org.apache.maven.archetypes) and click Next;
  4. Finally, fill in the information below and click Finish:
    • Group Id: br.ufes.informatica
    • Artifact Id: oldenburg
    • Version: 1.0

Next, we need to make some adjustments in a few configuration files in order to use the latest versions of Java and Jakarta EE technology:

  1. Open pom.xml and replace the following inside the <properties></properties> tag (this sets the Java version to 13):

    <maven.compiler.source>13</maven.compiler.source>
<maven.compiler.target>13</maven.compiler.target>

  2. Also add the following dependency under the <dependencies></dependencies> tag (this tells Maven that we will use Jakarta EE 8. We only need the API, since the actual libraries are provided by WildFly at runtime):

    <dependency>
    <groupId>jakarta.platform</groupId>
    <artifactId>jakarta.jakartaee-api</artifactId>
    <version>8.0.0</version>
    <scope>provided</scope>
</dependency>

  3. Save pom.xml, open Deployed Resources/webapp/WEB-INF/web.xml and replace its contents to the following (this updates the Web application configuration to version 4.0):

    <?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_4_0.xsd"
    version="4.0">
    <display-name>Oldenburg</display-name>
</web-app>

  4. Save web.xml, right-click the oldenburg project, select Maven > Update Project..., then click OK;

  5. Right-click the oldenburg project, select Properties. Go to the Project Facets page and make sure that Java is set to version 13. If not, set it and click Apply. Go to the Java Build Path page and, under the Libraries tab, make sure that the JRE System Library is also version 13. If not, select it, click Edit and set the Execution environment to JavaSE-13 and click Finish;

  6. Back at the Project Facets page, try to change Dynamic Web Module to verion 4.0. If you can, click Apply and Close. If you cannot, click Cancel, locate the hidden .settings folder inside the oldenburg project directory, open the file .settings/org.eclipse.wst.common.project.facet.core.xml and change the jst.web version to 4.0:

    <installed facet="jst.web" version="4.0"/>

  7. Then, save the file, right-click the oldenburg project, select Refresh... and check back at the Project Facets page that Dynamic Web Module is not at version 4.0;

  8. Still at the Project Facets page, check JavaServer Faces and select the latest version (2.3);

  9. Also, select CDI (Contexts and Dependency Injection) (also the latest version, 2.0), as JSF will not work properly without CDI anymore;

  10. Before you click Apply again, click on Further configuration available.... Click Next to accept the default CDI configuration. Then, under JSF Implementation Library, select Disable Library Configuration. Under URL Mapping Patterns, make sure *.xhtml is showing. Click OK, then Apply and Close;

  11. If you want to make sure everything is properly configured, open Deployed Resources/webapp/WEB-INF/web.xml and check that the Faces Servlet is there. Also, check that Eclipse created the files Deployed Resources/webapp/WEB-INF/beans.xml and Deployed Resources/webapp/WEB-INF/faces-config.xml.

You can now test your Web application. Open Deployed Resources/webapp/index.jsp, add <p><%= new java.util.Date() %></p> inside the <body></body> of the page, then save, deploy and test. If you don't know how to do this, here it is:

  1. Open the Servers view;
  2. Right-click WildFly 22 and select Add and Remove...;
  3. Using the Add button, select and move oldenburg from the left (Available) to the right (Configured);
  4. Click Finish, then right-click WildFly 12 again and select Start;
  5. Open http://localhost:8080/oldenburg/ in your favorite Web browser.

If the Web application works and, in the Markers view, you still see some errors under Maven Java EE Configuration Problem, select these errors, right-click on them and select Delete, so they no longer bother you. If you still see little error icons at the Project Explorer, right-click the oldenburg project and select Refresh... to make them go away.

Next: apply a ready-to-use layout

⚠️ **GitHub.com Fallback** ⚠️