Ece356 database systems
This presentation is the property of its rightful owner.
Sponsored Links
1 / 42

ECE356 – Database Systems PowerPoint PPT Presentation


  • 75 Views
  • Uploaded on
  • Presentation posted in: General

ECE356 – Database Systems. Lab 1 – Building a Web Project with NetBeans Tiuley Alguindigue Lab I nstructor – University of Waterloo, E & CE Dept. Fall 2013. Lab 1 - Learning objectives. S tarting NetBeans C reating a Web project A dding JSPs, servlets, and beans to a project

Download Presentation

ECE356 – Database Systems

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Ece356 database systems

ECE356 – Database Systems

Lab 1 – Building a Web Project with NetBeans

TiuleyAlguindigue

Lab Instructor – University of Waterloo, E & CE Dept.

Fall 2013


Lab 1 learning objectives

Lab 1 - Learning objectives

  • Starting NetBeans

  • Creating a Web project

  • Adding JSPs, servlets, and beans to a project

  • Model-View-Controller architecture

  • Using JSPs and beans to process HTML forms

  • Adding MySQL JDBC driver to project

  • Connecting to MySQL from a bean


Starting netbeans

Starting NetBeans

  • Install Netbeans 7.2.1

    • http://netbeans.org/downloads/

    • Download the “Java EE option” from the available “NetBeans IDE Download Bundles”.

    • Select the “Apache Tomcat” option for your web server during the installation.


Starting netbeans1

Starting NetBeans

  • For lab computers

    • NetBeans is installed with the Glassfish option

    • Make sure the environment variable JAVA_HOME is set to the directory where the JDK is installed (under C:\Program Files\Java\ )

      Note: The procedure for setting JAVA_HOME on a Windows box is to right click on "My Computer", select Properties, Advanced (or Advanced System Settings), Environment Variables, and then either Edit or New.


Starting netbeans2

Starting NetBeans

  • Create a Web Project

    • File/New Project


Create a web project

Create a Web Project


Create a web project1

Create a Web Project


Create a web project2

Create a Web Project


Create a web project3

Create a Web Project


Create a web project4

Create a Web Project

  • Run your first Web Project

  • Displays a web page with “Hello World!”


Adding jsps servlets and beans to a project

Adding JSPs, servlets, and beans to a project

  • Modify this web project so that:

    • It will allow the user to enter some data in another JSP.

    • It will execute a servlet that will connect to a MySQL database running in the eceweb server.

    • It will use java classes to store data entered by the user and also to store the status of the connection with the database as required by the Model-View-Controller architecture.


Adding jsp

Adding JSP

  • Add a JSP called user_data_form.jsp under the folder “Web Pages”

  • Add html commands to create a form such as the one shown in the next slide.

  • Use the following command when specifying your form html tag:

    <form method="post" action="UserDataServlet">

    Note: UserDataServlet is a servlet that you will build in the next step of this lab.


Adding jsp1

Adding JSP


Adding jsp2

Adding JSP

  • Modify index.jsp to allow the user to access the page that you have just created. After your changes index.jsp must contain code to display the page shown in the next slide.


Your first jsp index jsp

Your first JSPindex.jsp


Adding a servlet

Adding a Servlet

  • Test your web project

  • You will now add the servlet UserDataServlet.java which defines the action performed when the user clicks on the “submit” button of your form.


Add a new package

Add a new package


Add servlet under this package

Add servlet under this package


Add servlet under this package1

Add servlet under this package


Add servlet under this package2

Add servlet under this package


Userdataservlet java

UserDataServlet.java

Uses a class called UserData (called a JavaBean) to store the values entered in the form. We have provided this class here.

The java code in this servlet will:

1. Get the parameters entered in the form and store them in the corresponding fields in object of type UserData.

Hint: see documentation for class HttpServletRequest, method getParameter()

2. Save the object UserData to the session request

Hint: see documentation for class HttpSession , method setAttribute()

3. Display the values entered in the form using a jsp called user_data_thanks.jsp (provided here)

Hint: see documentation for getServletContext().getRequestDispatcher(..).forward(..);


Testing your jsps forms and servlet

Testing your jsps, forms and servlet

  • Add the user_data_thanks.jsp (provided here) to the folder ‘Web Pages”

  • Add the user_data_thanks2.jsp (provided here) to the folder ‘Web Pages”

  • Add the UserData.java class (provided here) to the source package “ece356”

  • Test your web project


Testing your jsps forms and servlet user data thanks jsp

Testing your jsps, forms and servletuser_data_thanks.jsp


Testing your jsps forms and servlet user data thanks2 jsp

Testing your jsps, forms and servletuser_data_thanks2.jsp


Model view controller architecture

Model-View-Controller architecture

  • Your web project uses the MVC software architecture model:

    • JSP to receive and present data to the user (View)

    • Servlet to implement navigation and business logic (Controller)

    • JavaBean – use to encapsulate related properties in a single java object (Model)

    • Data Access Object (DAO) - object that provides an abstract interface to a database(Model)


