ĐỀ tài WEBSITE bán đồ THỜI TRANG

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN &
TRUYỀN THÔNG VIỆT HÀN

Khoa Khoa Học Máy Tính

BÁO CÁO ĐỒ ÁN TỐT NGHIỆP

WEBSITE BÁN ĐỒ THỜI TRANG

Sinh viên thực hiện

: Hoàng Hùng

Lớp

: 19I2

Giảng viên hướng dẫn: TS. LÊ THỊ THU NGA

Đà Nẵng, tháng 11 năm 2021
i


TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN &
TRUYỀN THÔNG VIỆT HÀN

Khoa Khoa Học Máy Tính

BÁO CÁO ĐỒ ÁN TỐT NGHIỆP

WEBSITE BÁN ĐỒ THỜI TRANG

Sinh viên:

Hoàng Hùng

Mã:

191C900077

Giảng viên hướng dẫn: TS. LÊ THỊ THU NGA

Đà Nẵng, tháng 11 năm 2021

ii


NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN
...................................................................................................................................
...................................................................................................................................
...................................................................................................................................
...................................................................................................................................
...................................................................................................................................

iii


LỜI CẢM ƠN
Để hoàn thành bài báo cáo này, trước hết, em xin cảm ơn các thầy cô giáo khoa
công nghệ thông tin Trường Đại học CNTT và Truyền Thông Việt - Hàn, em đã
nhận được rất nhiều sự quan tâm, giúp đỡ của quý thầy cô cùng bạn bè. Em cũng xin

gửi lời cảm ơn đến ban giám hiệu nhà trường đã tạo điều kiện tốt nhất cho em củng
như các bạn trong suốt thời gian học tập. Cuối cùng em xin gửi lời cảm ơn sâu sắc
nhất đến giảng viên Lê Thị Thu Nga – là giảng viên trực tiếp cố vấn giúp đỡ và hỗ
trợ em hoàn thành đồ án này tốt đẹp nhất .
Em xin chân thành cảm ơn!

Sinh viên,
Hoàng Hùng

iv


MỤC LỤC

DANH MỤC CÁC TỪ VIẾT TẮT ................................................................... ix
DANH MỤC HÌNH VẼ ...................................................................................... x
MỞ ĐẦU .............................................................................................................. 1
1.Giới thiệu ....................................................................................................................... 1
2. Lý do chọn đề tài .......................................................................................................... 1
3. Mục tiêu của đề tài ........................................................................................................ 2
4. Nhiệm vụ và hướng giải quyết ...................................................................................... 3
5.Ý nghĩa thực tiễn của đề tài ........................................................................................... 3
6.Bố cục đề tài .................................................................................................................. 3

Chương 1. CÔNG CỤ CÔNG NGHỆ SỬ DỤNG ............................................ 4
1. Công nghệ sử dụng ......................................................................................................... 4
1.1. PHP ............................................................................................................................ 4
1.2. MYSQL (Cơ Sở Dữ Liệu ) ........................................................................................ 4
1.3. HTML ........................................................................................................................ 5
1.4. CSS ............................................................................................................................ 6

1.5. JavaScript ................................................................................................................... 6
2. Công cụ hỗ trợ ................................................................................................................ 7
2.1. XAMPP ...................................................................................................................... 7
2.2. PHPStorm .................................................................................................................. 8
2.3. Navicat ....................................................................................................................... 8
3. Thư viện sử dụng ............................................................................................................ 7
3.1. Laravel PHP Framwork ............................................................................................. 9
3.2. JQuery ........................................................................................................................ 9
3.3. Bootstrap .................................................................................................................. 10

Chương 2. PHÂN TÍCH MƠ HÌNH HỆ THỐNG ......................................... 11
2.1. Phân tích yêu cầu ................................................................................................... 13
2.1.1. Yêu cầu về chức năng .................................................................................. 13
2.1.2 Yêu cầu về hình thức .................................................................................... 14
2.1.3 Yêu cầu về bảo mật ....................................................................................... 14
2.2. Phân tích yêu cầu ................................................................................................... 14
v


2.2.1 Sơ đồ chức năng admin ................................................................................. 14
2.2.2 Sơ đồ chức năng quản lý khách hàng (trang người dùng) ............................ 15
2.3. Sơ đồ Use case ........................................................................................................ 15
2.3.1 Sơ đồ Use case tổng quát .............................................................................. 15
2.3.2 Sơ đồ User case đăng nhập admin ................................................................ 17
2.3.3 Sơ đồ User case quản lý danh mục sản phẩm ............................................... 18
2.3.4 Sơ đồ User case quản lý sản phẩm................................................................ 19
2.3.5 Sơ đồ User case quản lý slide(banner) .......................................................... 20
2.3.6 Sơ đồ User case quản lý thương hiệu ........................................................... 21
2.3.7 Sơ đồ User case quản lý đơn vị vận chuyển ................................................. 22
2.3.8 Sơ đồ User case quản lý đơn hàng ................................................................ 24

