This assignment is intended to familiarize students with Servlet/JSP web development. The goal is to use the MVC design pattern to structure your web application as MVC pattern is considered as the best practice. The assignment assumes student familiarity with static HTML design and will involve use of JSP pages for the presentation, servlets for the controller and JavaBeans for the business logic.
Assignment Description:
In this assignment, you will develop JSP/Servlet pages using the MVC pattern, according to the following specifications:
Correct any errors identified in the selected HTML5 prototype before proceeding. - If your application developed in assignment 1 has error and not complete it is
your responsibility to communicate and coordinate with course staff to help fix those bugs. Keep in mind that all that you are building in this application in stages. It is important that you have a working application for each stage.
All structure, design, and content requirements from the previous assignment are mandatory, unless explicitly updated in this assignment description.
Use JavaBeans to implement the business layer of the application (model).
Use JSP pages to present the view to the browser.
Use Servlet pages to control the flow of the application.
1. Convert Existing Pages to JSP (View Prototypes)
As an initial step, convert all 4 pages from the first assignment from HTML5 (.html) to JSP.
- This is as simple as make a copy of the file with the ".jsp" extension.
Remember that HTML code for all pages generated from JSPs must still meet the HTML5 validation requirement.
- You can use "view page source code" in your browser to see the rendered HTML response sent by the server for each view.
- To validate JSP pages launch your application > navigate to the page you wish to validate > right click > view page source > copy all > paste into validator.w3.org 'Validate by Direct Input'.
2. Create Module Views
We want to centralize the common aspects of the views by creating partials for those common pieces and then adding (include) them where we need them.
- Separate the common design elements for header, footer, and navigation into individual.jsp files.
- For example: header.jsp, navigation.jsp, footer.jsp
- For each of the 4 main pages
- Remove the common design element content from the page
- Use a JSP include directive or include action to re-include that content from the individual files. Do not use JSTL imports.
3. Add New JSP Site Pages Linked from General Navigation
If not already part of the project, add the following pages using the required site structure.
- about.jsp – provides background and detail about the application site.
- contact.jsp – provides contact details for the application site.
Update links to About and Contact to render those views.
4. Add New JSP Site Page for Creating a New Connection
Create a new (static, design prototype) JSP page that allows a user to create a new connection.
Filename: newConnection.jsp
5. Create JavaBeans for Business Objects (Model)
This assignment will make use of JavaBeans for the Model, in order to represent the main data elements / business objects being used. Remember that a JavaBean is a Java class that (1) provides a zero-argument constructor; (2) provides get and set methods for all of its private instance variables that follow standard Java naming conventions; and (3) implements the Serializable interface. Create a JavaBean (Connection.java) to represent a connection as a Model elementwith the specified instance variables and additional methods.
This model is used to represent a connection in the application. It should include the properties/attributes that define a connectionas well as the methods to support accessing these properties.
- connection ID– unique identifier for the connection, you should select a sensible format (e.g., alphanumeric string with some specific pattern) that will be standard across your connections.
- connection name
- connection topic - this is the category/topic that will be used to select or arrange connection by section or type in the connections view.
- details
- date and time
6. Create Utility Classes for Persistent Data
Create a utility class to support data retrieval called ConnectionDB with following requirements and methods:
- Includes a hard-coded set of connection details (your choice on how to represent internally, but must be converted into a list/collection of connection objects when required)
- Includes a method called getConnections() that returns a set of all the connections in the hardcoded “database”
- Includes a method called getConnection(connection ID) that returns the connection with the specified ID from the hardcoded “database” . Rather than having the controller filter the complete connection list each time a connection is requested you should encapsulate this functionality in a method that can me called when needed.
For initial development, we will use a hard-coded “database” to represent your initial set of connections. You should hard-code a fixed set of connections within the following module. Do this through creating functions that return connection objects.
As in the first assignment, you must have at least 2 categories of connections, with at least 3 connections per category/topic. Note that this means you will need to create the individual data for the additional connections, since there was only individual data for one representative connection required in the first assignment.
Note: It is important to keep the big picture in perspective here. In part 4 of this application we will be converting the data storage to a database platform. We will refactor these functions to support database connectivity and query. This will separate the data layer from the application and will allow for easy updates and interaction. At this stage we just need to read/retrieve the data so we will read it from a function.
7. Create Servlet for Business Logic (Controller)
For this assignment, you will implement a limited part of the dynamic functionality for the connections and connection views. You must use ONLY the http request object to pass data.
Implement the following Controller servlet to operationalize the business logic. You will need to send parameters as part of the GET or POST http requests from link / button / form submissions as the context information that tells the controller how to proceed.
Connection Controller
This controller is responsible for handling and directing requests that pertain to displaying the categories of connections (catalog) and individual connection details. An application user should be able to navigate to a view that lists all connections saved in the application (connections.jsp) as well as navigate to a page providing connection details from the connections page (connection.jsp). The connection controller will be utilized to create the flow of the application.
This controller is responsible for handling the following two requests:
- for a request to view the complete list of connections this controller responds by bringing all connection models from the database and sending that data to the connections view for display.
- for a request to view a single connection this controller responds by bringing the requested connection model from the database and sending that data to the connection view for display.
Part of handling these request is addressing scenarios when a request comes in that doesn't meet the requirements for these requests. The controller logic should verify and validate each request. If there are any parameters coming in with the request the controller should verify that they contain values that are expected by the application and it can handle. For example if a request comes in with a connection code and that value is not for a connection code that exists in the connection database the controller should gracefully handle it in a way that will allow the user to continue interacting with the application. In this example, displaying the connections view would be a valid response.
As we are starting to put logic into the application and connecting this logic to the different views (webpages) we've designed it is important to know and keep in mind that users can interact (send requests and receive responses) from any application that in on the world wide web without necessarily using the webpages that are tied to the application. A user can simply send a request to a web-based application using the command line for example. Do not rely on users using only the links that are implemented in the application views.
Sample Basic Pseudocode:
- Loads the catalog / database of connections.
- save the catalog of connections by calling the getConnections()function
- Checks the http request for a parameter called “connectionID”
- If there is a connectionID parameter, validate that its value matches your connection ID format and is a valid connection ID.
- If the connection ID is valid
- Add an object for the specified connection to the http request object
- Dispatch to the correct JSP view forindividual connection display
- If the connection code is not valid, display the catalog as if no code had been provided
- If there is no connection ID parameter, dispatch to the correct JSP view forconnectionsdisplay. Display the full connections listing, separated by category/topic as in the first assignment, but with entries created dynamically from the connections list
8. Update JSP Views to Include Dynamic Content From Bean Data
The connections and connection views will now receive some kind of dynamic data. JSP views to replace all of the static placeholder information with the dynamic data using JSP functionality to access bean data being passed from the controller.
9. Update Button Actions and Links in the Site to Dispatch Correctly
Each of the places in the site where a user can take an action that uses the dynamic data from this assignment should be updated to make the appropriate link or GET or POST request with the necessary parameters. Remember that requests for resources such as links should be using GET method and any requests that sends data such as form submissions must use POST. Updates must be made in all appropriate places where action would reasonably be indicated from the first assignment prototypes. For example: the links a connection in connections.jsp will need to be dynamic to load the correct item.