ĐẠI HỌC ĐÀ NẴNG
PHÂN HIỆU TẠI KON TUM

SISAMOUND KAI

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG WEBSITE BÁN LAPTOP

Kon Tum, tháng 04 năm 2022


ĐẠI HỌC ĐÀ NẴNG
PHÂN HIỆU TẠI KON TUM

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG WEBSITE BÁN LAPTOP

GIẢNG VIÊN HƯỚNG DẪN : ThS. LÊ THỊ BẢO YẾN
SINH VIÊN THỰC HIỆN

: SISAMOUD KAI

LỚP

: K11TT

MSSV

: 17152480201019

Kon Tum, tháng 04 năm 2022


LỜI CÁM ƠN
Trước tiên với tình cảm sâu sắc và chân thành nhất, cho phép em được bày tỏ lòng
biết ơn đến tất cả các cá nhân và tổ chức đã tạo điều kiện hỗ trợ, giúp đỡ em trong suốt
quá trình học tập và nghiên cứu đề tài này. Trong suốt thời gian từ khi bắt đầu học tập
tại trường đến nay, em đã nhận được rất nhiều sự quan tâm, giúp đỡ của quý Thầy Cô
và bạn bè.
Với lòng biết ơn sâu sắc nhất, em xin gửi đến quý Thầy Cô ở Khoa Công nghệ đã
truyền đạt vốn kiến thức quý báu cho chúng em trong suốt thời gian học tập tại trường.
Nhờ có những lời hướng dẫn, dạy bảo của các thầy cô nên đề tài nghiên cứu của em mới
có thể hồn thiện tốt đẹp.
Một lần nữa, em xin chân thành cảm ơn thầy/cô – người đã trực tiếp giúp đỡ, quan
tâm, hướng dẫn em hoàn thành tốt bài báo cáo này trong thời gian qua.
Bài báo cáo đồ án tốt nghiệp thực hiện trong khoảng thời gian gần 4 tháng. Bước
đầu đi vào thực tế của em còn hạn chế và còn nhiều bỡ ngỡ nên khơng tránh khỏi những
thiếu sót , em rất mong nhận được những ý kiến đóng góp quý báu của quý Thầy Cô để
kiến thức của em trong lĩnh vực này được hồn thiện hơn đồng thời có điều kiện bổ
sung, nâng cao ý thức của mình.
Em xin chân thành cảm ơn!
SISAMOUD Kai


MỤC LỤC
CHƯƠNG 1. TỔNG QUAN ĐỀ TÀI...........................................................................1
1.1. TỔNG QUAN VẤN ĐỀ NGHIÊN CỨU ..............................................................1
1.2. LÝ DO CHỌN ĐỀ TÀI ..........................................................................................1
1.3. MỤC TIÊU NGHIÊN CỨU...................................................................................2

1.3.1. Lý thuyết ..........................................................................................................2
1.3.2. Về mặt công nghệ ............................................................................................2
1.3.3. Về mặt ứng dụng .............................................................................................2
1.4. PHƯƠNG PHÁP NGHIÊN CỨU .........................................................................2
1.4.1. Khảo sát thực tế ...............................................................................................2
1.4.2. Lý thuyết ..........................................................................................................2
1.4.3. Công nghệ ........................................................................................................3
1.5. PHẠM VI ỨNG DỤNG .........................................................................................3
CHƯƠNG 2. CƠ SỞ LÝ THUYẾT .............................................................................4
2.1. GIẢI PHÁP THIẾT KẾ .........................................................................................4
2.1.1. Mô hình Client - Server ..................................................................................4
2.1.2. Mơ hình MVC trong việc xây dựng website .................................................5
2.1.3. Mơ hình thương mại điện tử ..........................................................................7
2.2. CƠNG NGHỆ SỬ DỤNG ......................................................................................9
2.2.1. Ngơn ngữ lập trình PHP ...............................................................................10
2.2.2. Hệ quản trị cơ sở dữ liệu MySQL................................................................10
2.2.3. Công cụ Xampp .............................................................................................11
2.2.4. Visual Studio Code ........................................................................................12
2.2.5. Bootstrap ........................................................................................................13
CHƯƠNG 3. PHÂN TÍCH, THIẾT KẾ HỆ THỐNG VÀ KẾT QUẢ ...................14
3.1. ĐẶC TẢ YÊU CẦU ..............................................................................................14
3.1.1. Các tác nhân ..................................................................................................14
3.1.2. Yêu cầu chức năng ........................................................................................14
3.1.3. Yêu cầu phi chức năng ..................................................................................16
3.2. PHÂN TÍCH YÊU CẦU ......................................................................................16
3.2.1. Yêu cầu chức năng Admin ...........................................................................16
3.2.2. Yêu cầu chức năng khách hàng ...................................................................24
3.3. PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG........................................................28
3.3.1. Sơ đồ usecase .................................................................................................28
3.3.2. Sơ đồ tuần tự..................................................................................................44

3.3.3. Sơ đồ lớp.........................................................................................................65
3.3.4. Lược đồ cơ sở dữ liệu ....................................................................................68
CHƯƠNG 4. DEMO KẾT QUẢ ................................................................................71
4.1. FRONTEND ..........................................................................................................71
4.1.1. Giao diện trang chủ .......................................................................................71
i