2.3.9 Sơ đồ User case quản lý thành viên .............................................................. 26
2.3.10 Sơ đồ User case quản lý bài viết ................................................................. 27
2.3.11 Sơ đồ User case quản lý mã giảm giá ......................................................... 28
2.3.12 Sơ đồ User case quản lý bình luận .............................................................. 29
2.3.13 Sơ đồ User case quản lý đánh giá ............................................................... 30
2.4. Phân tích cơ sở dữ lệu............................................................................................ 31
2.4.1 Sơ đồ tổng quát ............................................................................................. 31
2.4.2 Danh sách các bảng dữ liệu .......................................................................... 31

Chương 3. XÂY DỰNG ỨNG DỤNG ............................................................. 44
3.1. Giao diện chung ..................................................................................................... 44
3.1.2 Giao diện trang giới thiệu của Website ....................................................... 45
3.1.2. Giao diện trang sản phẩm của website........................................................ 47
3.1.4. Giao diện trang bài viết của website ........................................................... 48
3.1.5. Giao diện trang liên hệ của website ............................................................ 49
3.1.5. Giao diện trang chi tiết sản phẩm của website............................................ 50
3.2. Giao diện chức năng .............................................................................................. 51
3.2.1. Giao diện Đăng nhập khách hàng của website ........................................... 51
3.2.2. Giao diện Đăng ký khách hàng của website ............................................... 51
3.2.3. Giao diện Đăng ký khách hàng của Website .............................................. 52
3.2.4. Giao diện Danh sách yêu thích của Website .............................................. 52
3.2.5. Giao diện Thanh toán của website .............................................................. 53
3.3. Giao diện dành cho khách hàng ........................................................................... 54
vi


3.3.1. Giao diện hiển thị đơn hàng ........................................................................ 54
3.3.2. Giao diện hiển thị Đánh giá ........................................................................ 54
3.3.3. Giao diện hiển thị Bình luận ....................................................................... 55
3.3.4. Giao diện hiển thị Chi tiết đơn hàng ........................................................... 55

3.3.5. Giao diện hiển thị Trang thông tin cá nhân ................................................ 56
3.3.5. Giao diện hiển thị Đổi mật khẩu ................................................................. 56
3.4. Giao diện dành cho quản trị ................................................................................. 57
3.4.1. Giao diện hiển thị Banner ........................................................................... 57
3.4.2. Giao diện hiển thị Thêm Banner ................................................................. 57
3.4.3. Giao diện hiển Sửa Banner ......................................................................... 58
3.4.4. Giao diện hiển thị Danh mục sản phẩm ...................................................... 58
3.4.5. Giao diện hiển thị Thêm danh mục sản phẩm ............................................ 59
3.4.6. Giao diện hiển thị Sửa danh mục sản phẩm................................................ 59
3.4.7. Giao diện hiển thị sản phẩm ....................................................................... 60
3.4.8. Giao diện hiển thị Thêm sản phẩm ............................................................. 60
3.4.9. Giao diện hiển thị Sửa sản phẩm ................................................................ 61
3.4.10. Giao diện hiển thị Thương hiệu ................................................................ 61
3.4.11. Giao diện hiển thị thêm Thương hiệu ....................................................... 62
3.4.12. Giao diện hiển thị sửa Thương hiệu ......................................................... 62
3.4.13. Giao diện hiển Đơn vị vận chuyển ........................................................... 63
3.4.14. Giao diện hiển thị thêm Đơn vị vận chuyển ............................................. 63
3.4.15. Giao diện hiển thị sửa Đơn vị vận chuyển ................................................ 64
3.4.16. Giao diện hiển thị đơn hàng ...................................................................... 64
3.4.17. Giao diện hiển thị chi tiết đơn hàng .......................................................... 65
3.4.18. Giao diện hiển thị sửa đơn hàng ............................................................... 65
3.4.19. Giao diện hiển thị đánh giá sản phẩm ....................................................... 66
3.4.20. Giao diện hiển thị sửa trạng thái đánh giá sản phẩm ................................ 66
3.4.21. Giao diện hiển thị bài viết ......................................................................... 67
3.4.22. Giao diện hiển thị thêm bài viết ................................................................ 67
3.4.23. Giao diện hiển thị sửa bài viết .................................................................. 68
3.4.24. Giao diện hiển thị danh mục bài viết ........................................................ 68
3.4.25. Giao diện hiển thị thêm danh mục bài viết ............................................... 69
3.4.26. Giao diện hiển thị thẻ tag bài viết ............................................................. 69
vii

