ĐỒ ÁN TỐT NGHIỆP: Đề tài Xây dựng website bán hàng online

MỤC LỤC
ẢNH
Hình 1.1. Cấu trúc trang HTML
.............................................................................................................................................
..5

Hình 1.2. Cấu trúc Spring Framework
.............................................................................................................................................
..6

Hình 2.1. Sơ đồ Use-case
.............................................................................................................................................

10
Hình 2.2. Mô hình cơ sở dữ liệu
.............................................................................................................................................

12
Hình 2.3. Bảng Authors
.............................................................................................................................................

12
Hình 2.4. Bảng Books
.............................................................................................................................................

13
Hình 2.5. Bảng Categories
.............................................................................................................................................

13
Hình 2.6. Bảng Detail_Orders

.............................................................................................................................................

13
Hình 2.7. Bảng Coupons
.............................................................................................................................................

14
Hình 2.8. Bảng Orders
.............................................................................................................................................

14
Hình 2.9. Bảng Payments
Trang 1


.............................................................................................................................................

14
Hình 2.10. Bảng Publishers
.............................................................................................................................................

14
Hình 2.11. Bảng Roles
.............................................................................................................................................

15
Hình 2.12. Bảng Sildes
.............................................................................................................................................

15

Hình 2.13. Bảng Users
.............................................................................................................................................

15
Hình 2.14. Giao diện trang chủ
.............................................................................................................................................

16
Hình 2.15. Giao diện trang chi tiết sản phẩm
.............................................................................................................................................

16
Hình 2.16. Giao diện trang phân loại sách
.............................................................................................................................................

17
Hình 2.17. Giao diện trang đăng ký
.............................................................................................................................................

17
Hình 2.18. Giao diện trang đăng nhập
.............................................................................................................................................

18
Hình 2.19. Giao diện trang quản lý tài khoản
.............................................................................................................................................

18
Hình 3.1. Thực hiện chức năng Đăng ký
.............................................................................................................................................

19
Trang 2


Hình 3.2. Thực hiện chức năng Đăng ký lỗi
.............................................................................................................................................

20
Hình 3.3. Tài khoản đã tồn tại
.............................................................................................................................................

20
Hình 3.4. Đăng ký thành công
.............................................................................................................................................

20
Hình 3.5. Tìm kiếm sản phẩm
.............................................................................................................................................

21
................................................................................................................................
Hình 3.6. Đặt mua
.............................................................................................................................................

21
................................................................................................................................
Hình 3.7. Giỏ hàng
.............................................................................................................................................

22
................................................................................................................................
Hình 3.8. Thêm sản phẩm vào giỏ hàng
.............................................................................................................................................

22
................................................................................................................................
Hình 3.9. Quản lý tài khoản
.............................................................................................................................................

23
................................................................................................................................
Hình 3.10. Quản lý đơn hàng
.............................................................................................................................................

23
................................................................................................................................

Trang 3


DANH SÁCH TỪ VIẾT TẮT

Từ viết tắt

Diễn giải

HTML

Hypertext Markup Language

CSS

Cascading Style Sheets

POJO

Plain Old Java Object

API

Application Programming Interface

URL

Uniform Resource Locator

DI

Dependency Injection

SpEL

Spring Expression Language

SQL

Structured Query Language

GUI

Graphical user interface

Trang 4


MỞ ĐẦU
1. TỔNG QUAN VỀ ĐỀ TÀI

Ngày nay, công nghệ thông tin đã và đang đóng vai trò hết sức quan trọng
trong đời sống kinh tế, xã hội của nhiều quốc gia trên thế giới, là một phần không
thể thiếu trong một xã hội ngày càng hiện đại hoá. Khi khách hàng muốn tìm kiếm
thông tin về sản phẩm, dịch vụ nào đó họ sẽ ngay lập tức vào google để tìm kiếm.
Website sẽ là nơi lưu trữ tất cả những thông tin cần thiết cho khách hàng.
Tùy từng lĩnh vực kinh doanh của từng doanh nghiệp mà website mang lại
những lợi ích khác nhau. Trang web trở thành một cửa ngõ để doanh nghiệp tiếp thị
sản phẩm của mình tới khách hàng trên toàn thế giới.
Đặc biệt trong lĩnh vực bán sách vốn đã khó khăn khi hiện nay nhu cầu đọc
sách online (ebook) đang tăng mạnh thì nhu cầu bán sách truyền thống càng phải
được đẩy mạnh để không làm mất đi nét đẹp của văn hóa đọc cũng như doanh thu
của các nhà sản xuất.
Chính vì lý do đó chúng em đã chọn đề tài: Xây dựng Website bán sách
online.
2. MỤC ĐÍCH VÀ Ý NGHĨA CỦA ĐỀ TÀI
2.1.