4.1.2. Giao diện trang sản phẩm ............................................................................72
4.1.3. Giao diện xem chi tiết sản phẩm ..................................................................73
4.1.4. Giao diện đánh giá ........................................................................................74
4.1.5. Giao diện trang tìm kiếm..............................................................................74
4.1.6. Giao diện trang giỏ hàng ..............................................................................75
4.1.7. Giao diện thanh toán hàng ...........................................................................75
4.1.8. Giao diện đặt hàng thành công ....................................................................76
4.1.9. Giao diện liên hệ ............................................................................................77
4.1.10. Giao diện đăng nhập ...................................................................................77
4.1.11. Giao diện đăng ký........................................................................................78
4.1.12. Giao diện xem thông tin tài khoản ............................................................78
4.1.13. Giao diện chỉnh sửa thông tin tài khoản ...................................................78
4.1.14. Giao diện danh sách đơn hàng đã đặt .......................................................79
4.1.15. Giao diện xem chi tiết thông tin đặt hàng .................................................80
4.2. BACKEND ............................................................................................................80
4.2.1. Trang thống kê ..............................................................................................80
4.2.2. Trang quản lý tài khoản ...............................................................................81
4.2.3. Trang quản lý danh mục ..............................................................................82
4.2.4. Trang quản lý thương hiệu...........................................................................83
4.2.5. Trang quản lý sản phẩm ...............................................................................84
4.2.6. Trang quản lý đơn hàng ...............................................................................85
4.2.7. Trang quản lý slide........................................................................................88

4.2.8. Trang quản lý đánh giá ................................................................................89
CHƯƠNG 5. KẾT LUẬN ...........................................................................................90
5.1. KẾT LUẬN ...........................................................................................................90
5.1.1. Kết quả đạt được ...........................................................................................90
5.1.2. Hạn chế ...........................................................................................................91
5.2. HƯỚNG PHÁT TRIỂN .......................................................................................91
DANH MỤC TÀI LIỆU THAM KHẢO ...................................................................92
GIẤY XÁC NHẬN HOÀN THÀNH BÁO CÁO ĐÔ ÁN TỐT NGHIỆP

ii


DANH MỤC CÁC TỪ VIẾT TẮT
CSDL

: Cơ sở dữ liệu

iii


DANH MỤC CÁC BẢNG
Số hiệu bảng
2.1.
3.1.
3.2.
3.3.
3.4.
3.5.
3.6.
3.7.

3.8.
3.9.
3.10.
3.11.
3.12.
3.13.
3.14.
3.15.
3.16.
3.17.
3.18.
3.19.
3.20.
3.21.
3.22.
3.23.
3.24.
3.25.
3.26.
3.27.
3.28.
3.29.

Tên bảng
Các công nghệ được sử dụng
Mô tả các chức năng
Yêu cầu phi chức năng
Đặc tả sơ đồ usecase đăng nhập
Đặc tả sơ đồ usecase đăng ký tài khoản
Đặc tả sơ đồ usecase thêm tài khoản

Đặc tả sơ đồ usecase chỉnh sửa tài khoản
Đặc tả sơ đồ usecase xóa tài khoản
Đặc tả sơ đồ usecase thêm danh mục sản phẩm
Đặc tả sơ đồ usecase chỉnh sửa danh mục sản phẩm
Đặc tả sơ đồ usecase xóa danh mục sản phẩm
Đặc tả sơ đồ usecase thêm thương hiệu sản phẩm
Đặc tả sơ đồ usecase chỉnh sửa thương hiệu sản phẩm
Đặc tả sơ đồ usecase xóa thương hiệu sản phẩm
Đặc tả sơ đồ usecase thêm sản phẩm
Đặc tả sơ đồ usecase chỉnh sửa sản phẩm
Đặc tả sơ đồ usecase xóa sản phẩm
Đặc tả sơ đồ usecase thêm slide
Đặc tả sơ đồ usecase chỉnh sửa slide
Đặc tả sơ đồ usecase xóa slide
Đặc tả sơ đồ usecase thêm đánh giá
Đặc tả sơ đồ usecase chỉnh sửa đánh giá
Đặc tả sơ đồ usecase xóa đánh giá
Đặc tả sơ đồ usecase xóa đơn hàng
Đặc tả sơ đồ usecase hủy đơn hàng
Đặc tả sơ đồ usecase thêm sản phẩm vào giỏ hàng
Đặc tả sơ đồ usecase xóa sản phẩm khỏi giỏ hàng
Đặc tả sơ đồ usecase đặt hàng
Giải thích sơ đồ lớp
Giải thích lược đồ cơ sở dữ liệu

iv

Trang
9
14

16
28
29
29
30
31
31
32
32
33
34
34
35
36
36
37
37
38
39
39
40
41
42
42
43
43
65
68



DANH MỤC CÁC HÌNH
Số hiệu hình
2.1.
2.2.
2.3.
2.4.
2.5.
2.6.
2.7.
2.8.
2.9.
2.10.
3.1.
3.2.
3.3.
3.4.
3.5.
3.6.
3.7.
3.8.
3.9.
3.10.
3.11.
3.12.
3.13.
3.14.
3.15.
3.16.
3.17.
3.18.

3.19.
3.20.
3.21.
3.22.
3.23.
3.24.
3.25.
3.26.
3.27.

Tên hình
Mơ Client - Server
Mơ MVC
Luồng xử lý của mô MVC
Mô thương mại điện tử
Các mơ thương mại điện tử
Ngơn ngữ lập trình PHP
Hệ quản trị cơ sở dữ liệu MySQL
Công cụ Xampp
Phần mềm Visual Studio Code
Logo của Bootstrap
Sơ đồ usecase tổng quát
Sơ đồ usecase đăng nhập
Sơ đồ usecase đăng ký tài khoản
Sơ đồ tuần tự quản lý tài khoản
Sơ đồ usecase thêm tài khoản
Sơ đồ usecase chỉnh sửa tài khoản
Sơ đồ usecase xóa tài khoản
Sơ đồ usecase quản lý danh mục sản phẩm
Sơ đồ usecase thêm danh mục sản phẩm

Sơ đồ usecase chỉnh sửa danh mục sản phẩm
Sơ đồ usecase xóa danh mục sản phẩm
Sơ đồ usecase quản lý thương hiệu
Sơ đồ usecase thêm thương hiệu sản phẩm
Sơ đồ usecase chỉnh sửa thương hiệu sản phẩm
Sơ đồ usecase xóa thương hiệu sản phẩm
Sơ đồ usecase thêm sản phẩm
Sơ đồ usecase chỉnh sửa sản phẩm
Sơ đồ usecase xóa sản phẩm
Sơ đồ usecase quản lý slide
Sơ đồ usecase thêm slide
Sơ đồ usecase chỉnh sửa slide
Sơ đồ usecase xóa slide
Sơ đồ usecase quản lý đánh giá
Sơ đồ usecase thêm đánh giá
Sơ đồ usecase chỉnh sửa đánh giá
Sơ đồ usecase xóa đánh giá
Sơ đồ usecase quản lý đơn hàng
v