3.4.27. Giao diện hiển thị thêm thẻ tag bài viết .................................................... 70
3.4.28. Giao diện hiển thị sửa thẻ tag bài viết ...................................................... 70
3.4.29. Giao diện hiển thị bình luận...................................................................... 71
3.4.30. Giao diện hiển thị sửa trạng thái bình luận ............................................... 71
3.4.31. Giao diện hiển thị mã giảm giá ................................................................. 72
3.4.32. Giao diện hiển thị thêm mã giảm giá ........................................................ 72
3.4.33. Giao diện hiển thị sửa mã giảm giá .......................................................... 73
3.4.34. Giao diện hiển thị tài khoản người dùng .................................................. 73
3.4.35. Giao diện hiển thị thêm tài khoản người dùng ......................................... 74
3.4.36. Giao diện hiển thị sửa tài khoản người dùng ............................................ 74
3.4.37. Giao diện hiển thị cài đặt Website ............................................................ 75

KẾT LUẬN ........................................................................................................ 76
TÀI LIỆU THAM KHẢO ............................................................................... 77

viii


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

NỘI DUNG

PHP

Hypertext Preprocessor

STEM

Structured Query Language

JS

JavaScript

CSDL

Cơ Sở Dữ Liệu

HTML

Hypertext Markup Language

ix


DANH MỤC HÌNH VẼ
Hình 2.2.1.Sơ đồ chức năng admin……………………………….12
Hình 2.2.2.Sơ đồ chức năng khách hàng …………………………13
Hình 2.3.1.Sơ đồ use case tổng quát…...…………….…………...14
Hình 2.3.2.Sơ đồ use case đăng nhập admin …........……...……..15
Hình 2.3.3. Sơ đồ use case quản lý danh mục sản phẩm…...….....16
Hình 2.3.4.Sơ đồ use case quản lý sản phẩm……………………..17
Hình 2.3.5.Sơ đồ use case quản lý slide...………………………...18
Hình 2.3.6.Sơ đồ use case quản lý thương hiệu……………...…...19
Hình 2.3.7.Sơ đồ use case quản lý đơn vị vận chuyển…...……….20
Hình 2.3.8.Sơ đồ use case quản lý đơn hàng (admin)…………….21
Hình 2.3.8.Sơ đồ use case quản lý đơn hàng (khách hàng)……….22

Hình 2.3.9.Sơ đồ use case quản lý tài khoản thành viên………….23
Hình 2.3.10.Sơ đồ use case quản lý bài viết…...………………….24
Hình 2.3.11.Sơ đồ use case quản lý mã giảm giá…...…………….25
Hình 2.3.12.Sơ đồ use case quản lý bình luận…...………………..26
Hình 2.3.13.Sơ đồ use case quản lý đánh giá…...…………………27
Hình 2.4.1.Sơ đồ Diagram Database tổng quát…...……………….29

x


MỞ ĐẦU
1.Giới thiệu
Trong thời đại cơng nghiệp hóa - hiện đại hóa đất nước như ngày nay nói đến cơng
nghệ thơng tin chúng ta hình dung ngay tới một mơi trường phát triển năng động được
xếp vào hàng bậc nhất thế giới. Công nghệ thông tin được ứng dụng rộng rãi vào mọi
lĩnh vực của đời sống xã hội hiện nay.
Từ những phần mềm quản lý giúp cho công việc bán hàng của cửa hàng trở nên
nhanh chóng và dễ dàng, ngày nay công nghệ thông tin đã phát triển mạnh mẽ hơn nữa,
Website ra đời không chỉ đáp ứng cho các khách hàng đến trực tiếp cửa hàng mua sản
phẩm mà nó cịn phục vụ cho những khách hàng ở xa. Không những thế, với việc giới
thiệu, quảng bá hình ảnh về của hàng, cơng ty được mở rộng trên quy mô lớn giúp cho
việc kinh doanh, buôn bán, trao đổi tin tức thuận lợi hơn rất nhiều,mang lại hiệu quả
kinh tế cao hơn tạo uy tín trong khách hàng.
Chính vì lợi ích mà Website mang lại mà các cửa hàng, nhiều cơng ty đã áp dụng
nó để phát triển công việc kinh doanh giới thiệu của hàng của mình. Trong số đó, thời
trang cũng là một ngành sử dụng nhiều đến Website. Do vậy em lựa chọn đề tài thiết
Website bán đồ thời trang giới trẻ nhằm đưa khách đến cho khách hàng một địa điểm lý
tưởng trong việc mua sắm đồ thời trang.

2. Lý do chọn đề tài

