Xem mẫu
- A JAVA WEB-BASED APPLICATION FOLLOWING
MVC ARCHITECTURE
SVTH: Vũ Hoàng Việt, Nguyễn Tiến Sơn,
Phạm Thu Dung, Bùi Thị Thanh Huyền,
Phạm Thị Hằng, Nguyễn Thị Chung
GVHD: ThS Nguyễn Thùy Linh
Tóm tắt - Với sự phát triển mạnh mẽ của công nghệ 4.0 trên toàn thế giới, các ngôn ngữ lập
trình như Java, JavaScript, C ++, ... ngày càng được cải tiến và mở rộng. Do đó, có rất nhiều ứng
dụng đáng kinh ngạc được tạo ra bằng các ngôn ngữ lập trình này. Trong bài báo này, nhóm phát
triển sẽ thảo luận về Trang web thương mại điện tử DrinkStore - một ứng dụng dựa trên web Java
theo Kiến trúc MVC và chứng minh kết quả của việc triển khai kiến trúc.
Abstract - With the strong development of 4.0 technology in the whole world, programming
languages such as Java, JavaScript, C++,... are increasingly improved and expanded. Therefore,
there are a lot of incredible applications created using these programming languages. In this paper,
the development team will discuss about the DrinkStore Ecommerce Website - a Java web-based
application following MVC Architecture, and demonstrate the result of architecture implementation.
Keywords: Java, Java Servlet, MVC Architecture, web-based application, DrinkStore
Ecommerce Website.
I. Introduction
Drinks are an indispensable part of everyone’s life, most grocery stores sell a variety of
drinks. Drinks quench people’s thirst, making the meal more enjoyable and delicious. From
1990 on, the total volume of drinks consumed globally each year is in excess of over twenty
billions of liters. Because of Covid-19, more and more people prefer online shopping instead
of going to the store to limit the contact with other people. Many stores have started to
develop an ecommerce website to sell products online. Ordering online has a lot of
advantages: (1) convenience - people do not need to go outside to buy drinks, the disabled can
buy products when they can not travel, (2) contact limitation - decrease contact with other
people, limit the spread of disease. As a group of 6 university students studying Software
Engineering II, the development group decided to create a Web application to support people
ordering drinks online, based on Java Web Technology. The application provides customers’
side for ordering products and administrators’ side for selling products and tracking orders.
This report will provide an insight into the development of the application itself: how the
application was developed, what was well done, and what was not, along with possible
improvements to the application in the future. The website will use SQL Server to store the
database and Glassfish Server 4.1.1 to run the application. This report will provide an insight
into the development of the application itself: how the application was developed, what was
122
- well done, and what was not, along with possible improvements to the application in the
future.
II. Main content
1. Software Development Lifecycle (SDLC)
In this project, the project team decided that Waterfall SDLC should be used for
developing the application, as the Waterfall model is easy to understand and follow and the
steps in the model are clearly defined. However, the group did not apply Waterfall straight-
away but modified the model slightly to cope with the greatest downside of the SDLC which
is inflexibility. Therefore, the group applies a hybrid model, in which, while the steps remain
the same as in the Waterfall model, feedback is added in every phase – the result of a previous
phase can be changed if it does not work well with a later phase. Moreover, in later phases
like implementation and testing, there are additionally several iterations, which are to ensure
that features are working well on their own by testing and new features do not break the
operation of existing features. To sum up, here is the shortened list of phases in our project’s
SDLC:
● Requirements Analysis
● Design
● Implementation (carried out in iterations)
● Testing (carried out at the same time as Implementation and also in iterations)
● Deployment
It is important to have knowledge of the development lifecycle chosen in developing
this project as the report will be going through every phase.
2. Requirements Analysis
The purpose of this part is to describe the business requirement of the system
completely accurately and unambiguously. All attempts have been made in using mostly
business terminology and business language while describing the requirements on this part.
Very minimal and commonly understood technical terminology is used. Use-case diagrams
were employed to capture the functionalities which are considered in the requirements of this
website.
This project requires designing a website application which is used to help users in
online shopping. As a result, there are two main users, which are the administrator and normal
user:
● The administrator: login into this system and play an essential role:
123
- - Manage products: administrator can view, add, edit and delete products.
- Manage category: administrator can view, add, edit and delete categories.
- Manage orders: administrator can view list of orders from customers.
- Manage feedback: administrator can view list of feedback from customers.
- Manage account: administrator can update profile.
● The normal user: Users can access the website, register, login, and order products.
They can also update their profile, search for products, and track their orders.
3. Design
3.1. Database Design
In Database Design, data models of the system are identified based on Entity
Relationship Diagram.
Figure 1 – ER diagram
Each table represents different task with own attributes and relationship between other
tables:
● Users table: used to store the information of customers such as: username, password,
email, phone, and address.
● Orders table: used to store information about orders of customers with 5 attributes:
ID, quantity, total price, productID and username.
● Feedback table: used to contain the feedback of customers with username, phone,
email, content.
124
- ● Categories table: used to store information about categories, each category may
contain many products.
● Products table: used to store information about products.
3.2. Backend Design & Class Diagram
The backend was designed based on the Model-View-Controller (MVC) pattern with a
few modifications:
● The view in MVC is removed due to the Presentation layer being responsible for
View and it is totally separated from the application layer.
● The Controller Layer is divided into Controller and Use-case Layer.
In our project, the UML Class diagram was employed in the Design phase in order for
coders to have a better view of how they will implement the system. The Class Diagram
shows how objects will be implemented as well as their relationships. According to the MVC
design pattern, UML Class Diagram will be divided into a detailed package to implement
exactly what standards were given by the requirement plan before.
Figure 2 – DrinkStore source package
125
- In the DrinkStore ecommerce website, there are three main packages: DAO, Model and
Servlet (Controller) which will represent the overview of the whole project. Each package
plays different roles but has a relationship with each other. The Model Package was
developed first and used by the DAO package. Subsequently, the Servlet package was
developed using two existing packages.
● Model package
Figure 3 - Model Package
Model package stores all of the application's data. Model shown in the form of a
database or sometimes simply an ordinary XML file. Model clearly shows operations with the
database such as allowing viewing, accessing, processing data, …
● DAO Package
Figure 4 - DAO Package
126
- This package is a pattern in which objects are intended to communicate with the
Data Layer. These objects are usually initialized for the purpose of
"SessionFactories". And handles all of the logic behind communicating with the
database.
● Servlet package
Figure 5 - Servlet Package
Servlet plays a role in receiving the request and returning the response to the client. In
addition, servlet will direct the request to the controller to process and return back to servlet.
3.3. Frontend Design
In this project, the frontend design uses JSP (JavaServer Pages) consisting of HTML
markup embedded with JSP tags, together with CSS for style and a small part of JavaScript
client-side script to handle UI logic.
Java Server Pages (JSP) is a server-side programming technology that enables the
creation of dynamic, platform-independent methods for building Web-based applications. JSP
has access to the entire family of Java APIs, including the JDBC API to access enterprise
databases.
For example, an administrator view is created by some JSP file including view
feedback, update product, update category, manage product, manager order, manage user,
manager category, add category, add product, account, search.
127
- Figure 6 - Product Management Page of Admin
Figure 7 - Home page of DrinkStore Website
4. Implementation
The implementation was carried out according to features of the website, for example
we implement the homepage and functions register, login, logout first, then then implement
the functions on the admin side and the customer side later. Because we have lessons together
almost every day, it is very convenient for discussing, assigning tasks , supervising each
member’s work.. The contribution of group members in each implementation phase can be
seen in the following table.
5. Testing
5.1. Testing Summary
In this project, two testing techniques were employed. JUnit Testing is used to
128
- automatically test for backend components whether the components can run well or not.
There is also manual testing when the group completes a certain phase to make sure that this
stage does not have any errors and works in a similar way with visualization of the developer.
Finally, manual testing is also carried out to test user interaction with the application to ensure
that the application works perfectly in a production environment.
5.2. Test Plan & Test Evaluation
The test plan is done at the same time as the execution phase to test and ensure the
correct operation is required. Software components are checked and modified during
execution. The final plan includes test cases that compare expected results and actual test
results to present, summarize and evaluate the functionality of the final product. In our team
project, this test plan is written in the Excel file which is named “Test Case” in this folder.
Each test case contains 11 features: Test Case ID, Sprint, Purpose, Preconditions,
Precondition Details, Steps, Step Details, Expected Result, Actual Result, Status and
Comment. There are 45 test cases designed with 23 test cases for administrator and 22 test
cases for normal users, and all test cases are passed.
6. Evaluation
6.1. Advantages
- First, the system's interface is very user-friendly, with detailed and genuine images,
helping to increase the reliability of customers and help customers easily visualize the product
they are looking for.
- The system shows the products of the same type on the same page, helping customers
see the products they are interested in more overall. The website also has a search bar for
customers to have more options.
- Access time to the website is relatively fast, is constantly checked and repaired.
- Function of customer interaction with admin is built (feedback).
- The system has deployed core functions for admin and customer:
● Admin : Manage product, Manage category, Manage user, Manage order, Manage
feedback, Update profile.
● Customer: Login, Logout, Register, Make order, Leave feedback, and view product
details.
- Moreover, getting a near real-time update for the database is supported in the project.
6.2. Limitations
129
- - Although there is a lot of time to plan or start working, the project still lacks certain
functions such as filters and payment methods.
- Teamwork has not reached the maximum efficiency, there are times of arguments and
disagreements, but we have all overcome this and did not cause too many difficulties during
the project implementation.
6.3. Future work
- A more complex, full attribute filter is applied: popularity (new product, best
seller, ..), price (high to low or low to high). Combining many attributes together will make it
easier for customers to find products.
- Various forms of payment such as card payment, payal or something like that will be
added so that customers can make purchases more convenient.
- Update to confirm order by phone or email to customers, to prevent many different
cases occurring from customers or objective factors (weather, shipping unit ...)
The development team also considers developing the website not only in a category
called "Drink Store" but also in adding many other related areas such as furniture, decorative
tools or creating a similar app that allows users to download electricity. mobile phone, giving
them more options in their shopping.
III. Conclusion
Software engineering is increasingly developed and expanded to match with the global
development of 4.0 technology. In this paper, we have discussed creating an Ecommerce
website for selling products. This website follows the MVC Architecture which contains
Model, View, Controller (Servlet), and DAO service. DrinkStore website uses Java
programming language which is built on NetBeans desktop-based application. We use SQL
Server to store the database and Glassfish Server 4.1.1 to run the project. Project’s front-end
is built with JSP which contains HTML, CSS and Java. The resulting website - the DrinkStore
Ecommerce Website - may not be the fastest web application for development, and
performance may not be good enough for a large number of users at once, but it did
demonstrate where good architecture is, the complete separation between front-end and back-
end service. In the future, more work will be done to ensure high efficiency, and more useful
functions will be added to increase the usability of the application.
130
nguon tai.lieu . vn