Mục đích

-

Website có nội dùng hấp dẫn, đầy đủ, phù hợp với mọi đối tượng sử dụng.

-

Website được sắp xếp, bố cục một cách hợp lý, tạo điều kiện cho người đọc
dễ định hướng trong website.

-

Website có hình thức đẹp phù hợp với chủ đề, nội dùng, thân thiện với
người dùng.
Trang 5


Ý nghĩa

2.2.

Ngày nay, việc xây dựng một website bán sách online mang lại rất nhiều lợi
ích:
Về tổ chức: Giúp cơ hội kinh doanh mở rộng. Cơ hội quảng bá không giới

-

hạn, công việc kinh doanh mở cửa 24h/ngày. Website chính là một văn
phòng giao dịch kinh doanh luôn mở cửa 24h/ngày, 7 ngày/tuần và 365
ngày/năm. Giảm thiểu tối đa thời gian quản lý.
Về kinh tế:

-

• Thay vì phải gửi Catalogue sách bằng giấy hoặc đĩa CDROM cho

khách hàng, khách hàng có thể tự truy cập và tìm kiếm trên website với
những thông tin còn cặn kẽ và đầy đủ hơn ở Catalogue
• Mọi thứ ở cửa hàng sách online đều được thực hiện một cách chính xác

và hoàn toàn tự động. Chi phí để có được một website quá nhỏ bé so
với những chi phí phải bỏ ra để quảng bá các hoạt động của cửa hàng
bằng những phương tiện truyền thống.
3. PHƯƠNG PHÁP THỰC HIỆN

-

Phương pháp phân tích tổng hợp từ tài liệu bao gồm tạp chí và báo cáo
khoa học, tác phẩm khoa học, tài liệu lưu trữ thông tin đại chúng, mạng
xã hội…

-

Phương pháp phân tích thiết kế hệ thống: sử dụng các sơ đồ dòng dữ liệu
để mô tả các yêu cầu đối với hệ thống (use case,…)

4. BỐ CỤC CỦA ĐỀ TÀI

Báo cáo đề tài bao gồm các nội dung sau:
Mở đầu
Chương 1: Cơ sở lý thuyết về html, css, java spring
Trang 6

Chương 2: Phân tích thiết kế hệ thống
Chương 3: Triển khai và đánh giá kết quả
Kết luận và hướng phát triển.
5. PHÂN CÔNG TỔ CHỨC CÔNG VIỆC
5.1.

Front-End
Người làm

Phần đóng góp
1) Giao diện trang chủ

Huỳnh Hoàng Đức

2) Giao diện trang chi tiết sản phẩm
3) Giao diện giỏ hàng
4) Thu thập thông tin sách

1) Giao diện trang phân loại sản phẩm

Lê HồngVân

2) Header, footer
3) Viết và chỉnh sửa báo cáo

1) Giao diện trang thanh toán

Bùi Thế Dinh

2) Giao diện trang quản lí tài khoản
3) Giao diện trang đăng nhập, đăng kí
4) Thu thập hình ảnh

Trang 7


5.2.

Back-End
Người làm

Phần đóng góp
1) Vẽ use-case

Lê Bá Vỹ

2) Lập trình chức năng: quản lý user, đơn hàng, hình

thức thanh toán, sliders
3) Giao diện trang admin

1) Thiết kế data-base

Hoàng Văn Việt

2) Lập trình chức năng: quản lý danh mục, sách,

truyện, tác giả, nhà phân phối
3) Giao diện trang admin

Trang 8


CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1.1. GIỚI THIỆU HTML VÀ CSS
1.1.1. Cấu trúc chung của một trang HTML:

Mỗi trang web đều có cách thể hiện cấu trúc khác nhau, có trang 1 cột, có
trang 2 và cũng có trang chứa nhiều cột, bên dưới đây là tham khảo một trang đơn
giản sử dụng 2 cột để layout.
-

Phần đầu: header, có thể chứa logo, câu slogan, các liên kết, các banner
liên kết, các button, đoạn flash, hoặc các form ngắn như form tìm kiếm,...

-