Ngày nay, việc áp dụng Website trong việc phát triển kinh doanh của cửa hàng
trở nên rất phổ biến và hiệu quả, trong đó ngành thời trang dành cho giới trẻ cũng có sử
dụng nhiều đến Website để giới thiệu và quảng bá sản phẩm của cửa hàng, công ty mình.
Việc lên mạng tìm kiếm và mua sản phẩm trở nên khá gần gũi với các bạn trẻ ngày nay,
đặc biệt là các bạn đam mê cái đẹp là không thể thiếu. Do vậy em quyết định thực hiện
đề tài này với mong muốn đưa đến nhiều sự lựa chon hơn cho khách hàng, và phát triển
của hàng trên quy mô lớn hơn.
Xây dựng một Website bán hàng trực tuyến và giới thiệu quảng bá sản phẩm, đặt
hàng theo yêu cầu, các sản phẩm đa dạng với giá cả hợp lý nhất.
1


3. Mục tiêu của đề tài
Mục tiêu của đề tài bao gồm:
- Xây dựng một website cung cấp cho khách hàng tất cả những thông tin chi
tiết về các sản phẩm trên trang web, thông tin liên hệ cũng như những sản
phẩm mới nhất được cập nhật thường xuyên.
- Khách hàng có thể đặt hàng ngay những sản phẩm mà khách hàng yêu
thích
- Tạo ra sản phẩm thân thiện, đơn giản với giao diện tự nhiên, bắt mắt, dễ
sử dụng cho tất cả mọi người.
- Xây dựng một website giúp người quản trị quản lý thông tin hệ thống một
cách dễ dàng hơn, tiện lợi hơn.
- Củng cố và bổ sung kiến thức các mơn đã học. Qua đó, rèn luyện kỹ năng
làm việc độc lập.
- Từ đề tài này có thể mở rộng ra và ứng dụng cho các đề tài khác có liên
quan.

4. Nhiệm vụ và hướng giải quyết
Từ các yêu cầu đặt ra, đề tài tiến hành phân tích và đưa ra hướng giải

quyết theo các bước sau:
- Tìm hiểu về các website tương tự để xây dựng các chức năng sao cho phù
hợp với đa phần thị hiếu của người sử dụng hiện nay.
- Tiến hành tìm hiểu về các khái niệm có liên quan và từ các thông tin khảo
sát được sẽ tiến hành phân tích các chức năng dự định đưa vào website.
- Tìm hiểu về các nội dung cần có của một trang web bán đồ thời trang, từ
đó đưa ra các giải pháp để tiến hành xây dựng.
- Lựa chọn và cài đặt các công cụ, phần mềm phù hợp cho việc thiết kế
website.
- Bắt tay vào việc xây dựng website.
- Tiến hành kiểm tra và chạy thử.
- Thay đổi, bổ sung, khắc phục các lỗi để website hoàn chỉnh hơn.

2


5. Ý nghĩa thực tiển của đề tài
Ý nghĩa thực tiễn của đề tài như sau:
- Ý nghĩa đối với doanh nghiệp:Website được xây dựng nhằm giúp
quảng bá thông tin sản phẩm , dịch vụ của hệ thống ra ngoài thị trường
một cách rộng rãi. Qua đó giúp tăng số lượng khách hàng sử dụng trang
web và tăng doanh thu. Bên cạnh đó, cịn giúp cho doanh nghiệp, cá
nhân giảm được chi phí.
- Ý nghĩa đối với khách hàng: Giúp cho người sử dụng có thể nhanh
chóng lựa chọn những món hàng mà mình muốn đặt mà khơng cần đến
cửa hàng.
- Ý nghĩa đối với cá nhân sinh viên: Qua đề tài này, em có thể xây dựng
một website để ứng dụng vào thực tế với giao diện thân thiện, dễ dàng
sử dụng trong q trình xem thơng tin và dễ quản lý .

6.Bố cục đề tài
Ngoài phần mở dầu và kết luận, nội dung đề tài tập chung vào 3 chương sau:
- Chương 1. Công nghệ công cụ. Chương này trình bày một số cơng
nghệ cơng cụ được sử dụng để xây dưng websỉe như: PHP, MYSQL,
HTML, JQUERY, JAVASCRIPT, CSS....Ứng dụng mơ hình MVC
vào xây dựng trang web.Ứng dụng Frameword Laravel vào xây dựng
trang web.
- Chương 2. Phân tích thiết kế hệ thống. Phân tích yêu cầu chức năng,
sơ đồ use case, phân tích cơ sở dữ liệu,… được trình bày chi tiết trong
chương này. Thiết kế đặc tả hệ thống. Xây dưng cơ sở dữ liệu trên
MySQL.
- Chương 3. Xây dựng và triển khai ứng dụng. Trong chương này, các
kết qủa đạt được như: thiết kế giao diện về phái người dùng, giao diện
về phía người quản trị,…. Được trình bày trong chương này.
3