Trang
4
5
7
7
8
10
11
11
12

13
28
29
29
29
30
30
31
31
32
32
33
33
34
34
35
36
36
37
37
37
38
38
39
39
40
40
40



3.28.
3.29.
3.30.
3.31.
3.32.
3.33.
3.34.
3.35.
3.36.
3.37.
3.38.
3.39.
3.40.
3.41.
3.42.
3.43.
3.44.
3.45.
3.46.
3.47.
3.48.
3.49.
3.50.
3.51.
3.52.
3.53.
3.54.
3.55.
3.56.
3.57.

3.58.
3.59.
3.60.
3.61.
4.1.
4.2.
4.3.
4.4.
4.5.

Đặc tả sơ đồ usecase xác nhận đơn hàng
Đặc tả sơ đồ usecase xác nhận đơn hàng
Sơ đồ usecase xóa đơn hàng
Sơ đồ usecase hủy đơn hàng
Sơ đồ usecase thêm sản phẩm vào giỏ hàng
Sơ đồ usecase xóa sản phẩm khỏi giỏ hàng
Sơ đồ usecase đặt hàng
Sơ đồ tuần tự đăng nhập
Sơ đồ tuần tự tạo tài khoản
Sơ đồ tuần tự chỉnh sửa tài khoản
Sơ đồ tuần tự xóa tài khoản
Sơ đồ tuần tự tạo danh mục sản phẩm
Sơ đồ tuần tự chỉnh sửa danh mục sản phẩm
Sơ đồ tuần tự xóa danh mục sản phẩm
Sơ đồ tuần tự thêm thương hiệu
Sơ đồ tuần tự chỉnh sửa thương hiệu
Sơ đồ tuần tự xóa thương hiệu
Sơ đồ tuần tự tạo sản phẩm
Sơ đồ tuần tự chỉnh sửa sản phẩm
Sơ đồ tuần tự xóa sản phẩm

Sơ đồ tuần tự tạo slide
Sơ đồ tuần tự chỉnh sửa slide
Sơ đồ tuần tự xóa slide
Sơ đồ tuần tự tạo đánh giá
Sơ đồ tuần tự chỉnh sửa đánh giá
Sơ đồ tuần tự xóa đánh giá
Sơ đồ tuần tự đăng ký
Sơ đồ tuần tự tìm kiếm sản phẩm
Sơ đồ tuần tự xem chi tiết sản phẩm
Sơ đồ tuần tự thêm sản phẩm vào giỏ hàng
Sơ đồ tuần tự đặt hàng
Sơ đồ tuần tự xem đơn hàng
Sơ đồ lớp
Lược đồ cơ sở dữ liệu
Giao diện trang chủ trên máy tính
Giao diện trang chủ trên điện thoại
Giao diện trang sản phẩm
Giao diện xem chi tiết sản phẩm
Giao diện đánh giá
vi

41
41
42
42
43
43
44
45
46

47
48
48
49
50
51
52
53
53
54
55
56
57
58
58
59
60
61
61
62
63
64
64
65
68
71
72
72
73
74



4.6.
4.7.
4.8.
4.9.
4.10.
4.11.
4.12.
4.13.
4.14.
4.15.
4.16.
4.17.
4.18.
4.19.
4.20.
4.21.
4.22.
4.23.
4.24.
4.25.
4.26.
4.27.
4.28.
4.29.
4.30.
4.31.
4.32.
4.33.

4.34.
4.35.
4.36.
4.37.
4.38.
4.39.
4.40.
4.41.
4.42.
4.43.
4.44.

Giao diện tìm kiếm
Giao diện trang giỏ hàng
Giao diện thanh tốn hàng
Giao diện đặt hàng thành cơng
Email thơng báo cho Admin có khách hàng đặt hàng
Email thơng báo cho Khách hàng đơn đặt hàng
Giao diện liên hệ
Giao diện đăng nhập
Giao diện đăng ký
Giao diện xem thông tin tài khoản
Giao diện chỉnh sửa thông tin tài khoản
Giao diện danh sách đơn hàng đã đặt
Giao diện hủy đơn hàng
Email thơng báo có đơn hàng đã bị hủy
Giao diện xem chi tiết thông tin đặt hàng
Giao diện trang thống kê
Trang danh sách tài khoản
Trang thêm tài khoản

Trang chỉnh sửa tài khoản
Trang danh sách danh mục
Trang thêm danh mục
Trang chỉnh sửa danh mục
Trang danh sách thương hiệu
Trang thêm thương hiệu
Trang chỉnh sửa thương hiệu
Trang danh sách sản phẩm
Trang thêm sản phẩm
Trang chỉnh sửa sản phẩm
Trang danh sách đơn hàng
Giao diện xác nhận đặt đơn hàng
Email thông báo đã xác nhận đơn hàng
Giao diện xác nhận giao đơn hàng
Email thông báo đang giao hàng
Giao diện xác nhận đã giao đơn hàng
Email xác nhận hàng đã được giao
Trang danh sách slide
Trang thêm slide
Trang chỉnh sửa slide
Trang danh sách đánh giá
vii

74
75
75
76
76
76
77

77
78
78
78
79
79
79
80
80
81
81
81
82
82
82
83
83
83
84
84
85
85
86
86
86
87
87
87
88
88

88
89


viii