Phần liên kết toàn cục: global navigation, dùng để chứa các liên kết đến
những trang quan trọng trong toàn bộ trang, trong phần này có thể chứa
thêm các liên kết con (sub navigation).

-

Phần thân của trang: page body, phần này chứa phần nội dung chính
(content) và phần nội dung phụ (sidebar).

-

Phần nội dung chính: content, phần này chứa nội dung chính cần thể

hiện cho người dùng xem.

-

Phần nội dung phụ: sidebar, phần này có thể chứa liên kết phụ của từng
trang (local navigation), hoặc các banner chứa liên kết liên quan, hoặc có
thể dùng để chứa các liên kết quảng cáo,...

-

Phần cuối trang web: footer, phần này thường chứa phần liên hệ như:
tên công ty, địa chỉ, số điện thoại, mail liên hệ,... và đặc biệt là copyright,
hoặc có thể chứa các liên kết toàn trang, các banner liên kết,...

Trang 9


Hình 1.1 Cấu trúc trang HTML
1.1.2. Các thẻ HTML cơ bản:
-

Các thẻ hiển thị đầu đề (heading):

,

,

,

,

,

-

Thẻ biểu diễn đoạn văn

-

Thẻ ngắt dòng

-

Thẻ <body> xác định phần tử body (thân)

-

…

1.1.3. Giới thiệu sơ lược về CSS:
-

CSS là một file có phần mở rộng là .css, với nhiệm vụ là tách riêng phần định
dạng (style) ra khỏi nội dung trang HTML.

-

Sử dụng css cho phép dễ dàng quản lý nội dung trang HTML, dễ điều khiển
phần định dạng, và đặc biệt là sẽ tốn ít thời gian khi code hay chỉnh sửa.

Trang 10


1.2. GIỚI THIỆU SPRING FRAMEWORK
1.2.1. Cấu trúc chung của một trang HTML:
Ngày nay, Spring đã trở thành framework mã nguồn mở phổ biến nhất để xây
dựng các ứng dụng doanh nghiệp. Theo một số nguồn, trên 50% các ứng dụng web
Java hiện nay đang sử dụng Spring.
Để ngăn chặn sự phức tạp trong phát triển các ứng dụng, Spring Framework
thường dựa trên các quan điểm như sau:

-

Đơn giản hóa công việc phát triển thông qua việc sử dụng các đối tượng
Java đơn giản hay còn được gọi là POJO

-

Nới lỏng ràng buộc giữa các thành phần thông qua việc sử dụng
Dependency Injection và viết các interface

-

Tiếp cận lập trình khai báo bằng cách sử dụng các quy tắc và các khía
cạnh chung

-

Giảm thiểu các mã nghi thức và soạn sẵn thông qua việc sử dụng các
khuôn mẫu và các khía cạnh

1.2.2. Cấu trúc của Spring Framework

Hình 1.2 Cấu trúc của Spring Framework
Trang 11


Spring Core: là thành phần trung tâm, cốt lõi của Spring Framework.

-

Đây chính là nền tảng để xây dựng nên các thành phần khác.
-

Spring Bean: có thể được hiểu là các đối tượng Java đơn giản.

-

Dependency Injection (DI): là một mẫu thiết kế phần mềm mà các đối
tượng phụ thuộc sẽ được inject vào một lớp nào đó.
Spring Context: kế thừa các tính năng của Spring Bean và bổ sung các

-

hỗ trợ cho internationalization (ví dụ như các resource bundle), event
propagation, resource loading ...
Spring Expression Language (SpEL): là một ngôn ngữ ngắn gọn giúp

-

cho việc cấu hình Spring Framework trở nên linh hoạt hơn.
Các dự án trong Spring Framework:

•

Spring MVC: được thiết kế dành cho việc xây dựng các ứng dụng nền
tảng web

•

Spring Data: cung cấp một cách tiếp cận đúng đắn để truy cập dữ liệu

từ cơ sở dữ liệu quan hệ, phi quan hệ, map-reduce và thậm chí còn hơn
thế nữa.

•

Spring Security: cung cấp các cơ chế xác thực (authentication) và
phân quyền (authorization) cho ứng dụng

•

Spring Batch: giúp chúng ta tạo các lịch trình (scheduling) và tiến
trình (processing) cho các công việc xử lý theo lô (batch job).

•

Spring Integration: thiết kế một kiến trúc hướng thông điệp hỗ trợ
việc tích hợp các hệ thống bên ngoài.

•

Spring Social: dự án này sẽ kết nối ứng dụng của bạn với các API bên
thứ ba của Facebook, Twitter, Linkedin ...