Chương 1. CƠNG CỤ CƠNG NGHỆ SỬ DỤNG
1. Cơng nghệ sử dụng
1.1. PHP

Hình 1 : PHP Language

Là một ngơn ngữ lập trình kịch bản hay một loại mã lệnh chủ yếu được dùng để phát
triển các ứng dụng viết cho máy chủ, mã nguồn mở, dùng cho mục đích tổng qt. Nó
rất thích hợp với web và có thể dễ dàng nhúng vào trang HTML. Do được tối ưu hóa
cho các ứng dụng wrb, tốc độ nhanh, nhỏ gọn, cú pháp giống C và Java, dễ học và thời
gian xây dựng sản phẩm tương đối ngắn hơn so với các ngơn ngữ khác nên PHP đã
nhanh chóng trở thành một ngơn ngữ lập trình web phổ biến nhất thế giới.
Ngơn ngữ, các thư viện, tài liệu gốc của PHP được xây dựng bởi cộng đồng và có sự

đóng góp rất lớn của Zend Inc, công ty do các nhà phát triển cốt lõi của PHP lập nên
nhằm tạo ra một môi trường chuyên nghiệp để đưa PHP phát triển ở quy mơ doanh
nghiệp.
1.2. MYSQL (Cơ Sở Dữ Liệu )

Hình 2 : Cơ sở dữ liệu MYSQL

4


MySQL là hệ quản trị dữ liệu miễn phí, được tích hợp sử dụng chung với Apache, PHP.
Chính yếu tố phát triển trong cộng đồng mã nguồn mở nên MySQL đã qua rất nhiều sự
hỗ trợ của những lập trình viên u thích mã nguồn mở. 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. Nhưng MySQL khơng bao qt tồn
bộ những câu truy vấn cao cấp như SQL. Về bản chất MySQL chỉ đáp ứng việc truy
xuất đơn giản trong quá trình vận hành của website nhưng hầu hết có thể giải quyết các
bài toán trong PHP.
MySQL là cơ sở dữ liệu tốc độ cao, ổn định và dễ sử dụng, hoạt động trên nhiều hệ điều
hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh. Với tốc độ và tính bảo mật
cao, MySQL rất thích hợp cho các ứng dụng có truy cập CSDL trên internet. MySQL
miễn phí hồn tồn cho nên bạn có thể tải về MySQL từ trang chủ. 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 đang được sử dụng cho nhiều công việc kinh doanh từ nhỏ
tới lớn.

1.3. HTML

Hinh 3 : HTML Language

HTML được viết tắt của cụm từ Hypertext Markup Language . Là một ngôn ngữ đánh

dấu , HTML được sử dụng để tạo và cấu trúc các thành phần trong trang web hoặc ứng
dụng, phân chia các đoạn văn, heading, titles, blockquotes… và HTML khơng phải là
ngơn ngữ lập trình.
HTML là một chuẩn ngôn ngữ internet được tạo ra và phát triển bởi tổ chức World
Wide Web Consortium còn được viết tắc là W3C. Trước đó thì HTML xuất bản theo
chuẩn của RFC. HTML được tương thích với mọi hệ điều hành cùng các trình duyệt của
nó. Khả năng dễ học, dễ viết là một ưu điểm của HTML không những vậy việc soạn
thảo đòi hỏi hết sức đơn giản, chúng ta có thể dùng word, notepad hay bất cứ một trình
soạn thảo văn bản nào để viết và chỉ cần lưu với định dạng “.html “ hoặc “.htm” là đã
có thể tạo ra một file chứa HTML. Hiện nay, phiên bản mới nhất của HTML là HTML5
với nhiều tính năng ưu việt so với các phiên bản cũ HTML cải tiến khá nhiều đặc biệt
hỗ trợ mạnh mẽ các phần tử multimedia mà không cần các plugin. Một tập tin HTML
bao gồm trong đó là các đoạn văn bản HTML, được tạo lên bởi các thẻ HTML. HTML5
nói chung mạnh mẽ hơn nhiều không chỉ về tốc độ và độ thích ứng cao mà chính là khả
5


năng hỗ trợ API (Application Programming Interface - giao diện lập trình ứng dụng) và
DOM (Document Object Model – các đối tượng thao tác văn bản).
1.4. CSS

Hình 4 : CSS (Cascading Style Sheets)

CSS (Cascading Style Sheets) là một ngôn ngữ quy định cách trình bày
cho các tài liệu viết bằng HTML, XHTML, XML, SVG, hay UML,…CSS quy định
cách hiển thị của các thẻ HTML bằng cách quy định các thuộc tính của các thẻ đó (font
chữ, kích thước, màu sắc...).
CSS có cấu trúc đơn giản và sử dụng các từ tiếng anh để đặt tên cho các thuộc tính. CSS
khi sử dụng có thể viết trực tiếp xen lẫn vào mã HTML hoặc tham chiếu từ một file css
riêng biệt. Hiện nay CSS thường được viết riêng thành một tập tin với mở rộng là “.css”.