CHƯƠNG 1
TỔNG QUAN ĐỀ TÀI
1.1. TỔNG QUAN VẤN ĐỀ NGHIÊN CỨU
Q trình tồn cầu hóa và hội nhập quốc tế cùng với cuộc Cách mạng công nghiệp
lần thứ 4 đang tạo ra những bước đột phá mới. Để thúc đẩy sự phát triển nhanh và hiện
đại thì việc tăng cường đổi mới sáng tạo và ứng dụng khoa học - công nghệ, nhất là công
nghệ cao là yêu cầu bức thiết hiện nay.
Công nghệ ngày càng phát triền và dần dần được phổ biến rộng rãi hơn trong đời
sống hằng ngày, và trong tương lai sẽ là một phần không thể thiếu. Công nghệ được sử
dụng hầu hết trong mọi lĩnh vực từ trồng trọt, chăn nuôi, giáo dục, y tế, quốc phòng...
và lĩnh vực thương mại điện tử cũng khơng nằm ngồi việc đó. Có thể nói thương mại
điện tử là lĩnh vực mà tạo ra sự thu hút rất lớn đối với mọi người. Hiện nay các sàn
thương mại điện tử như Shopee, Lazada và Sendo đều có sức ảnh hưởng rộng lớn đến
nhiều khu vực và đánh tốt vào nhu cầu mua sắm của người sử dụng. Việc mua sắm
online ngày càng nhận được sự quan tâm rất lớn do những lợi ích của nó mang lại.
Các sản phẩm công nghệ như là điện thoại, laptop, tai nghe, camera... Ngày càng
được giới trẻ quan tâm nhất là các sản phẩm như điện thoại và laptop. Và việc tìm kiếm
và chọn mua các sản phẩm cơng nghệ phù hợp với nhu cầu của mình cũng rất nhiều.
Nắm bắt được nhu cầu đó mà có rất nhều website bán sản phẩm điện tử như là FPT
Shop, TheGioiDiDong, CellPhones... được ra đời đem lại những sản phẩm tốt nhất và
những dịch vụ ưu đãi nhất cho khách hàng.
1.2. LÝ DO CHỌN ĐỀ TÀI
Trong thị trường hiện nay thì việc cạnh tranh ngày càng trở nên quyết liệt và hầu

hết những nhà kinh doanh, những công ty lớn đều chú tâm đến việc thỏa mãn khách
hàng một cách tốt nhất.
Hiện nay càng nhiều doanh nghiệp phát triển hệ thống bán hàng theo loại thương
mại điện tử. So với kinh doanh truyền thống thì thương mại điện tử chi phí thấp hơn,
hiệu quả đạt cao hơn. Hơn thế nữa, với lợi thế của công nghệ Internet nên việc truyền
tải thông tin về sản phẩm nhanh chóng, thuận tiện. Kết hợp với bộ phận giao hàng tận
nơi, càng tăng thêm lợi nhuận để loại hình này phát triển.
Biết được những nhu cầu đó đề tài “Xây dựng website bán laptop” được xây dựng
nhằm để đáp ứng nhu cầu mua sắm cho mọi người tiêu dùng trên tồn quốc và thơng
qua hệ thống website này họ có thể đặt mua các mặt hàng hay sản phẩm cần thiết.
Việc chọn đề tài “Xây dựng website bán laptop” sẽ là cơ hội tốt để có thể tìm hiểu
thêm về các loại hình thương mại điện tử, cách hoạt động của các loại hình đó và tìm
hiểu được cách xây dựng một website thương mại điện tử cơ bản.

1


1.3. MỤC TIÊU NGHIÊN CỨU
1.3.1. Lý thuyết
- Nắm được lý thuyết về mơ hình MVC, cách hoạt động như thế nào và làm sao để
áp dụng tốt vào việc xây dựng web;
- Nắm được lý thuyết về thương mại điện từ và các hình thức kinh doanh thương
mại điện tử.
1.3.2. Về mặt công nghệ
- Sử dụng thành thạo ngôn ngữ PHP;
- Sử dụng thành thạo công nghệ HTML, CSS, JavaScript và Bootstrap;
- Kết nối và quản trị được hệ quản trị cơ sở dữ liệu MySQL.
1.3.3. Về mặt ứng dụng
Xây dựng được một website “Website bán laptop” với các chức năng của một
website thương mại điện tử có thể chạy được trong môi trường thực tế.

1.4. PHƯƠNG PHÁP NGHIÊN CỨU
1.4.1. Khảo sát thực tế
- Thu thập các website mẫu trên Internet và phân tích cách thiết kế về giao diện,
cách thiết kế cơ sở dữ liệu, cách xây dựng các chức năng... Nghiên cứu làm sao để áp
dụng tốt vào website;
- Tìm hiểu cách hoạt động của một website thương mại điện tử như là Lazada,
Shopee và các website bán sản phẩm điện tử như là FPT, TheGioiDiDong. Xem xét và
phân tích chức năng cụ thể trên website, từ đó nghiên cứu lại và xây dựng những tính
năng sẽ áp dụng vào xây dựng website;
- Khảo sát nhu cầu sử dụng “Website bán laptop”. Khảo sát sẽ tập trung vào 2 đối
tượng là khách hàng trải nghiệm website và người bán hàng quản lý website. Phương
thức khảo sát qua form online hoặc khảo sát trực tiếp qua gặp mặt, điền giấy.
1.4.2. Lý thuyết
- Nghiên cứu mơ hình MVC, một mơ hình phổ biến trong việc thiết kế website.
Nghiên cứu làm sao để xây dựng một website có áp dụng mơ hình MVC bằng cách làm
theo hướng dẫn, sau đó sẽ áp dụng vào xây dựng website;
- Tìm hiểu UI/UX (User Interface và User Experience). Thực hành thiết kế giao
diện theo lý thuyết UI/UX. Tìm hiểu làm sao để chọn màu sắc, typography, cách sắp
xếp layout phù hợp với một website bán sản phẩm điện tử;
- Tìm hiểu về các loại hình thương mại điện tử. Chọn ra một mơ hình phù hợp
nhất. Tập trung đọc các tài liệu liên quan đến loại hình thương mại đó;
- Nghiên cứu những thiết kế cơ sở dữ liệu đã được thiết kế và sử dụng hiệu quả để
thiết kế một cơ sở dữ liệu phù hợp với các tính năng có trong website.

