Technologies and tool in Java web application development

Introduction with the technologies and tools that we are going to use in the complete java web application development tutorial.

Before start development, I hope you have enough understanding of Core Java and familiar with HTML, CSS, JS, JSP, and Servlet.

On day one we are going to prepare our machine to start the development. Let’s see the software requirement and the technologies that we are going to use in Java web application development.

Software Requirement:

  •  Eclipse/STS tool.
  •  MYSQL with MySQL Workbench.

Technology

Front End: HTML, JSP, CSS.

Server Side: Servlet.

Back End: MYSQL.

Server: Tomcat.   

 Let’s have a quick introduction to the technologies and tools that we are going to use for future rolling.

 What is HTML?

 HTML is used to create front end or GUI design like input fields, buttons, heading, text, page title, drop down, menus ETC. HTML contains tags to view the elements. There are lots of tags available in the HTML that will use as per the requirement.

For example, I am creating a footer of the page. So there is a footer tag is available similarly header tag for header part and the body tag for the body part of the page.

 Sample HTML code

<html>

<body>

<h2>Hello World!</h2>

</body>

</html>

What is JavaScript?

Java Script is a programming language mostly used to set the validation at the client-side. as the Java script team is updating there technologies these days lots of frameworks is available like Node js, view Js, react js.

Which supports client site as well as server site. It is an opensource so it’s used widely. We are using js in our project to create front end validation.

As I said its programming language it means Java Script is able to perform the logical operations also.

Java script is capable to get and set the data to HTML. Below is the sample code to add two numbers in JavaScript.

Sample Java Script Code

function add(){

var a,b,c;

a=Number(document.getElementById("first_input").value);

b=Number(document.getElementById("second_input").value);

c= a + b;

document.getElementById("answer").value= c;

}

What is CSS?

CSS is used to makeover the elements. It helps to create more attractive HTML pages. CSS and its updated versions like css3 and css5 supports animation and some advance design things also.

Which makes our application more attractive. we are using CSS3 for basic use like to manage divisions passions and to add some color in heading and footer page.

Sample code for CSS

footer {

    text-align: center;

    background: #BBC9BE;

    padding: 40px;

    size: 20px;

}

What is Servlet?

Servlet is used as a server-side programming language. Which is responsible to handle the request which is coming from the view part. As we are using MVC architecture so the controller part would be handled by the only servlet by the post and Get methods.

Sample code for Servlet

package controller;



import java.io.IOException;

import javax.servlet.ServletException;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import utility.ServletUtility;

/**

 * Servlet implementation class HomeCtl

 */

@WebServlet(name = "HomeCtl", urlPatterns = { "/home" })

public class HomeCtl extends BaseCtl {

    private static final long serialVersionUID = 1L;


    /**

     * @see HttpServlet#HttpServlet()

     */

    public HomeCtl() {

        super();

        // TODO Auto-generated constructor stub

    }


    /**

    * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)

    */

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        // TODO Auto-generated method stub

        ServletUtility.forward(getView(), request, response);

    } 

    /**

    * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)

    */

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        // TODO Auto-generated method stub

        doGet(request, response);

    }

    @Override

    protected String getView() {

        // TODO Auto-generated method stub

        return JWAView.HomeView;

    }

} 

What is MYSQL?

MYSQL  is a relational database management system. In this Java web development tutorial, we are using MYSQL to store the data. To operate the database we are using MYSQL workbench which is quite simple and easy to understand.

MYSQL server is running on the port number 3306 with the username “root” and password “root”. follow the complete MYSQL Tutorial to get command in MYSQL.

What is Server?

The server is used to deploy the application. Apache Tomcat is an opensource server to deploy and run the java web application. Currently will use tomcat 8.5 and will upgrade the version according to the requirement.

By default, Tomcat will run on the port number 8080. if it’s busy we can change it. Just follow some simple steps to change it.

Model View Controller

Model View Controller(MVC) is a way of managing the resources. Here the resources mean the files and technologies that used to develop an application.

So MVC is divided those resources into three parts 1) Model 2) View 3) Controller

Model will be responsible to manage the resources related to the database or back-end. So Under the model package will include all the classes that contain the code of database transactions Like getting data from database, Insert data into database, Delete or Update data.

View will be responsible to manage the resources related to user interface like HTML, CSS, Images, JSP, etc. As the name suggests the front end or view part of the application will come under the view.

Controller will manage all the request and response that is servlets. When User/View sends a request to Database/Model. Then the controller will get the request and send the response according to the request.

What is Maven?

Maven is a project management tool. It is used to manage the dependency and documentation.

Basically there are two main terms that we are going to use in the project 1) POM.xml, 2) Dependency

POM.XML is a project configuration file. Which will manage all the dependency(Jar) of the project?

Dependency is a JAR, ZIP of the API that will use in the project. The same Jar will keep in the pom.xml. 

Example of a pom.xml

<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/maven-v4_0_0.xsd">

  <modelVersion>4.0.0</modelVersion>

  <groupId>com</groupId>

  <artifactId>JavaWebApplication</artifactId>

  <packaging>war</packaging>

  <version>0.0.1-SNAPSHOT</version>

  <name>JavaWebApplication Maven Webapp</name>

  <url>http://maven.apache.org</url> 

  <dependencies>

    <dependency>

      <groupId>junit</groupId>

      <artifactId>junit</artifactId>

      <version>3.8.1</version>

      <scope>test</scope>

    </dependency>

  </dependencies>

  <build>

    <finalName>JavaWebApplication</finalName>

  </build>

</project>

Note: This is the only brief discussion about the technologies and tools that we are going to use during this complete tutorial. I will recommend you get enough expertise in this topic to get ready to develop a java web application.