This example demonstrates how to create a simple JSP page
In my previous tutorials I have shown you how to use Servlets to handle requests, responses, request parameters and upload files. However you may already noticed how inconvenient it can be to use servlets to render HTML content for your web applications. Repeatedly calling methods on the ServletOutputStream or PrintWriter classes to output the content and having to put HTML content within Java Strings, requiring escaping of quotation marks, is a real pain. In this example, you will learn about Java Server Pages and how they can make your life a whole lot easier.
What is JSP?
The creators of the Java EE specification realized that using servlets to generate pure HTML content requires more effort than needed. The problem with pure HTML pages is that they are static. While using servlets we could generate dynamic content and render it as HTML. JavaServer Pages, also known as JSPs are the answer to this problem. JSPs are essentially a hybrid solution, combining Java code and HTML tags. JSPs can contain any HTML tag in addition to Java code.
JSP Example
In following example we are going to display a simple JSP page showing the current time.
Let’s first take a look at the project structure:
As you see the structure is very simple. A Maven POM file to handle dependencies and build properties:
<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">
<modelVersion>4.0.0</modelVersion>
<groupId>net.javatutorial.tutorials</groupId>
<artifactId>JSPExample</artifactId>
<version>1</version>
<packaging>war</packaging>
<name>JSPExample</name>
<url>https://javatutorial.net</url>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
</properties>
<dependencies>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>3.1.0</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>javax.servlet.jsp</groupId>
<artifactId>javax.servlet.jsp-api</artifactId>
<version>2.3.1</version>
<scope>provided</scope>
</dependency>
</dependencies>
<build>
<finalName>jspexample</finalName>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<version>2.3</version>
<configuration>
<warSourceDirectory>src/main/webapp</warSourceDirectory>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.1</version>
<configuration>
<source>1.8</source>
<target>1.8</target>
</configuration>
</plugin>
</plugins>
</build>
</project>
A simple web.xml containing only the application display name
<?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_3_1.xsd" version="3.1"> <display-name>JSP Example</display-name> </web-app>
and the actual JSP file:
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ page import="java.time.LocalDateTime" %> <!DOCTYPE html> <html> <head> <title>Simple JSP Application</title> </head> <body> <h1>Hello world!</h1> <h2>Current time is <%= LocalDateTime.now() %></h2> </body> </html>
Now lets take a closer look at index.jsp
Several different types of tags can be used in JSPs. In the example above we use the directive type <%@ page … %> to set the page encoding to UTF-8
<%@ page contentType="text/html;charset=UTF-8" %>
By default (if we do not include this line in our JSP file) the character encoding will be set to ISO-8859-1, which is inconvenient if we want to use special characters and letters from non-latin alphabets.
We use another directive to import LocalDateTime
<%@ page import="java.time.LocalDateTime" %>
Finally to display current time we use a special tag <%= … /> called expression. Expressions contain simple Java code that returns something that can be written to the client output, and expressions output the return variable of that code to the client:
<h2>Current time is <%= LocalDateTime.now() %></h2>
After deploying the application go to http://localhost:8080/jspexample/index.jsp
You should see a page similar to this one
You will find the source files for this example in our GitHub repository