2


1.4.3. Cơng nghệ
- Nghiên cứu ngơn ngữ lập trình PHP và thực hành viết code để tìm hiểu cách viết
các cú pháp, các hàm...;

- Tìm hiểu các cơng nghệ thiết kế website cần thiết như là HTML, CSS, JavaScript
và Bootstrap;
- Sử dụng hệ quản trị cơ sở dữ liệu MySQL trong việc kết nối và lưu trữ hệ quản
trị cơ sở dữ liệu.
1.5. PHẠM VI ỨNG DỤNG
- Đối tượng sử dụng: Những người có nhu cầu mua sắm các sản phẩm điện tử
online.
- Phạm vi ứng dụng: Website áp dụng trên môi trường Internet.

3


CHƯƠNG 2

CƠ SỞ LÝ THUYẾT
2.1. GIẢI PHÁP THIẾT KẾ
2.1.1. Mô hình Client - Server
a. Giới thiệu mơ hình Client - Server

Hình 2.1: Mơ hình Client - Server
Client server là mơ hình mạng máy tính bao gồm 2 thành phần chính là máy khách
(client) và máy chủ (server). Trong mơ hình này, server là nơi lưu trữ tài nguyên, cài đặt
các chương trình dịch vụ và thực hiện các yêu cầu của client. Client đón vai trị gửi u
cầu đến server. Client gồm máy tính và thiết bị điện tử nói chung [1].
Mơ hình Client server cho phép mạng tập trung các ứng dụng và chức năng tại một
hoặc nhiều máu dịch vụ file chuyên dụng. Các máy này trở thành trung tâm của hệ thống.
Hệ điều hành của Client server cho phép người dùng chia sẻ đồng thời cùng một tài
ngun, khơng quan trọng vị trí địa lý.
Mơ hình web client-server là một mơ hình nổi tiếng trong mạng máy tính, được áp
dụng rất rộng rãi và là mơ hình của mọi trang web hiện có. Một mơ hình ngược lại là

mơ hình master-slaver, trong đó máy chủ (đóng vai trị ơng chủ) sẽ gửi dữ liệu đến máy
con (đóng vai trị nơ lệ) bất kể máy con có cần hay khơng.
Mơ hình client/server như sau: Client/Server là mơ hình tổng qt nhất, trên thực
tế thì một server có thể được nối tới nhiều server khác nhằm làm việc hiệu quả và nhanh
hơn. Khi nhận được 1 yêu cầu từ client, server này có thể gửi tiếp yêu cầu vừa nhận
được cho server khác ví dụ như database server vì bản thân nó khơng thể xử lý u cầu
này được. Máy server có thể thi hành các nhiệm vụ đơn giản hoặc phức tạp.

4


b. Nguyên lý hoạt động của Client – Server
Toàn bộ quá trình giao tiếp giữa server và client phải dựa trên các giao thức chuẩn.
TCP/IP, SAN (IBM), ISDN, OSI, X.25, LAN-to-LAN Netbios là những giao thức chuẩn
được sử dụng phổ biến hiện nay.
Client server là giải pháp phần mềm hiệu quả, giúp khắc phục tình trạng quá tải
của hệ thống mạng. Bên cạnh đó, mơ hình này cịn vượt qua sự khác biệt trong cấu trúc
vật lý và hệ điều hành của các hệ thống máy tính. Mơ hình Client server gồm có 2 phần
là client & server.
- Client: Client hay chính là máy khách, máy trạm – là nơi gửi yêu cầu đến server.
Nó tổ chức giao tiếp với người dùng, server và mơi trường bên ngồi tại trạm làm việc.
Client tiếp nhận yêu cầu của người dùng sau đó thành lập các query string để gửi cho
server. Khi nhận được kết quả từ server, client sẽ tổ chức và trình diễn những kết quả
đó.
- Server: Server xử lý yêu cầu gửi đến từ client. Sau khi xử lý xong, server sẽ gửi
trả lại kết quả, client có thể tiếp tục xử lý các kết quả này để phục vụ người dùng. Server
giao tiếp với mơi trường bên ngồi và client tại server, tiếp nhận yêu cầu dưới dạng
query string (xâu ký tự). Khi phân tích xong các xâu ký tự, server sẽ xử lý dữ liệu và gửi
kết quả về cho client.
2.1.2. Mơ hình MVC trong việc xây dựng website

a. Giới thiệu mơ hình MVC
Mơ hình MVC là một mơ hình lập trình web được sử dụng rộng rãi hiện nay, được
viết tắt bởi ba từ Model – View – Controller, tương ứng với ba bộ phận tạo nên cấu trúc
của ứng dụng này. Mỗi thành phần kiến trúc được xây dựng để xử lý khía cạnh phát
triển cụ thể của một ứng dụng [8].

Hình 2.2: Mơ hình MVC
5