Chính vì vậy mà các trang web có sử dụng CSS thì mã HTML sẽ trở nên ngắn gọn hơn.
Ngồi ra có thể sử dụng một tập tin CSS đó cho nhiều website tiết kiệm rất nhiều thời
gian và công sức. Một đặc điểm quan trọng đó là tính kế thừa của CSS do đó sẽ giảm
được số lượng dòng code mà vẫn đạt được u cầu.
1.5. JavaScript

Hình 5 : JavaScript

JavaScript là một ngơn ngữ lập trình của HTML và WEB. Nó là nhẹ và được sử dụng
phổ biến nhất như là một phần của các trang web, mà sự thi hành của chúng cho phép
6


Client-Side script tương tác với người sử dụng và tạo các trang web động. Nó là một
ngơn ngữ chương trình thông dịch với các khả năng hướng đối tượng.
JavaScript được biết đến đầu tiên với tên Mocha, và sau đó là LiveScript, nhưng cơng
ty Netscape đã đổi tên của nó thành JavaScript, bởi vì sự phổ biến như là một hiện tượng
của Java lúc bấy giờ. JavaScript xuất hiện lần đầu trong Netscape 2.0 năm 1995 với tên
LiveScript. Core đa năng của ngôn ngữ này đã được nhúng vào Netscape, IE, và các
trình duyệt khác.

2.Cơng cụ hỗ trợ
2.1. XAMPP

Hình 1 : Cơng cụ server XAMPP

Xampp là chương trình tạo máy chủ Web (Web Server) được tích hợp
sẵn Apache, PHP, MySQL, FTP Server, Mail Server và các công cụ như phpMyAdmin.
Không như Appserv, Xampp có chương trình quản lý khá tiện lợi, cho phép chủ động
bật tắt hoặc khởi động lại các dịch vụ máy chủ bất kỳ lúc nào.

Xampp là một chương trình mã nguồn mở máy chủ web đa nền được phát triển
bởi Apache Friends, bao gồm chủ yếu là Apache HTTP Server, MariaDB database, và
interpreters dành cho những đối tượng sử dụng ngôn ngữ PHP và Perl. Xampp là viết
tắt của Cross-Platform (đa nền tảng-X), Apache (A), MariaDB (M), PHP (P)
và Perl (P). Nó phân bố Apache nhẹ và đơn giản, khiến các lập trình viên có thể dễ dàng
tạo ra máy chủ web local để kiểm tra và triển khai trang web của mình. Tất cả mọi thứ
cần cho phát triển một trang web - Apache (ứng dụng máy chủ), Cơ sở dữ liệu
(MariaDB) và ngôn ngữ lập trình (PHP) được gói gọn trong 1 tệp. Xampp cũng là 1
chương trình đa nền tảng vì nó có thể chạy tốt trên cả Linux, Windows và MacOS. Hầu
hết việc triển khai máy chủ web thực tế đều sử dụng cùng thành phần như XAMPP nên
rất dễ dàng để chuyển từ máy chủ local sang máy chủ online.

7


2.2. PHPStorm

PhpStorm là một mơi trường phát triển tích hợp (IDE), đa nền tảng cho PHP, được xây
dựng bởi công ty JetBrains, hãng phần mềm hàng đầu thế giới về các cơng cụ cho lập
trình và phát triển. PhpStorm cung cấp trình soạn thảo cho PHP, HTML và JavaScript
với khả năng phân tích mã nhanh, ngăn ngừa lỗi và tái cấu trúc tự động cho mã PHP và
JavaScript.
JetBrains PhpStorm được sử dụng chủ yếu bởi các nhà phát triển web, những người cần
những cơng cụ thích hợp để chỉnh sửa PHP, HTML, CSS, JavaScript và các tập tin
XML.
PhpStorm giúp người dùng tạo và chỉnh sửa mã nguồn bất kể ngôn ngữ lập trình mà họ
đang sử dụng. Như bất kỳ trình soạn thảo IDE khác, nó đi kèm với các tính năng cơ bản
như đánh dấu trang, hồn thành mã, phóng to thu nhỏ, các điểm ngắt, vv. Tuy nhiên, nó
có chứa các tính năng khác nhau như các macro, phân tích mã và nhanh chóng chuyển
hướng để làm cho công việc của bạn dễ dàng hơn nhiều.

PhpStorm được phát triển bằng ngơn ngữ Java do đó thừa hưởng rất nhiều lợi ích từ
ngơn ngữ này, phần mềm chạy rất nhanh trên Linux, thích hợp code PHP, tối ưu việc sử
dụng tài ngun,…
2.3. Navicat

