Java and PostgreSQL Web Application PART 1

Introduction

If you’e a Java developer working with PostgreSQL, there’s a good chance you’ll want to build a web application that interacts with your database. This multi-part series of articles will cover this topic in depth, showing you how to create a Java web application using the following technology.

  • Eclipse IDE
  • Tomcat
  • Spring MVC
  • Spring Data JPA
  • Hibernate

In this first article of the series, we’ll be starting from scratch with our Java and PostgreSQL web application. We’ll be setting up a project in the Eclipse IDE, importing dependencies using Maven and creating sample data sets that will be used throughout the entire series of articles.

Prerequisites

Before we can start working on our Java and PostgreSQL web application, there are a few essential prerequisites that need to be in place:

  • You must ensure that the PostgreSQL server is installed and running. If you’re running either Linux or Windows, you can download PostgreSQL here.

  • You must also ensure that Eclipse IDE is properly installed and configured on your machine. Linux and Windows users can download Eclipse IDE here.

  • Ensure that the Tomcat server is properly installed. In this article, we will be using Apache Tomcat 9.0.

Image shows Tomcat 9.0 running in the browser

  • You’ll need to have basic knowledge of both XML syntax and Java syntax to follow along with the examples in this article.

What Are We Going to Build?

Let’s take a moment to take a close look at our application so that we can better understand what we’re going to build. We’ll discuss what’s going on with each part of the application: Image show the index page of the Cars Manager application

The image above depicts the Home Page of our application, which has the following parts:

  1. A search bar that will enable us to search for a specific record. An example of a typical search is shown in the image below:

Image shows a specific record as a result of the search box

  1. The Add New Car form allows the user to add a new car in the database:

Image shows the form for adding new car details

  1. This displays the available cars in the database.

  2. These buttons are used to edit and delete records in our database. In the image below, we see the form for editing cars that appears when clicking the Edit button in the action column:

Image shows car details to be edited

What Technologies Will We Use?

We’ll be making use of the following technologies to build our Java and PostgreSQL web application:

  • Spring Framework 5.1.9 with Spring MVC
  • Hibernate 5.4.3 Framework
  • Spring JPA 2.2.0
  • Java Servlet 4.0.1 for the web layer
  • JDBC driver (we used PostgreSQL Connector 42.2.2)

Application Architecture

The image below shows the application architecture that will be used in this article.

Image show the basic architecture of the web application

This architecture diagram gives us a good overview of our web application. We can see that our database isn’t directly accessed by the JSP pages; instead, those transactions are handled by the data access layer whenever it’s invoked by the service layer.

Creating a Sample Database

In this section, we’ll create a sample database that will be used throughout our multi-part series. To do this, we first have to login to our PostgreSQL database server. Then we’ll execute the command shown below to create the ‘cars’ database:

CREATE DATABASE cars;

We can connect to the ‘cars’ database using the PostgreSQL meta-command \c. Once we connect to the database, the prompt command will change to something like the following:

cars=#

Now, let’s create a table named cars using the following command:

CREATE TABLE cars (
id SERIAL PRIMARY KEY,
carname TEXT NOT NULL,
brand TEXT NOT NULL,
remarks TEXT NOT NULL
);

Once we create our cars table, we can insert some records into it:

INSERT INTO cars(carname,brand,remarks) VALUES
('fortuner', 'toyota','big engine and nice body'),
('wigo','toyota','small and cute'),
('ertiga','suzuki','small but economical'),
('city','honda','elegant');

The output of this INSERT statement will look like the following:

cars=# SELECT * FROM cars;
id | carname | brand | remarks
----+----------+--------+--------------------------
1 | fortuner | toyota | big engine AND nice body
2 | wigo | toyota | small AND cute
3 | ertiga | suzuki | small but economical
4 | city | honda | elegant
(4 ROWS)

Creating A Maven Project in Eclipse IDE

We’re now going to add a new project in Java Eclipse IDE. We’ll need to follow these steps in sequence:

  • First, ensure that you’re in the JAVA EE perspective view.

  • Click File, then click New. Finally, select Dynamic Web Project in the sub-menu.

  • Give your project a meaningful name in the “Project Name” field of the Dynamic Web Project window. In our example, we’ll name our project “CarInformationSystem”.

Image shows the dynamic web project window

  • We’ll use “Apache Tomcat v9.0” as the target runtime.

  • We’ll also use the Dynamic web module version 4.0.

  • Last but not least, click the Finish button to create the project.

Image shows the structure of the new project

Convert Project to Maven Project

Now that we’ve created our Eclipse project, it’s time to convert it into a Maven project. To accomplish this task, follow these simple steps in sequence:

  • Right-click on the newly-created project.

  • Select “Configure”, then click on “Convert to Maven Project”.

Image shows Maven POM window

  • We’ll change the “Group Id:” to “com.carsmanager” in the Maven POM window.

  • We can see that our project was successfully converted to a Maven project, and we now have a “pom.xml” file.

Image shows the new structure of the project directory when converted into Maven Project

Conclusion

Building a Java and PostgreSQL web application requires multiple steps, so our tutorial on this topic will be broken up into a series of articles. In this first part of the series, we discussed the architecture of our application and created a sample data set; we also created an Eclipse project that we converted into a Maven Project. The next installment in this series will pick up where we left off and dive deeper into the development of our web application.

Pilot the ObjectRocket Platform Free!

Try Fully-Managed CockroachDB, Elasticsearch, MongoDB, PostgreSQL (Beta) or Redis.

Get Started

Keep in the know!

Subscribe to our emails and we’ll let you know what’s going on at ObjectRocket. We hate spam and make it easy to unsubscribe.