b. Các thành phần cấu tạo trong mơ hình MVC
- View: View là một phần của ứng dụng chịu trách nhiệm cho việc trình bày dữ
liệu. Thành phần này được tạo bởi dữ liệu thu thập từ dữ liệu mô hình, và giúp người
dùng có cái nhìn trực quan về trang web, cũng như ứng dụng.
View cũng đại diện cho dữ liệu từ các cuộc trò chuyện, sơ đồ và bảng. Ví dụ: bất
kỳ View nào cũng sẽ bao gồm tất cả các thành phần giao diện người dùng như một nút
bấm, khung nhập, menu, hình ảnh...
- Model: Phần Model của kiến trúc MVC là thành phần chính đảm nhiệm chức
năng lưu trữ dữ liệu và các bộ phận logic liên quan của toàn bộ ứng dụng. Model chịu
trách nhiệm cho các thao tác dữ liệu giữa Controller hoặc bất kỳ logic nghiệp vụ liên
quan nào khác như: cho phép xem, truy xuất dữ liệu... Ví dụ, Controller sẽ lấy thông tin
khách hàng từ cơ sở dữ liệu. Model sẽ thực hiện các thao tác dữ liệu và gửi lại cơ sở dữ
liệu hoặc sử dụng nó cho View.
- Controller: Đây là phần xử lý tương tác người dùng của ứng dụng. Controller xử
lý dữ liệu đầu vào từ bàn phím và chuột của người dùng sau đó thơng báo tới View và
Model. Sau đó liền gửi các lệnh tới Model để thay đổi trạng thái của Model (Ví dụ: lưu
một tài liệu cụ thể). Controller cũng gửi các lệnh tương tự tới View để thực hiện các
thay đổi về giao diện.
c. Luồng xử lý trong mơ hình MVC
MVC đại diện cho kiến trúc mà các nhà phát triển ứng dụng áp dụng vào dự án,

chúng ta xem xét cách luồng dữ liệu ứng dụng hoạt động như thế nào nhé.
Có rất nhiều kịch bản cho luồng xử lý MVC trên ứng dụng web. Dưới đây là luồng
xử lý căn bản và phổ biến nhất.
- Bước 1: Client gửi yêu cầu đến server thông qua Controller, Controller sẽ tiếp
nhận yêu cầu.
- Bước 2: Controller sẽ xử lý dữ liệu đầu vào, và quyết đinh luồng đi tiếp theo của
yêu cầu. Trả về kết quả hay tương tác với database để lấy dữ liệu. Nếu cần tương tác với
Model để lấy dữ liệu, Controller sẽ gọi tới Model để lấy dữ liệu đầu ra. Nếu không,
Controller sẽ trả về kết quả theo mũi tên số (8).
- Bước 3: Model tương tác với Database để truy xuất dữ liệu phù hợp với yêu cầu.
- Bước 4: Database trả về cho Model dữ liệu theo yêu cầu của Model.
- Bước 5: Model trả về dữ liệu cho Controller xử lý.
- Bước 6: Controller sẽ gọi đến View phù hợp với yêu cầu và kèm theo dữ liệu cho
View. View chịu trách nhiệm hiển thị dữ liệu phù hợp với yêu cầu.
- Bước 7: Sau khi xử lý hiển thị dữ liệu, View trả về cho Controller kết quả
(HTML, XML hoặc JSON…).
- Bước 8: Sau khi hoàn tất, Controller sẽ trả về kết quả cho Client.

6


Hình 2.3: Luồng xử lý của mơ hình MVC
2.1.3. Mơ hình thương mại điện tử
a. Khái niệm thương mại điện tử
Thương mại điện tử (TMĐT) là giao dịch mua bán dựa trên nền tảng www (world
wide web) thông qua các thiết bị điện tử có kết nối internet [6].

Hình 2.4: Mơ hình thương mại điện tử

7



b. Các mơ hình thương mại điện tử

Hình 2.5: Các mơ hình thương mại điện tử
- Business-to-business (B2B): Thương mại điện tử B2B là gì? Là khi một cơng ty
mua hàng hóa hoặc dịch vụ trực tuyến từ một doanh nghiệp khác. Ví dụ như: một nhà
hàng mua một máy làm đá hoặc một công ty luật mua phần mềm kế toán. Các phần mềm
kinh doanh như quản lý quan hệ khách hàng (CRM) và các công ty cung cấp dịch vụ
thanh toán cũng được coi là B2B. Bán hàng trực tuyến B2B có xu hướng phức tạp hơn
các hình thức thương mại điện tử khác vì nó có một danh mục lớn các sản phẩm phức
tạp;
- Business-to-consumer (B2C): Bán lẻ trực tuyến B2C là khi người tiêu dùng mua
một mặt hàng qua internet để sử dụng riêng. Mặc dù thương mại điện tử B2C có vẻ nổi
bật hơn, nhưng nó chỉ bằng một nửa kích thước của thị trường thương mại điện tử B2B
trên toàn thế giới;
- Consumer-to-consumer (C2C): C2C hoạt động như các trang trao đổi, mua bán,
đấu giá qua internet trong đó người dùng bán hàng hóa cho nhau. Đây có thể là những
sản phẩm họ làm ra, chẳng hạn như thủ công hoặc đồ cũ mà họ sở hữu và muốn bán;
- Consumer-to-business (C2B): Khi người tiêu dùng tạo ra giá trị cho doanh
nghiệp, đó là thương mại C2B. Tạo giá trị có thể có nhiều hình thức. Chẳng hạn, C2B
có thể đơn giản như một khách hàng để lại đánh giá tích cực cho một doanh nghiệp hoặc
một trang web nhiếp ảnh mua hình ảnh từ các nhiếp ảnh gia tự do. Ngoài ra, C2B cịn là
các doanh nghiệp bán hàng second hand đơi khi mua hàng hóa từ những người dùng
internet bình thường;
- Business-to-government (B2G): Hình thức này đơi khi được gọi là business-toadministration (B2A). Là khi một công ty tư nhân trao đổi hàng hóa hoặc dịch vụ với
một cơ quan cơng cộng. Thông thường dưới dạng một hợp đồng kinh doanh với một tổ
chức công cộng để thực hiện một dịch vụ được ủy quyền. Chẳng hạn, một cơng ty giám
sát có thể đấu thầu trực tuyến một hợp đồng để làm sạch tịa án quận hoặc một cơng ty
CNTT có thể đáp ứng đề xuất quản lý phần cứng máy tính của thành phố.


8