Trang 12


1.3. CƠ SỞ DỮ LIỆU MYSQL
1.3.1. Giới thiệu về cơ sở dữ liệu MySQL:
-

MySQL là hệ quản trị cơ sở dữ liệu tự do nguồn mở phổ biến nhất thế
giới và được các nhà phát triển rất ưa chuộng trong quá trình phát triển
ứng dụng.

-

MySQL là một trong những ví dụ rất cơ bản về Hệ Quản trị Cơ sở dữ liệu
quan hệ sử dụng Ngôn ngữ truy vấn có cấu trúc (SQL).

-

MySQL được sử dụng cho việc bổ trợ PHP, Perl, và nhiều ngôn ngữ khác,
nó làm nơi lưu trữ những thông tin trên các trang web viết bằng PHP hay
Perl,…

1.3.2. Tại sao lại sử dụng MySQL?
Vì MySQL có những đặc điểm nổi bật sau:
-

Tốc độ: MySQL là cơ sở dữ liệu nhanh nhất mà bạn có thể có.

-

Dễ sử dụng: là một hệ thống cơ sở dữ liệu rất đơn giản và ít phức tạp khi
cài đặt và quản trị hơn các hệ thống lớn .

-

Giá thành: miễn phí cho hầu hết.

-

Hỗ trợ ngôn ngữ truy vấn

-

Năng lực: nhiều client có thể truy cập đến server trong cùng một thời
gian.

-

Kết nối và bảo mật: kiểm soát quyền truy cập cho nên người mà không
nên nhìn thấy dữ liệu của bạn thì không thể nhìn được.

-

Tính linh động: MySQL chạy trên nhiều hệ thống UNIX cũng như không
phải UNIX chẳng hạn như Windows hay OS/2. MySQL chạy được các
với mọi phần cứng từ các máy PC ở nhà cho đến các máy server.

-

Sự phân phối rộng

-

Sự hỗ trợ: từ cộng đồng MySQL

Trang 13

CHƯƠNG 2: PHÂN TÍCH VÀ THIẾT KẾ
2.1. PHÂN TÍCH HỆ THỐNG
Hệ thống sẽ chia thành 2 nhóm chức năng chính:
-

Chức năng dành cho khách hàng

-

Chức năng dành cho người dùng

-

Chức năng dành cho quản lý cửa hàng

Các chức năng được thể hiện trong sơ đồ use-case dưới đây

Hình 2.2. Sơ đồ Use-case
2.1.1. Chức năng dành cho khách hàng
-

Đăng ký: Chức năng cho phép khách hàng đăng ký vào hệ thống. Khi
khách hàng click nút Đăng ký thì hệ thống sẽ chuyển sang trang đăng ký.
Có thể lựa chọn đăng ký qua Facebook hoặc tạo tài khoản
Trang 14


-

Đăng nhập: Khi có tài khoản, khách hàng có thể đăng nhập vào thực hiện
các chức năng dành cho người dùng

-

Quên mật khẩu: Khách hàng có thể cài đặt lại mật khẩu của mình

-

Tìm kiếm sản phẩm: Tìm kiếm thông qua tên sách, tên tác giả, thể loại,
nhà xuất bản

-

Xem sản phẩm: Xem các thông tin chi tiết về sản phẩm như giới thiệu nội
dung, chủ đề, tác giả….

2.1.2. Chức năng dành cho người dùng
-

Xem hồ sơ cá nhân: Người dùng có thể thay đổi thông tin hồ sơ cá nhân
của mình nếu muốn như họ tên, số điện thoại, địa chỉ, ngày sinh

-

Quản lý đơn hàng: Người dùng có thể xem thông tin đơn hàng của mình
bao gồm các thông tin địa chỉ thanh toán, địa chỉ giao hàng, tên sách, số
lượng, tiền hoặc hủy đơn hàng nếu như đơn hàng chưa được xác nhận đã
giao thành công.

-

Quản lý giỏ hàng: Người dùng có thể thêm sản phẩm vào giỏ hàng hoặc
xóa sản phẩm ra khỏi giỏ hàng. Ngoài ra còn có thể thay đổi số lượng đặt
mua

-

Đăng xuất: Thoát tài khoản khỏi hệ thống

-

Thay đổi mật khẩu: Người dùng có quyền thay đổi mật khẩu nếu muốn

2.1.3. Chức năng dành cho quản lý cửa hàng
-