Hình 3: Navicat

Navicat Premium là một cơng cụ quản trị cơ sở dữ liệu đa kết nối nâng cao cho phép
bạn kết nối đồng thời với tất cả các loại cơ sở dữ liệu một cách dễ dàng. Navicat cho
phép bạn kết nối với cơ sở dữ liệu MySQL, MariaDB, Oracle, PostgreSQL, SQLite và
SQL Server từ một ứng dụng duy nhất, giúp quản trị cơ sở dữ liệu trở nên dễ dàng.
8


Sẽ khơng cịn phải sử dụng cửa sổ dịng lệnh đơn đọc bạn có thể dễ dàng và nhanh chóng
xây dựng, quản lý và duy trì một cơ sở dữ liệu của mình bằng giao diện sinh động. Nó
có thể giúp bạn kết nói với một máy chỉ database ở xa và cung cấp các cơng cụ tiện ích
mà bạn có thể sẽ bất ngờ. Chương trình hồn tồn tương thích với các cơ sở dữ liệu địa
phương, mạng cũng như các đám mây như Amazon, SQL Azure, Oracle Cloud và
Google Cloud.

3.Thư viện sử dụng
3.1. Laravel PHP Framwork

Hình 1 : Laravel PHP Frameword

Laravel là một PHP framework mã nguồn mở và miễn phí, được phát triển bởi Taylor
Otwell và nhắm vào mục tiêu hỗ trợ phát triển các ứng dụng web theo kiến trúc modelview-controller (MVC). Những tính năng nổi bật của Laravel bao gồm cú pháp dễ hiểu
– rõ ràng , một hệ thống đóng gói modular và quản lý gói phụ thuộc, nhiều cách khác
nhau để truy cập vào các cơ sở dữ liệu quan hệ, nhiều tiện ích khác nhau hỗ trợ việc

triển khai vào bảo trì ứng dụng .
Tháng 6/2011, Taylor Otwell – người đã tạo ra bộ công cụ trợ giúp này .Đã đưa Laravel
vào hoạt động như một giải pháp thay thế cho CodeIgniter. Với giải pháp này, lập trình
viên (developer) đã được hỗ trợ nhiều tính năng mới mẻ với thao tác vơ cùng đơn giản.
Eloquent ORM mạnh mẽ, xác thực đơn giản, phân trang hiệu quả, …là những tính năng
thu hút sự chú ý của đông đảo người dùng của phiên bản đầu tiên này.
3.2. JQuery

Hinh 2 : Thư Viện JQuery

9


JQuery là một thư viện JavaScript đa tính năng, nhỏ gọn, nhanh, được tạo bởi John
Resig vào năm 2006 với một phương châm hết sức ý nghĩa: Write less, do more - Viết
ít hơn, làm nhiều hơn.
JQuery đơn giản hóa việc duyệt tài liệu HTML, xử lý sự kiện, hoạt ảnh và tương tác
Ajax để phát triển web nhanh chóng. Các phân tích web đã chỉ ra rằng, jQuery là thư
viện JavaScript được triển khai rộng rãi nhất.
JQuery là một bộ công cụ JavaScript được thiết kế để đơn giản hóa các tác vụ khác
nhau bằng cách viết ít code hơn.
Các tính năng quan trọng mà JQuery hỗ trợ như : DOM (Document Object Model) ,
AJAX (Asynchronous Javascript and XML) , Xử lý sự kiện , Hiệu ứng động , gọn nhẹ
và hỗ trợ hầu hết bởi các trình duyệt hiện đại .
3.3. Bootstrap

Hình 3 : Thư viện Bootstrap

Bootstrap là nền tảng framework HTML, CSS hay JavaScript cho phép lập trình viên có
thể thiết được được website dựa trên responsive web mobile. Là một front-end

framework hồn tồn miễn phí, giúp cho quá trình phát triển website được dễ dàng và
tiện lợi hơn rất nhiều.
Hiện nay Bootstrap đã có rất nhiều mẫu thiết kế được dựa trên các ngôn ngữ lập trình
trên HTML và CSS như typography, form, buttons, tables hay navigitations, modals hay
images … cũng như có nhiều các plugin JavaScript tuỳ chọn khác nhau.
Bootstrap được xây dựng và phát triển bởi Mark Otto và Jacob Thornton tại Twitter, và
được phát hành giống như một sản phẩm nguồn mở vào tháng 8/2011 trên GitHub.

10