c. Những tính chất của thương mại điện tử
- Được phát triển dựa trên công nghệ: Thương mại truyền thống đã xuất hiện từ
thời xa xưa, còn thương mại điện tử là kết quả của việc tích hợp cơng nghệ kỹ thuật số
với các quy trình kinh doanh và các giao dịch kinh tế. Nền tảng công nghệ của thương
mại điện tử là Internet, World Wide Web và các giao thức khác;
- Công nghệ trung gian: Trong thương mại điện tử, người mua và người bán gặp
trực tiếp nhau trong khơng gian ảo thay vì là một địa điểm như thương mại truyền thống.
Do đó thương mại điện tử là một cơng nghệ trung gian;
- Tính quốc tế: Trong thương mại điện tử các hoạt động mua bán diễn ra trên các
trang web. Các trang web này có thể truy cập từ bất kỳ nơi nào trên toàn cầu do đó
thương mại điện tử có tính quốc tế;
- Thơng tin hai chiều: Công nghệ thương mại điện tử đảm bảo liên lạc hai chiều
giữa người mua và người bán. Một mặt, bằng cách sử dụng thương mại điện tử các cơng
ty có thể giao tiếp với khách hàng thơng qua các trang web. Mặt khác, khách hàng cũng
có thể điền vào các mẫu đơn đặt hàng, phản hồi và tương tác với các cơng ty có hoạt
động kinh doanh thương mại điện tử;
- Cung cấp thông tin: Thương mại điện tử đóng vai trị là kênh truyền thơng tốt
nhất. Các công nghệ thương mại điện tử đảm bảo cung cấp thơng tin nhanh chóng với
chi phí rất thấp và cũng làm tăng đáng kể mật độ thơng tin;
- Tính đa ngành: Triển khai thương mại điện tử cần rất nhiều kiến thức về các vấn
đề quản trị, công nghệ, xã hội và pháp lý. Bên cạnh đó, sự hiểu biết về hành vi của người
tiêu dùng, các công cụ marketing cũng quan trọng như thiết kế các trang web thương
mại điện tử.
2.2. CƠNG NGHỆ SỬ DỤNG
Bảng 2.1: Các cơng nghệ được sử dụng
STT

Tên cơng nghệ
Mơ tả
1
PHP
Ngơn ngữ lập trình phía máy chủ
2
MySQL
Lưu trữ cơ sở dữ liệu
3
Xampp
Host PHP server và MySQL server
4
Visual Studio Code
Viết code cho website
5
Google Chrome
Hiển thị website và kiểm lỗi
6
HTML, CSS, JS
Công nghệ thiết kế giao diện website
7
Bootstrap
Hỗ trợ thiết kế giao diện website
8
Google Map
Hiển thị bản đồ
9
Gmail
Gửi email


9


2.2.1. Ngơn ngữ lập trình PHP
PHP là dạng viết tắt của thuật ngữ Personal Home Page. Đây là một chuỗi ngơn
ngữ kịch bản hoặc một dạng mã lệnh. Trong đó, ngôn ngữ PHP chủ yếu được phát triển
dành cho các ứng dụng nằm trên máy chủ. Khi các lập trình viên PHP viết chương trình,
các chuỗi lệnh sẽ được chạy ở trên server nhằm sinh ra mã HTML. Nhờ đó, những ứng
dụng trên các website có thể chạy một cách dễ dàng [7].
Ngôn ngữ PHP thông thường phù hợp với việc lập trình web vì nó có thể dễ dàng
kết nối với các website có sử dụng HTML để chạy trên những trình duyệt web. Chính
vì vậy, ngơn ngữ lập trình này ln được coi là khá dễ học. Và PHP cũng trở thành ngôn
ngữ web dev phổ biến nhất mà các lập trình viên sẽ cần phải học khi mới bắt đầu vào
nghề.

Hình 2.6: Ngơn ngữ lập trình PHP
2.2.2. Hệ quản trị cơ sở dữ liệu MySQL
MySQL là một hệ thống quản trị cơ sở dữ liệu mã nguồn mở (gọi tắt là RDBMS)
hoạt động theo mơ hình client-server. Với RDBMS là viết tắt của Relational Database
Management System. MySQL được tích hợp apache, PHP. MySQL quản lý dữ liệu
thơng qua các cơ sở dữ liệu. Mỗi cơ sở dữ liệu có thể có nhiều bảng quan hệ chứa dữ
liệu. MySQL cũng có cùng một cách truy xuất và mã lệnh tương tự với ngôn ngữ SQL
[5].

10


Hình 2.7: Hệ quản trị cơ sở dữ liệu MySQL
2.2.3. Cơng cụ Xampp


Hình 2.8: Cơng cụ Xampp
Ý nghĩa chữ viết tắt XAMPP là gì? XAMPP hoạt động dựa trên sự tích hợp của 5
phần mềm chính là Cross-Platform (X), Apache (A), MariaDB (M), PHP (P) và Perl
(P), nên tên gọi XAMPP cũng là viết tắt từ chữ cái đầu của 5 phần mềm này [4]:
- Chữ X đầu tiên là viết tắt của hệ điều hành mà nó hoạt động với: Linux, Windows
và Mac OS X.
- Apache: Web Server mã nguồn mở Apache là máy chủ được sử dụng rộng rãi
nhất trên toàn thế giới để phân phối nội dung Web. Ứng dụng được cung cấp dưới dạng
phần mềm miễn phí bởi Apache Software Foundation.
- MySQL / MariaDB: Trong MySQL, XAMPP chứa một trong những hệ quản trị
cơ sở dữ liệu quan hệ phổ biến nhất trên thế giới. Kết hợp với Web Server Apache và
ngơn ngữ lập trình PHP, MySQL cung cấp khả năng lưu trữ dữ liệu cho các dịch vụ
Web. Các phiên bản XAMPP hiện tại đã thay thế MySQL bằng MariaDB (một nhánh
của dự án MySQL do cộng đồng phát triển, được thực hiện bởi các nhà phát triển ban
đầu).
11