Quản lý đơn hàng: Quản lý có thể theo dõi các đơn hàng của khách hàng,
xóa đơn hàng nếu cần.

-

Quản lý sản phẩm: Thêm hoặc xóa sản phẩm, thay đổi thông tin sản
phẩm.

-

Quản lý user: Quản lý có thể xem user, quản trị viên hoặc xóa user.

-

Quản lý thể loại: Bao gồm tác giả, nhà phát hành…

Trang 15


2.2. THIẾT KẾ
2.2.1. Mô hình cơ sở dữ liệu

Hình 2.2 Mô hình cơ sở dữ liệu
2.2.2. Cấu trúc các bảng dữ liệu
-

BẢNG AUTHORS (Tác giả):

Hình 2.3 Bảng Authors

-

BẢNG BOOKS (Sách):

Trang 16


Hình 2.4 Bảng Books
-

BẢNG CATEGORIES (Thể loại):

Hình 2.5 Bảng Categories

-

BẢNG DETAIL_ORDERS (Chi tiết đơn đặt hàng):

Hình 2.6 Bảng Detail_Orders
-

BẢNG COUPONS (Mã giảm giá):
Trang 17


Hình 2.7 Bảng Coupons
-

BẢNG ORDERS (Đơn đặt hàng):

Hình 2.8 Bảng Orders
-

BẢNG PAYMENTS (Thanh toán):

Hình 2.9 Bảng Payments
-

BẢNG PUBLISHERS (Tác giả):

Hình 2.10 Bảng Publishers
-

BẢNG ROLES (Phân quyền):

Trang 18


Hình 2.11 Bảng Roles
-

BẢNG SLIDES (Hình ảnh sản phẩm):

Hình 2.12 Bảng Slides
-

BẢNG USERS (Người dùng):

Hình 2.13 Bảng Users

Trang 19


2.2.3. Thiết kế giao diện

Hình 2.14 Giao diện trang chủ

Hình 2.15 Giao diện trang chi tiết sản phẩm

Trang 20


Hình 2.16 Giao diện trang phân loại sách

Hình 2.17 Giao diện trang đăng ký

Trang 21


Hình 2.18 Giao diện trang đăng nhập

Hình 2.19 Giao diện trang quản lý tài khoản

Trang 22


CHƯƠNG 3: TRIỂN KHAI VÀ ĐÁNH GIÁ KẾT QUẢ
3.1. KỊCH BẢN
3.1.1. Người dùng
-

Đăng ký tài khoản mới. Thực hiện việc nhập vào thông tin tài khoản. Kiểm tra
trường hợp nhập sai, thiếu dữ liệu. Tiến hành đăng ký.

-

Tìm kiếm sản phẩm

-

Thực hiện việc đặt mua, thêm sản phẩm vào giỏ hàng, thanh toán

3.1.2. Quản lý
-

Thực hiện đăng nhập vào hệ thống quản lý website

-

Lựa chọn quản lý tài khoản thành viên. Kiểm tra các chức năng trong mục quản
lý thành viên (Cấp quyền cho tài khoản, Xóa tài khoản)

-

Lựa chọn quản lý đơn hàng

3.2. KẾT QUẢ THỰC HIỆN CÁC CHỨC NĂNG
3.2.1. Người dùng
a. Đăng ký:

Hình 3.1 Thực hiện chức năng Đăng ký
-

Xử lý được trang đăng ký. Cho phép kiểm tra các trường nhập vào có đầy đủ và
chính xác hay không.

Trang 23


Hình 3.2 Thực hiện chức năng Đăng ký lỗi
-

Tài khoản đã tồn tại trong hệ thống

Hình 3.3 Tài khoản đã tồn tại

-

Đăng ký thành công trả về trang chủ. Thay đổi và hiển thị tên người dùng đang
đăng nhập. Hiển thị Button đăng xuất

Hình 3.4 Đăng ký thành công

b. Tìm kiếm sản phẩm:
-

Nhập tên sản phẩm vào ô tìm kiếm. Khi nhận được kí tự, hệ thống sẽ đưa ra
những đề nghị trùng với kí tự đó
Trang 24


Hình 3.5 Tìm kiếm sản phẩm

c. Đặt mua, thêm sản phẩm vào giỏ hàng, thanh toán
-

Click vào Button Mua Ngay ở trang chi tiết sản phẩm thì sản phẩm sẽ được
thêm vào giỏ hàng

Hình 3.6 Đặt mua

Trang 25