Adding mysql jdbc driver to project

Adding MySQL JDBC driver to project

  • The next part of this lab is to add an option to connect to the MySQL database in the server

  • MySQL provides connectivity for client applications developed in the Java programming language through a JDBC driver, which is called MySQL Connector/J.

  • You will need to add to your web project the library for the MySQL Connector/J


Adding mysql jdbc driver to project1

Adding MySQL JDBC driver to project

Add a new Library, select the “MySQL JDBC Driver” from the list of available libraries


Mysql jdbc driver added to project

MySQL JDBC driver added to project

Your “Projects” tab should now show the MySQL JDBC Driver jar file.


Add option to connect to the mysql database in the server

Add option to connect to the MySQL database in the server

  • Modify index.jsp:

    • Add a link that allows the user to connect to the database

    • When this link is clicked, your web application will execute the servlet DBTestServlet.java (you will write this servlet in the next part of this lab)

    • Next slide shows index.jsp after these modifications


Your first page index jsp

Your first pageindex.jsp


Add a new servlet dbtestservlet java

Add a new Servlet DBTestServlet.java

  • Add a new Servlet to package ece356 named DBTestServlet.java. Make sure to choose the option “Add information to deployment descriptor (web.xml)” on the second panel.

  • You will later edit this servlet and add the java code needed to connect to the DB as part of the method processRequest()


Userdbao java

UserDBAO.java

  • Servlet DBTestServlet uses the services of a data access object(DAO) called to UserDBAO.java to interact with the database. The code for UserDBAO.java is provided here.

  • Modify the method TestConnection() in the UserDBAO.java so that the database, user id, and password corresponds to your course database in the eceweb server. Ie. If your uwuserid is pthomas, your parameters should look as follows:

    public static final String url = "jdbc:mysql://eceweb.uwaterloo.ca:3306/";

    public static final String user = “user_pthomas";

    public static final String pwd = “your_password"; // specify your password here, initially same as userid


Dbtestservlet processrequest

DBTestServletprocessRequest()

  • Modify method processRequest() inDBTestServlet.java to connect to the database.

    • Add call to TestConnection method in UserDBAO.java:

      UserDBAO.testConnection();

    • The statement above may throw an exception when the attempt to connect is not successful. Your code should handle this exception.


Dbtestservlet processrequest1

DBTestServletprocessRequest()

  • Handling exceptions – setting the value of variable with name of jsp to be displayed:

    String url;

    try {

    // Call static method using class name

    UserDBAO.testConnection();

    // Set the name of jsp to be displayed if

    // connection succeds

    url = "/dbtest.jsp";

    } catch (Exception e) {

    // Save the exception info in th e request object so it can be displayed.

    request.setAttribute("exception", e);

    // Set the name of jsp to be displayed if

    // connection fails

    url= "/error.jsp";

    }


Dbtestservlet processrequest2

DBTestServletprocessRequest()

Displaying the suitable jsp from the servlet (name of jsp is now stored in variable “url”):

getServletContext().getRequestDispatcher(url).forward(request, response);


Adding jsps displayed after connection when connection is successful

Adding jsps displayed after connectionwhen connection is successful

  • Add jsp name dbtest.jsp


Adding jsp displayed after connection when connection is not successful

Adding jsp displayed after connectionwhen connection is not successful

  • Add jsp name error.jsp


Adding jsps displayed after connection

Adding jsps displayed after connection

  • Add jsp name error.jsp(provided here)

    • Use request.getAttribute() to get the value of attribute “exception” (this attribute was saved to the response object in DBTestServlet)

    • Prints error message and stack trace in this attribute


Summary

Summary

What we have learned:

  • Created a Web project with NetBeans

  • The project, using Model-View-Controller architecture, demonstrates how to:

    • Use JSPs and a HTML form to collect data from the user.

    • Use a JavaBean class to represent user data.

    • Store and Access data from JavaBean in JSPs and servlets.

    • Connect to a database from a servlet, using a DAO object to interface with the database.


Further self study

Further self study

  • Java Programming

  • HTML

  • JSP Programming

  • Model View Controller(MVC) architectural pattern as it applies to JSP programming


References

References

Sample Code for this lab was written by Prof. WojciechGolab

Java, JSP and JDBC

The Java Tutorials

The Java Tutorial - Trail: JDBC(TM) Database Access

Introduction to Java Server Pages(JSP)

 Web Application Development

The Java EE 6 Tutorial

Tutorial - Creating a Simple Web Application Using a MySQL Database  (using NetBeans)


References1

References

  • Reference for html

    www.w3schools.com

  • Reference for MVC and JSPs:

    http://netbeans.org/kb/docs/javaee/ecommerce/design.html?print=yes

  • Ref for DAO :

    http://en.wikipedia.org/wiki/Data_access_object


  • Login