- PHP: Ngơn ngữ lập trình phía máy chủ PHP cho phép người dùng tạo các trang
Web hoặc ứng dụng động. PHP có thể được cài đặt trên tất cả các nền tảng và hỗ trợ
một số hệ thống cơ sở dữ liệu đa dạng.
- Perl: ngôn ngữ kịch bản Perl được sử dụng trong quản trị hệ thống, phát triển
Web và lập trình mạng. Giống như PHP, Perl cũng cho phép người dùng lập trình các
ứng dụng Web động.
2.2.4. Visual Studio Code
Là một trình biên tập lập trình code miễn phí dành cho Windows, Linux và macOS,
Visual Studio Code được phát triển bởi Microsoft. Nó được xem là một sự kết hợp hoàn
hảo giữa IDE và Code Editor [2].
Visual Studio Code hỗ trợ chức năng debug, đi kèm với Git, có syntax highlighting,
tự hồn thành mã thơng minh, snippets, và cải tiến mã nguồn. Nhờ tính năng tùy chỉnh,

Visual Studio Code cũng cho phép người dùng thay đổi theme, phím tắt, và các tùy chọn
khác.

Hình 2.9: Phần mềm Visual Studio Code
- Một số tính năng của Visual Studio Code:
 Hỗ trợ nhiều ngơn ngữ lập trình: Visual Studio Code hỗ trợ nhiều ngơn ngữ
lập trình như C/C++, C#, F#, Visual Basic, HTML, CSS, JavaScript, … Vì vậy, nó dễ
dàng phát hiện và đưa ra thông báo nếu chương chương trình có lỗi.
 Hỗ trợ đa nền tảng: Các trình viết code thông thường chỉ được sử dụng hoặc
cho Windows hoặc Linux hoặc Mac Systems. Nhưng Visual Studio Code có thể hoạt
động tốt trên cả ba nền tảng trên.
 Cung cấp kho tiện ích mở rộng: Trong trường hợp lập trình viên muốn sử
dụng một ngơn ngữ lập trình khơng nằm trong số các ngôn ngữ Visual Studio hỗ trợ, họ
có thể tải xuống tiện ích mở rộng. Điều này vẫn sẽ không làm giảm hiệu năng của phần
mềm, bởi vì phần mở rộng này hoạt động như một chương trình độc lập.

12


 Kho lưu trữ an toàn: Đi kèm với sự phát triển của lập trình là nhu cầu về lưu
trữ an tồn. Với Visual Studio Code, người dùng có thể hồn tồn n tâm vì nó dễ dàng
kết nối với Git hoặc bất kỳ kho lưu trữ hiện có nào.
 Hỗ trợ web: Visual Studio Code hỗ trợ nhiều ứng dụng web. Ngồi ra, nó
cũng có một trình soạn thảo và thiết kế website.
 Lưu trữ dữ liệu dạng phân cấp: Phần lớn tệp lưu trữ đoạn mã đều được đặt
trong các thư mục tương tự nhau. Ngoài ra, Visual Studio Code còn cung cấp các thư
mục cho một số tệp đặc biệt quan trọng.
 Hỗ trợ viết Code: Một số đoạn code có thể thay đổi chút ít để thuận tiện cho
người dùng. Visual Studio Code sẽ đề xuất cho lập trình viên các tùy chọn thay thế nếu
có.

 Intellisense: Hầu hết các trình viết mã đều có tính năng nhắc mã Intellisense,
nhưng ít chương trình nào chun nghiệp bằng Visual Studio Code. Nó có thể phát hiện
nếu bất kỳ đoạn mã nào khơng đầy đủ. Thậm chí, khi lập trình viên qn khơng khai
báo biến, Intellisense sẽ tự động giúp họ bổ sung các cú pháp còn thiếu.
 Hỗ trợ Git: Visual Studio Code hỗ trợ kéo hoặc sao chép mã trực tiếp từ
GitHub. Mã này sau đó có thể được thay đổi và lưu lại trên phần mềm.
2.2.5. Bootstrap
Bootstrap là 1 framework HTML, CSS, và JavaScript cho phép người dùng dễ
dàng thiết kế website theo 1 chuẩn nhất định, tạo các website thân thiện với các thiết bị
cầm tay như mobile, ipad, tablet... [3].
Bootstrap bao gồm những cái cơ bản có sẵn như: typography, forms, buttons,
tables, navigation, modals, image carousels và nhiều thứ khác. Trong bootstrap có thêm
nhiều Component, Javascript hỗ trợ cho việc thiết kế reponsive của bạn dễ dàng, thuận
tiện và nhanh chóng hơn.

Hình 2.10: Logo của Bootstrap

13


CHƯƠNG 3
PHÂN TÍCH, THIẾT KẾ HỆ THỐNG VÀ KẾT QUẢ
3.1. ĐẶC TẢ YÊU CẦU
3.1.1. Các tác nhân
- Admin: Người quản trị hệ thống;
- Khách hàng: Người sử dụng website để mua hàng.
3.1.2. Yêu cầu chức năng
Bảng 3.1: Mô tả các chức năng
Tác
Chức năng

Chức năng con
nhân
Đăng nhập
Đăng xuất
Xem danh sách tài khoản
Thêm tài khoản
Quản lý tài
khoản
Chỉnh sửa tài khoản
Xóa tài khoản
Xem danh sách thương hiệu
Quản lý thương
Thêm thương hiệu
hiệu
Chỉnh sửa thương hiệu
Xóa thương hiệu
Xem danh sách danh mục
Thêm danh mục
Quản lý danh
mục sản phẩm
Chỉnh sửa danh mục
Xóa danh mục
Admin
Xem danh sách sản phẩm
Thêm sản phẩm
Quản lý sản
phẩm
Chỉnh sửa sản phẩm
Xóa sản phẩm
Xem danh sách đơn hàng


Xác nhận đơn hàng
Quản lý đơn
hàng

Xác nhận giao hàng thành
cơng

14

Sự kiện

Admin có thể xác
nhận đơn hàng khi có
khách hàng đặt hàng,
sau khi xác nhận thì
khách hàng khơng thể
hủy được đơn hàng
Sau khi giao hàng
thành cơng thì admin
xác nhận là giao hàng
thành công