Skip to content

JButler CRUD Tutorial · Changes

Page history
feat: atualiza JButler e inclui menção ao IntelliJ IDEA authored by Vítor E. Silva Souza's avatar Vítor E. Silva Souza
Hide whitespace changes
Inline Side-by-side
tutorials/JButler-CRUD-Tutorial.md
View page @ d4dc9197
......@@ -34,11 +34,13 @@ The [JButler Base Project](https://gitlab.labes.inf.ufes.br/labes/jbutler-base-p
5. Using (another) terminal, go to the `$WILDFLY_HOME/bin` folder and execute WildFly by running `./standalone.sh`;
6. Once WildFly is running, go back to the `jbutler-base-project` folder and copy the application package `target/jbutler-base-project.war` to the `$WILDFLY_HOME/standalone/deployments` folder. WildFly should start deploying. If everything goes well, you should see this message: `Deployed "jbutler-base-project.war"`;
6. Once WildFly is running, go back to the terminal you ran Maven before and run `mvn wildfly:deploy`. If everything goes well, you should see this message: `Deployed "jbutler-base-project.war"`;
7. Open http://localhost:8080/jbutler-base-project in your browser and try some of the features. Check out the different types of CRUD front-ends, we will use one of them in this tutorial;
8. When you want to undeploy the application, go to the `$WILDFLY_HOME/standalone/deployments` folder and rename the `jbutler-base-project.war.deployed` file to `jbutler-base-project.war.undeploy`. You can then delete the `jbutler-base-project.*` files from that folder and stop WildFly by pressing Ctrl+C in the terminal in which it's open.
8. When you want to undeploy the application, run Maven again with `mvn wildfly:undeploy`. You can then stop WildFly by pressing Ctrl+C in the terminal in which it's open.
> Instead of building and deploying with Maven, you can just as well open the `jbutler-base-project` folder in your favorite IDE with WildFly configured and deploy with a more friendly user interface. In the LabES catalog (in Portuguese), there are instructions on [how to configure IntelliJ IDEA to deploy on WildFly](https://gitlab.labes.inf.ufes.br/labes/catalogo/-/wikis/plataformas/configura%C3%A7%C3%A3o-da-ide-para-desenvolvimento-jakarta-ee#configura%C3%A7%C3%A3o-do-intellij-idea).
If you want, you can use the [JButler Base Project](https://gitlab.labes.inf.ufes.br/labes/jbutler-base-project) source code to kickstart your system (in this case, you should be aware of its [license](https://gitlab.labes.inf.ufes.br/labes/jbutler-base-project/-/blob/main/LICENSE.txt)). Or you can just use it as an example and start your project from scratch. In the following section, this is what we will do.
......@@ -48,17 +50,10 @@ If you want, you can use the [JButler Base Project](https://gitlab.labes.inf.ufe
To create a project from scratch, we will use a Maven archetype mentioned in [a Jakarta EE 9 Hello World example](https://blog.payara.fish/getting-started-with-jakarta-ee-9-hello-world). A similar process (but without JButler) is described in the [JavaHostel example repository](https://github.com/dwws-ufes/javahostel/tree/main/jakartaee9), with detailed explanation of the steps, if you need them. It's a good tutorial to do before this one, in order to learn about Jakarta EE 9 before learning about JButler. Here, I will just describe the steps without detailed explanations.
Open a terminal, change to the directory where you want the Oldenburg project folder to be created, run the following command and provide the values for the project properties as in the example below (the `$` denotes the prompt and is not part of the command):
Open a terminal, change to the directory where you want the Oldenburg project folder to be created and run the following command (the `$` denotes the prompt and is not part of the command):
```console
$ mvn archetype:generate -DarchetypeGroupId=org.apache.maven.archetypes -DarchetypeArtifactId=maven-archetype-quickstart
...
[INFO] Generating project in Interactive mode
[INFO] Archetype [org.apache.maven.archetypes:maven-archetype-quickstart:1.4] found in catalog remote
Define value for property 'groupId': br.ufes.inf.labes
Define value for property 'artifactId': oldenburg
Define value for property 'version' 1.0-SNAPSHOT: :
Define value for property 'package' br.ufes.inf.labes: : br.ufes.inf.labes.oldenburg
$ mvn archetype:generate -DgroupId=br.ufes.inf.labes -DartifactId=oldenburg -DarchetypeArtifactId=maven-archetype-quickstart -DarchetypeVersion=1.4 -DinteractiveMode=false
```
This archetype doesn't create the full structure of a Jakarta EE project in Maven. To complete it, go into the project folder and create some new subfolders, plus you can delete the two sample classes that are created, like below:
......@@ -68,8 +63,8 @@ $ cd oldenburg
$ mkdir src/main/resources
$ mkdir src/main/webapp
$ mkdir src/test/resources
$ rm src/main/java/br/ufes/inf/labes/oldenburg/App.java
$ rm src/test/java/br/ufes/inf/labes/oldenburg/AppTest.java
$ rm src/main/java/br/ufes/inf/labes/App.java
$ rm src/test/java/br/ufes/inf/labes/AppTest.java
```
Open the `oldenburg` folder on Visual Studio Code to finish the project setup and add JButler. Open the `pom.xml` file and change it so it looks like the one below:
......@@ -78,7 +73,7 @@ Open the `oldenburg` folder on Visual Studio Code to finish the project setup an
<?xml version="1.0" encoding="UTF-8"?>
<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/xsd/maven-4.0.0.xsd">
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>br.ufes.inf.labes</groupId>
......@@ -95,46 +90,37 @@ Open the `oldenburg` folder on Visual Studio Code to finish the project setup an
<failOnMissingWebXml>false</failOnMissingWebXml>
</properties>
<repositories>
<repository>
<id>br.ufes.inf.labes</id>
<name>LabES/UFES Maven Repository</name>
<url>https://labes.inf.ufes.br/maven2</url>
<layout>default</layout>
</repository>
</repositories>
<dependencies>
<dependency>
<groupId>br.ufes.inf.labes</groupId>
<artifactId>jbutler</artifactId>
<version>2.0.1</version>
<version>2.1.2</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>font-awesome</artifactId>
<version>6.1.0</version>
<version>6.5.1</version>
</dependency>
<dependency>
<groupId>com.github.adminfaces</groupId>
<artifactId>admin-template</artifactId>
<version>1.3.1-jakarta</version>
<version>2.0</version>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>8.0.27</version>
<version>8.0.33</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.hibernate.orm</groupId>
<artifactId>hibernate-jpamodelgen</artifactId>
<version>6.1.3.Final</version>
<version>6.4.4.Final</version>
</dependency>
<dependency>
<groupId>jakarta.xml.bind</groupId>
<artifactId>jakarta.xml.bind-api</artifactId>
<version>4.0.0</version>
<version>4.0.2</version>
<scope>compile</scope>
</dependency>
</dependencies>
......@@ -145,19 +131,19 @@ Open the `oldenburg` folder on Visual Studio Code to finish the project setup an
<plugins>
<plugin>
<artifactId>maven-clean-plugin</artifactId>
<version>3.2.0</version>
<version>3.3.2</version>
</plugin>
<plugin>
<artifactId>maven-resources-plugin</artifactId>
<version>3.3.0</version>
<version>3.3.1</version>
</plugin>
<plugin>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.10.1</version>
<version>3.13.0</version>
</plugin>
<plugin>
<artifactId>maven-surefire-plugin</artifactId>
<version>3.0.0-M7</version>
<version>3.2.5</version>
</plugin>
<plugin>
<artifactId>maven-jar-plugin</artifactId>
......@@ -165,11 +151,11 @@ Open the `oldenburg` folder on Visual Studio Code to finish the project setup an
</plugin>
<plugin>
<artifactId>maven-install-plugin</artifactId>
<version>3.0.1</version>
<version>3.1.1</version>
</plugin>
<plugin>
<artifactId>maven-deploy-plugin</artifactId>
<version>3.0.0</version>
<version>3.1.1</version>
</plugin>
<plugin>
<artifactId>maven-site-plugin</artifactId>
......@@ -177,11 +163,16 @@ Open the `oldenburg` folder on Visual Studio Code to finish the project setup an
</plugin>
<plugin>
<artifactId>maven-project-info-reports-plugin</artifactId>
<version>3.4.1</version>
<version>3.5.0</version>
</plugin>
<plugin>
<artifactId>maven-war-plugin</artifactId>
<version>3.3.2</version>
<version>3.4.0</version>
</plugin>
<plugin>
<groupId>org.wildfly.plugins</groupId>
<artifactId>wildfly-maven-plugin</artifactId>
<version>4.2.2.Final</version>
</plugin>
</plugins>
</pluginManagement>
......@@ -530,8 +521,8 @@ Next, we create a Facelets template based on AdminFaces to customize the appeara
<ui:define name="head">
<title><h:outputText value="Oldenburg Workshop Simulator :: " /><ui:insert name="title" /></title>
<h:outputStylesheet library="webjars" name="font-awesome/6.1.0/css/all.min-jsf.css" />
<h:outputStylesheet library="webjars" name="font-awesome/6.1.0/css/v4-shims.min-jsf.css" />
<h:outputStylesheet library="webjars" name="font-awesome/6.5.1/css/all.min-jsf.css" />
<h:outputStylesheet library="webjars" name="font-awesome/6.5.1/css/v4-shims.min-jsf.css" />
</ui:define>
<ui:define name="logo-lg">
......@@ -606,7 +597,9 @@ Finally, create the home page at `src/main/webapp/index.xhtml` referring to the
## Deploy and check it out
At this point you can already deploy and see the home page using the AdminFaces template. You could do it just like before with the JButler Base Project, but for a project you're developing I suggest a slightly different process. On a terminal (you could use the one in VSCode, for instance), run `mvn package` to build the deploy and then the following commands:
At this point you can already deploy and see the home page using the AdminFaces template. You could do it just like before with the JButler Base Project, and we recommend using an IDE for this task.
If, however, your IDE doesn't have good support for deploying on WildFly, using the Maven WildFly plug-in can be a bit slow when you need to update the artifacts and refresh the website. We briefly present here an alternative method that uses commands on a terminal. Run `mvn package` to build the package and then also run the following commands:
```sh
$ export WILDFLY_HOME=/path/to/wildfly/in/you/computer
......@@ -618,11 +611,17 @@ $ touch $WILDFLY_DEPLOY/oldenburg.war.dodeploy
Before `mvn package` produces `target/oldenburg.war`, it assembles it in a folder called `target/oldenburg`, so the above commands create a link to this folder in WildFly's deployments folder. When a folder is detected, WildFly doesn't automatically deploy it, so you need to create the `oldenburg.war.dodeploy` file there as well:
```sh
$ mv $WILDFLY_DEPLOY/oldenburg.war.deployed $WILDFLY_DEPLOY/oldenburg.war.dodeploy
$ touch $WILDFLY_DEPLOY/oldenburg.war.dodeploy
```
The advantage in this case is that you can change something under `src/main/webapp` (in a web page, CSS, script, etc.) and update it on the server only with `mvn package` (no need to redeploy). If you change something under `src/main/java` or `src/main/resources`, though, you need to redeploy.
To redeploy:
```sh
$ mv $WILDFLY_DEPLOY/oldenburg.war.deployed $WILDFLY_DEPLOY/oldenburg.war.dodeploy
```
Finally, to undeploy and remove Oldenburg from the server:
```sh
......@@ -630,11 +629,7 @@ $ mv $WILDFLY_DEPLOY/oldenburg.war.deployed $WILDFLY_DEPLOY/oldenburg.war.undepl
$ rm -r $WILDFLY_DEPLOY/oldenburg.*
```
> **Note:** IDEs usually do this for you. In earlier versions of this tutorial, I would start WildFly and deploy the application using Eclipse. When I migrated to VSCode, I couldn't find a WildFly plug-in that worked. Once I do, I can update this tutorial. It's always nice, though, to know how to do things by hand as well. ;)
>
> Also, there's a Maven plug-in that deploys on WildFly, the instructions in the [JavaHostel example repository](https://github.com/dwws-ufes/javahostel/tree/main/jakartaee9) explain how to use it. I find its deploy a bit slower, tough, and I didn't find a way to update only changes under `src/main/webapp` without a full redeploy.
>
> Speaking of updating only `src/main/webapp`, if you're making a lot of small changes there and testing often (e.g., tweaking with CSS or with PrimeFaces tags) and you are annoyed that you have to call `mvn package` every time, there's a trick: make your changes directly under `target/oldenburg` and just reload the page on the browser. Remember, however, that once you are satisfied you need to copy the result back to `src/main/webapp`, otherwise the next `mvn package` will override it!
> **Note:** if you're making a lot of small changes in `src/main/webapp` and testing often (e.g., tweaking with CSS or with PrimeFaces tags) and you are annoyed that you have to call `mvn package` every time, there's a trick: make your changes directly under `target/oldenburg` and just reload the page on the browser. Remember, however, that once you are satisfied you need to copy the result back to `src/main/webapp`, otherwise the next `mvn package` will override it!
......@@ -782,7 +777,6 @@ For all this to work, we need to configure JPA by creating the file `src/main/re
<properties>
<property name="hibernate.hbm2ddl.auto" value="update" />
<property name="hibernate.dialect" value="org.hibernate.dialect.MySQL8Dialect" />
</properties>
</persistence-unit>
</persistence>
......