Chương 2. PHÂN TÍCH MƠ HÌNH HỆ THỐNG
2.1. Phân tích yêu cầu
2.1.1.Yêu cầu về chức năng hệ thống
-Về phía người dùng (user):
 Đăng ký, đăng nhập
 Xem chi tiết sản phẩm
 Tìm kiếm sản phẩm
 Chọn hàng, mua hàng và thanh tốn
 Bình luận, đánh giá sản phẩm
 Thêm vào giỏ hàng, cập nhật giỏ hang
 Thêm danh sách các món đồ được u thích , cập nhập danh sách
 Trang quản lý xem chi tiết đơn hàng đã đặt , bình luận , đánh giá
 Lọc sản phẩm
 Xem thông tin hỗ trợ của cửa hàng
 Cho phép liên hệ với người quản trị.
-Về phía quản trị (admin)
 Đăng nhập: Thơng tin đăng nhập có sẵn của quản trị viên sẽ
được tạo sẵn khi website được đưa vào sử dụng .
 Thống kê: Thống kê doanh thu , thống kê sản phẩm và số lượng

sản phẩm bán ra
 Quản lý tệp hình ảnh (File Manager)
 Quản lý danh mục: Quản lý, thêm, sửa, xóa, danh mục
 Quản lý sản phẩm: Quản lý, thêm, sửa, xóa, sản phẩm
 Quản lý thương hiệu: Quản lý, thêm, sửa, xóa thương hiệu
 Quản lý đơn vị giao hàng: Quản lý, thêm, sửa, xóa các đơn vị vận
chuyện hàng cho cửa hàng hiện tại
 Quản lý đánh giá : Quản lý, sửa, xóa các đánh giá của khách hàng
 Quản lý bài viết : Quản lý, thêm, sửa, xóa, cập nhập các tin tức
mới nhất cho cửa hàng, thêm danh mục dễ quản lý bài viết, thêm
thẻ tag dễ cho khách hàng tìm kiếm nắm bắt được thông tin khi
cần
 Quản lý thành viên: Quản lí lượng khách hàng đăng kí và sử dụng
website
 Quản lý mã giảm giá : Quản lý, thêm, sửa, xóa mã giảm giá theo
từng thời kỳ của cửa hàng áp dụng
 Quản lý đơn hàng: Kiểm tra tình trạng đơn hàng , kiểm duyệt
thông tin và giao hàng cho khách hàng đặt hàng .
 Quản lý cài đặt cho hệ thống : Cập nhật giao diện, quảng cáo
website

11


2.1.2.Yêu cầu về hình thức
-Giao diện thân thiện, dễ dùng
-màu sắc hài hòa
-Bố cục các chức năng hợp lý
-cho pháp người dùng chọn nhanh các sản phầm thông qua danh sách có sẵn
2.1.3.u cầu về bảo mật:

-Về phía người dùng: cần phải đăng nhập để mua hàng, cũng như bình luận và
đánh giá sản phẩm, nếu chưa có tài khoản thì có thể đăng ký…
-Về phía người quản trị: đăng nhập để quản lý dữ liệu website

2.2.Phân tích chức năng
2.2.1.Sơ đồ chức năng quản lý admin:

Đăng nhập

Trang quản trị

Trang
chủ

Hình
ảnh

slide

Danh
mục

Sản
phẩm

Thươ
ng
hiệu

Vận

Chuy
ển

Đơn
hàng

Tài
khoả
n

Bài
viết

Giảm
giá

Đánh
giá

Kiểm tra, xóa

Thêm, sửa, xóa

Hình 2.2.1.Sơ đồ chức năng admin

12

Đổi mật khẩu

Bình

luận


2.2.1.Sơ đồ chức năng trang người dùng

Đăng nhập

Trang người dùng

Trang chủ

Đơn hàng

Tài khoản

Bình luận

Đổi mật khẩu

Kiểm tra

Kiểm tra, sửa, xóa

Hình 2.2.1.Sơ đồ chức năng khách hàng

13

Đánh giá

2.3. Sơ đồ use case
2.3.1. Sơ đồ use case tổng qt

Hình 2.3.1. Sơ đồ use case tổng qt
Chú thích : QL => Quản lý

14


2.3.2. Sơ đồ use case đăng nhập admin

Hình 2.3.2. Sơ đồ use case đăng nhập admin

Tác nhân: Admin
Mô tả: Use case cho admin đăng nhập vào hệ thống.
Điều kiện trước: admin đăng nhập vào hệ thống.
Dịng sự kiện chính:
Chọn chức năng đăng nhập.
Giao diện đăng nhập hiển thị.
 Nhập mã admin, mật khẩu vào giao diện đăng nhập.
 Hệ thống kiểm tra mã admin và mật khẩu nhập của admin. Nếu nhập sai mã
admin hoặc mật khẩu thì chuyển sang dịng sự kiện rẽ nhánh A1. Nếu nhập đúng thì hệ
thống sẽ chuyển tới trang quản trị.
Use case kết thúc.
Dòng sự kiện rẽ nhánh:
15