HỌC VIỆN KỸ THUẬT MẬT MÃ

KHOA CÔNG NGHỆ THÔNG TIN

ĐỒ ÁN MÔN HỌC
THỰC TẬP CƠ SỞ

Đề tài:
XÂY DỰNG WEBSITE BÁN GIÀY ONLINE

Sinh viên thực hiện: Chu Ngọc Thủy AT150355

Phạm Thị Diễm Trinh AT150357
Thân Ngọc Hiếu AT150318
Nhóm 6
Giảng viên hướng dẫn: ThS. LÊ ĐỨC THUẬN

Hà Nội, 8-2021
MỤC LỤC

1
Lời mở đầu 1
CHƯƠNG 1: TỔNG QUAN VỀ NGÔN NGỮ VÀ CÁC CÔNG CỤ HỖ TRỢ 2
1.1. Các ngôn ngữ thông dụng 2
1.1.1. Ngôn ngữ HTML 2
1.1.2. Ngôn ngữ CSS 2
1.2. Một số thư viện hỗ trợ 3
1.2.1. Thư viện Javascript 3
1.2.2. Thư viện Ajax 3
1.2.3. Thư viện Jquery 4
1.2.4. Thư viện Bootstrap 5
1.2.5. Thư viện Java Spring Boot 5
1.3. Cơ sở dữ liệu MySQL 6
1.3.1. Cơ sở dữ liệu MySQL 6
1.3.2. Các thành phần của cơ sở dữ liệu MySQL 7
CHƯƠNG 2. PHÂN TÍCH, THIẾT KẾ VÀ XÂY DỰNG WEBSITE 8
2.1 Phân tích Website 8
2.1.1 Phân tích yêu cầu người dùng 8
2.1.2 Các chức năng của Website 8
2.2 Thiết kế Website 11
2.2.1 Thiết kế cơ sở dữ liệu 11
2.2.2 Thiết kế giao diện 11
CHƯƠNG 3. KẾT QUẢ WEBSITE 13
3.1 Mô hình Website 13
3.2 Ứng dụng Website 13
3.2.1 Các tính năng dành cho khách hàng 13
3.2.2 Các tính năng dành cho quản trị viên 13
KẾT LUẬN 14
TÀI LIỆU THAM KHẢO 14

0
 LỜI MỞ ĐẦU

Với sự phát triển mạnh mẽ của công nghệ thông tin hiện nay, Internet ngày càng
giữ vai trò quan trọng trong các lĩnh vực khoa học và đời sống. Cùng với sự phát triển
của Internet, ngày nay, việc sở hữu một Website không còn là điều xa lạ, thậm chí
trong một số trường hợp còn là tiêu chuẩn bắt buộc đối với doanh nghiệp – công ty
trong thời điểm cạnh tranh mang tính toàn cầu như hiện nay. Đề tài “Xây dựng
Website bán giày online” của chúng em muốn giúp công ty kinh doanh giày có một
Website độc quyền, có thể giới thiệu sản phẩm đến mọi người tiêu dùng bằng cách bán
hàng trực tuyến và thanh toán online, góp phần đưa ra giải pháp để công ty đạt hiệu
quả kinh doanh tốt nhất, xây dựng quảng bá nâng cao thương hiệu, liên kết và hợp tác
quốc tế. Đồng thời giúp công ty sát nhập với mô hình kinh doanh thương mại điện tử
đang vô cùng được ưa chuộng hiện nay. Mục tiêu của đề tài: xây dựng các chức năng
cơ bản của một Website bán hàng thương mại. Website có khả năng tương thích, hiển
thị trên tất cả các thiết bị hiện đại; hiển thị được sản phẩm đẹp, thu hút người tiêu
dùng; hỗ trợ khách hàng một cách nhanh nhất; quản lý các mặt hàng, đơn hàng, số
lượng của sản phẩm một cách hiệu quả nhất; thống kê được doanh thu và những vấn
đề còn tồn đọng của công ty. Cùng với việc nắm bắt được công nghệ thiết kế web bằng
HTML, CSS, JQUERY, JAVASCRIPT, CSS, MYSQL, … ứng dụng các mô hình vào
xây dựng trang web. Đề tài gồm các nội dung sau: tìm hiểu, ứng dụng các ngôn ngữ,
thư viện phục vụ trong quá trình thiết kế website; thiết kế đặc tả hệ thống; xây dựng cơ
sở dữ liệu và mô hình quản lý, bán hàng của website để đạt hiệu quả tốt nhất.

1
 CHƯƠNG 1: TỔNG QUAN VỀ NGÔN NGỮ VÀ
CÁC CÔNG CỤ HỖ TRỢ

1.1. Các ngôn ngữ thông dụng

1.1.1. Ngôn ngữ HTML
HTML (viết tắt của từ Hypertext Markup Language, hay là "Ngôn ngữ Đánh
dấu Siêu văn bản") là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang
web trên World Wide Web. Nó có thể được trợ giúp bởi các công nghệ như CSS và các
ngôn ngữ kịch bản giống như JavaScript.
Các trình duyệt web nhận tài liệu HTML từ một web server hoặc một kho lưu
trữ cục bộ và render tài liệu đó thành các trang web đa phương tiện. HTML mô tả cấu
trúc của một trang web về mặt ngữ nghĩa và các dấu hiệu ban đầu được bao gồm cho
sự xuất hiện của tài liệu.
Các phần tử HTML là các khối xây dựng của các trang HTML. Với cấu trúc
HTML, hình ảnh và các đối tượng khác như biểu mẫu tương tác có thể được nhúng
vào trang được hiển thị. HTML cung cấp một phương tiện để tạo tài liệu có cấu trúc
bằng cách biểu thị ngữ nghĩa cấu trúc cho văn bản như headings, paragraphs,
lists, links, quotes và các mục khác. Các phần tử HTML được phân định bằng các tags,
được viết bằng dấu ngoặc nhọn. Các tags như <img /> và <input /> giới thiệu trực tiếp
nội dung vào trang. Các tags khác như <p> bao quanh và cung cấp thông tin về văn
bản tài liệu và có thể bao gồm các thẻ khác làm phần tử phụ. Các trình duyệt không
hiển thị các thẻ HTML, nhưng sử dụng chúng để diễn giải nội dung của trang.
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. HTML5 mạnh mẽ hơn rất nhiều không chỉ về
tốc độ và độ thích ứng cao mà còn về khả 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.1.2. Ngôn ngữ CSS
CSS (Cascading Style Sheets) là một ngôn ngữ định kiểu được sử dụng để mô
tả bản trình bày của một tài liệu được viết bằng HTML hoặc XML (bao gồm các
phương thức XML như SVG, MathML hoặc XHTML). CSS mô tả các phần tử sẽ được
hiển thị trên màn hình, trên giấy, trong lời nói hoặc trên các phương tiện khác.
CSS là một trong những ngôn ngữ cốt lõi của web mở và được chuẩn hóa trên
các trình duyệt Web theo các bộ thông số kỹ thuật của W3C. Trước đây, việc phát triển
các phần khác nhau của đặc tả CSS đã được thực hiện đồng bộ, cho phép tạo phiên bản
cho các đề xuất mới nhất. CSS được sử dụng để tạo kiểu và bố cục các trang web – ví
2
dụ: để thay đổi phông chữ, màu sắc, kích thước và khoảng cách của nội dung, chia nó
thành nhiều cột hoặc thêm hoạt ảnh và các tính năng khác.
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. Ngoà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 yêu cầu. Tuy nhiên, đối với
CSS thì các trình duyệt hiểu theo kiểu riêng của nó. Do vậy, việc trình bày một nội
dung trên các trình duyệt khác nhau là không thống nhất. CSS cung cấp hàng trăm
thuộc tính trình bày dành cho các đối tượng với sự sáng tạo cao trong việc kết hợp các
thuộc tính giúp mang lại nhiều hiệu quả.
1.2. Một số thư viện hỗ trợ
1.2.1. Thư viện Javascript
JavaScript là một ngôn ngữ lập trình động được sử dụng để phát triển web,
trong các ứng dụng web, để phát triển trò chơi, v.v. Nó cho phép triển khai các tính
năng động trên các trang web không thể thực hiện được chỉ với HTML và CSS.
Javascript được tích hợp và nhúng trong HTML và giúp cho website trở nên sống động
hơn. Đây là dạng ngôn ngữ theo kịch bản, được hình thành dựa trên chính đối tượng
phát triển có sẵn hoặc đơn giản là tự định nghĩa ra. Javascript cho phép bạn kiểm soát
các hành vi của trang web tốt hơn so với việc chỉ sử dụng mỗi HTML. Có thể kể đến
một vài ứng dụng thực tiễn cực kỳ quen thuộc của Javascript như slideshow, pop-up
quảng cáo hay tính năng autocomplete của Google, … chúng đều được viết bằng ngôn
ngữ Javascript. JavaScript, theo phiên bản hiện hành, là một ngôn ngữ lập trình thông
dịch được phát triển từ các ý niệm nguyên mẫu. Ngôn ngữ này được dùng rộng rãi cho
các trang web (phía người dùng) cũng như phía máy chủ (với Node.js). Giống Java,
JavaScript có cú pháp tương tự ngôn ngữ lập trình C. “.js” là phần mở rộng thường
được dùng cho tập tin mã nguồn JavaScript.
1.2.2. Thư viện Ajax
Ajax viết tắt của “Asynchronous JavaScript and XML” là một tập hợp các kỹ
thuật phát triển web khác nhau ở phía máy khách để tạo các ứng dụng web không đồng
bộ. Với Ajax, các ứng dụng web có thể gửi và truy xuất dữ liệu từ máy chủ một cách
không đồng bộ (ở chế độ nền) mà không can thiệp vào việc hiển thị và hoạt động của
trang hiện có. Bằng cách tách lớp trao đổi dữ liệu khỏi lớp trình bày, Ajax cho phép
các trang web và theo phần mở rộng, các ứng dụng web, thay đổi nội dung động mà
không cần tải lại toàn bộ trang. Trong thực tế, các triển khai hiện đại thường sử dụng
JSON thay vì XML.

3
 Ajax là một kỹ thuật phát triển web có tính tương tác cao bằng cách kết hợp các
ngôn ngữ:
- HTML/XHTML làm ngôn ngữ chính và CSS để tạo phong cách.
- The Document Object Model (DOM) để hiển thị dữ liệu động và tạo tương
tác.
- XML để trao đổi dữ liệu nội bộ và XSLT để xử lý nó. Nhiều lập trình viên
đã thay thế bằng JSON vì nó gần với JavaScript hơn.
- XMLHttpRequest object để giao tiếp bất đồng bộ.
- Cuối cùng, JavaScript là ngôn ngữ lập trình để kết nối toàn bộ các công
nghệ trên lại.
1.2.3. Thư viện Jquery
Jquery là thư viện được viết từ JavaScript, Jquery giúp xây dựng các chức năng
bằng Javascript dễ dàng, nhanh và giàu tính năng hơn. Jquery được tích hợp nhiều
module khác nhau. Từ module hiệu ứng cho đến module truy vấn
selector. Jquery được sử dụng đến 99% trên tổng số website trên thế giới. Cú pháp của
Jquery được thiết kế để giúp điều hướng tài liệu, chọn các phần tử DOM, tạo hoạt ảnh,
xử lý sự kiện và phát triển các ứng dụng Ajax dễ dàng hơn.
Thư viện Jquery cung cấp cú pháp đơn giản để thêm trình xử lý sự kiện vào
DOM bằng JavaScript, thay vì thêm các thuộc tính sự kiện HTML để gọi các hàm
JavaScript. Do đó, nó khuyến khích các nhà phát triển tách hoàn toàn mã JavaScript
khỏi đánh dấu HTML. Jquery thúc đẩy sự ngắn gọn và rõ ràng với các tính năng như
hàm "có thể đọc được" và tên hàm viết tắt. Công cụ JavaScript của các trình duyệt
khác nhau hơi khác nhau nên mã JavaScript hoạt động cho một trình duyệt này có thể
không hoạt động cho một trình duyệt khác. Giống như các bộ công cụ JavaScript khác,
Jquery xử lý tất cả các điểm không nhất quán giữa các trình duyệt này và cung cấp một
giao diện nhất quán hoạt động trên các trình duyệt khác nhau. Có thể dễ dàng thêm các
sự kiện, phần tử và phương thức mới và sau đó được sử dụng lại như một plugin.
Jquery bao gồm các tính năng sau:
- Lựa chọn phần tử DOM bằng cách sử dụng công cụ chọn mã nguồn mở đa
trình duyệt Sizzle, một sản phẩm phụ của dự án Jquery
- Thao tác DOM dựa trên bộ chọn CSS sử dụng tên và thuộc tính của phần tử,
chẳng hạn như id và lớp, làm tiêu chí để chọn các nút trong DOM
- Sự kiện
- Hiệu ứng và hình ảnh động
- Ajax
- Đối tượng Deferred và Promise để kiểm soát quá trình xử lý không đồng bộ
- Phân tích cú pháp JSON
- Khả năng mở rộng thông qua các trình cắm thêm
- Các tiện ích, chẳng hạn như phát hiện tính năng
4
 - Các phương thức tương thích vốn có sẵn trong các trình duyệt hiện đại,
nhưng cần dự phòng cho các trình duyệt cũ hơn, chẳng hạn như
Jquery.inArray () và Jquery.each ().
- Hỗ trợ nhiều trình duyệt
1.2.4. Thư viện Bootstrap
Bootstrap là một khuôn khổ CSS mã nguồn mở và miễn phí hướng đến phát
triển web front-end đáp ứng trên thiết bị di động. Nó chứa các mẫu thiết kế dựa trên
CSS và (tùy chọn) JavaScript cho kiểu chữ, biểu mẫu, nút, điều hướng và các thành
phần giao diện khác.
Bootstrap là một Thư viện HTML, CSS & JS tập trung vào việc đơn giản hóa
việc phát triển các trang web thông tin (trái ngược với các ứng dụng web). Mục đích
chính của việc thêm nó vào một dự án web là áp dụng các lựa chọn về màu sắc, kích
thước, phông chữ và bố cục của Bootstrap cho dự án đó.
Thiết kế đáp ứng giúp trang web hoặc ứng dụng có thể phát hiện kích thước và
hướng màn hình của khách truy cập và tự động điều chỉnh màn hình cho phù hợp;
phương pháp tiếp cận đầu tiên dành cho thiết bị di động giả định rằng điện thoại thông
minh, máy tính bảng và ứng dụng dành cho thiết bị di động dành riêng cho tác vụ là
công cụ chính của nhân viên để hoàn thành công việc và giải quyết các yêu cầu của
những công nghệ đó trong thiết kế.
Ưu điểm của Bootstrap.
- Tiết kiệm thời gian: Bootstrap giúp người thiết kế giao diện website tiết kiệm
rất nhiều thời gian. Các thư viện Bootstrap có những đoạn mã sẵn sàng cho bạn
áp dùng vào website của mình. Bạn không phải tốn quá nhiều thời gian để tự
viết code cho giao diện của mình.
- Tùy biến cao: Bạn hoàn toàn có thể dựa vào Bootstrap và phát triển nền tảng
giao diện của chính mình. Bootstrap cung cấp cho bạn hệ thống Grid System
mặc định bao gồm 12 bột và độ rộng 940px. Bạn có thể thay đổi, nâng cấp và
phát triển dựa trên nền tảng này.
- Responsive Web Design: Với Bootstrap, việc phát triển giao diện website để
phù hợp với đa thiết bị trở nên dễ dàng hơn bao giờ hết. Đây là xu hướng phát
triển giao diện website đang rất được ưa chuộng trên thế giới.
1.2.5. Thư viện Java Spring Boot
Spring Boot là một khung công tác dựa trên Java mã nguồn mở được sử dụng
để tạo một dịch vụ vi mô. Nó được phát triển bởi Pivotal Team và được sử dụng để
xây dựng các ứng dụng Spring độc lập và sẵn sàng sản xuất. Spring Boot cung cấp một
nền tảng tốt cho các nhà phát triển Java để phát triển một ứng dụng mùa xuân độc lập
và cấp

5
sản xuất mà bạn có thể chạy. Bạn có thể bắt đầu với các cấu hình tối thiểu mà không
cần thiết lập toàn bộ cấu hình Spring. Spring Boot ra đời với mục đích loại bỏ những
cấu hình phức tạp của Spring, nó không yêu cầu cấu hình XML và nâng cao năng suất
cho các nhà phát triển. Với sự góp mặt của Spring Boot, hệ sinh thái Spring đã trở nên
mạnh mẽ, phổ biến và hiệu quả hơn bao giờ hết.
Các đặc tính cơ bản của Spring Boot như:
- SpringApplication: SpringApplication là một class giúp khởi chạy các ứng dụng
từ hàm main thuận tiện. Để bắt đầu ứng dụng, bạn chỉ cần gọi các method run.
- Profiles: Spring Boot Profiles sẽ cung cấp một cách phân chia các cấu hình cho
từng môi trường. Các annotation là @Component hoặc @Configuration có thể
sẽ được đánh dấu profiles để giới hạn thời điểm hoặc môi trường sẽ được tải
lên.
- Externalized Configuration: Externalized Configuration cho phép bạn có khả
năng cấu hình được từ bên ngoài. Vì vậy, một ứng dụng được xây dựng có thể
được vận hành và hoạt động trên nhiều môi trường khác nhau. Để thực hiện
Externalized Configuration bạn có thể sử dụng các file properties, YAML, các
tham số command line hay các biến môi trường.
- Logging: Tất cả các chức năng log nội bộ đều được spring boot sử dụng
common logging. Chúng được quản lý một cách mặc định. Vì vậy, bạn không
nên hoặc không cần sửa các dependency logging nếu các tuỳ biến
customization không được yêu cầu.
1.3. Cơ sở dữ liệu MySQL
1.3.1. Cơ sở dữ liệu MySQL
MySQL là một hệ quản trị cơ sở dữ liệu quan hệ nguồn mở (RDBMS) tốc độ
cao, được vận hành theo mô hình máy khách – máy chủ (client-server). Tên của nó là
sự kết hợp của "My", tên của con gái đồng sáng lập Michael Widenius, và "SQL", tên
viết tắt của Structured Query Language. Cơ sở dữ liệu quan hệ tổ chức dữ liệu thành
một hoặc nhiều bảng dữ liệu trong đó các kiểu dữ liệu có thể liên quan với nhau. SQL
là ngôn ngữ lập trình viên sử dụng để tạo, sửa đổi và trích xuất dữ liệu từ cơ sở dữ liệu
quan hệ, cũng như kiểm soát quyền truy cập của người dùng vào cơ sở dữ liệu. Ngoài
cơ sở dữ liệu quan hệ và SQL, một RDBMS như MySQL hoạt động với hệ điều hành
để triển khai cơ sở dữ liệu quan hệ trong hệ thống lưu trữ của máy tính, quản lý người
dùng, cho phép truy cập mạng và tạo điều kiện kiểm tra tính toàn vẹn của cơ sở dữ liệu
và tạo bản sao lưu.
Hệ thống quản trị này được tích hợp với apache và PHP, tương thích với rất
nhiều trình duyệt, hệ điều hành như Ubuntu, Linux, macOS, Microsoft Windows, ...
Hiện phần mềm này được dùng trong các trang web lớn như Google, Facebook,
Twitter, Yahoo và YouTube. MySQL là một trong những ví dụ rất cơ bản về Hệ Quản

6
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:
- MySQL là một chương trình rất mạnh, xử lý một tập hợp các chức năng của các
gói cơ sở dữ liệu mạnh mẽ và đắt tiền nhất. Nó được phát hành theo nguồn mở
nên sử dụng không mất phí.
- MySQL sử dụng một dạng chuẩn của ngôn ngữ dữ liệu SQL nổi tiếng.
- MySQL làm việc trên nhiều hệ điều hành và với nhiều ngôn ngữ như PHP,
PERL, C, C++, Java, …
- MySQL hoạt động rất nhanh và hoạt động tốt ngay cả với các tập dữ liệu lớn.
- MySQL hỗ trợ các cơ sở dữ liệu lớn, lên tới 50 triệu hàng hoặc nhiều hơn nữa
trong một bảng. Kích cỡ file mặc định được giới hạn cho một bảng là 4GB
(Gigabyte), nhưng bạn có thể tăng kích cỡ này (nếu hệ điều hành của bạn có thể
xử lý nó) để đạt tới giới hạn lý thuyết là 8 terabyte (TB).
- MySQL là tùy biến, giấy phép GPL mã nguồn mở cho phép lập trình viên sửa
đổi phần mềm MySQL để phù hợp với môi trường cụ thể của họ.
1.3.2. Các thành phần của cơ sở dữ liệu MySQL
- Người dùng: là người thực sự sử dụng cơ sở dữ liệu. Người dùng có thể quản
trị, nhà phát triển hoặc người dùng cuối.
- Dữ liệu hoặc cơ sở dữ liệu: dữ liệu là một trong những yếu tố quan trọng của
cơ sở dữ liệu. Một lượng dữ liệu rất lớn sẽ được lưu trữ trong cơ sở dữ liệu và nó tạo
thành nguồn chính cho tất cả các thành phần khác tương tác với nhau. Có hai loại dữ
liệu. Một là dữ liệu người dùng. Nó chứa dữ liệu chịu trách nhiệm về cơ sở dữ liệu, tức
là dựa trên yêu cầu, dữ liệu sẽ được lưu trữ trong các bảng của cơ sở dữ liệu dưới dạng
hàng và cột. Một dữ liệu khác là siêu dữ liệu. Nó được gọi là 'dữ liệu về dữ liệu', tức là
nó lưu trữ các thông tin như có bao nhiêu bảng, tên của chúng, bao nhiêu cột và tên
của chúng, khóa chính, khóa ngoại, v.v. về cơ bản, các siêu dữ liệu này sẽ có thông tin
về mỗi bảng và các ràng buộc của chúng trong cơ sở dữ liệu.
- DBMS: đây là phần mềm giúp người dùng tương tác với cơ sở dữ liệu. Nó cho
phép người dùng chèn, xóa, cập nhật hoặc truy xuất dữ liệu. Tất cả các hoạt động này
được xử lý bởi các ngôn ngữ truy vấn như MySQL, Oracle, v.v.
- Ứng dụng cơ sở dữ liệu: là chương trình ứng dụng giúp người dùng tương tác
với cơ sở dữ liệu bằng các ngôn ngữ truy vấn. Ứng dụng cơ sở dữ liệu sẽ không có bất
kỳ ý tưởng nào về DBMS cơ bản.

7
 CHƯƠNG 2. PHÂN TÍCH, THIẾT KẾ VÀ XÂY DỰNG
WEBSITE

2.1 Phân tích Website

2.1.1 Phân tích yêu cầu người dùng
2.1.1.1 Yêu cầu của khách hàng
- Giao diện dễ sử dụng và có tính thẩm mỹ cao
- Dung lượng file không quá lớn, thanh menu đơn giản
- Font chữ đơn giản, dễ nhìn, màu sắc hài hòa
- Cho phép khách hàng đăng ký, đăng nhập đảm bảo thông tin
- Xem và thay đổi các thông tin về tài khoản
- Hình thức thanh toán phải đảm bảo tính chính xác
- Cho phép khách hàng xem thông tin chi tiết, tìm kiếm sản phẩm
- Cho phép đặt mua sản phẩm
- Cho phép khách hàng đăng ký tài khoản để nhận thông tin khuyến mãi,
mua hàng thuận tiện
- Cho phép liên hệ với người quản trị
2.1.1.2 Yêu cầu của người quản trị
Ngoài những yêu cầu giống như khách hàng, website phải đảm bảo
những yêu cầu sau:
● Quản lý chung: quản lý sản phẩm, thông tin khách hàng: tên, địa chỉ,
ngày đặt hàng, vận đơn, quản lý giao dịch thanh toán, xử lý đơn, …
● Cập nhật thông tin sản phẩm một cách dễ dàng, có thể thêm, sửa, xóa
thông tin, danh mục, xem báo cáo, thống kê, đơn đặt hàng, …
● Quản lý lưu trữ, thống kê đặt hàng, và trạng thái đơn hàng: đã giao hàng
hay đã hoàn thành …
● Thống kê chi tiết, cụ thể, nhanh chóng. Thống kê được mặt hàng nào bán
hết, mặt hàng nào bán chạy, mặt hàng tồn kho, mặt hàng nào cần chỉnh
sửa, … Tổng hợp thu chi, ý kiến phản hồi của khách hàng, …
● Dễ dàng tư vấn, liên hệ với khách hàng
2.1.2 Các chức năng của Website
2.1.2.1 Đặc tả chức năng :

Bảng 2.1 – Bảng chức năng

STT Chức năng Tác nhân Mô tả

8
 Admin, Yêu cầu quyền truy cập, nhập user, password để
1 Đăng nhập
User thực hiện các chức năng.
Đăng ký tài khoản để thuận tiện mua hàng và cập
2 Đăng ký User
nhật thông tin người dùng
Xem Xem thông tin, nguồn gốc, thông số sản phẩm, giá
Admin,
3 thông tin cả, kích cỡ, màu sắc
User
sản phẩm
Đặt mua sản phẩm, tăng giảm số lượng sản phẩm,
4 Đặt hàng User
thay đổi và hủy sản phẩm
Tìm kiếm Tìm kiếm theo tên, danh mục. giá, nhà cung cấp,
5 User
sản phẩm mặt hàng bán chạy
Thêm, sửa, xóa thông tin và danh mục sản phẩm,
hiển thị, sắp xếp, quản lý, lưu trữ thông tin về sản
Quản lý
6 Admin phẩm như mã sản phẩm, tên, danh mục sản phẩm:
sản phẩm
sản phẩm mới, sản phẩm nổi bật, sản phẩm khuyến
mại
Quản lý Quản lý hoạt động mua bán của khách hàng, lưu trữ
7 khách Admin thông tin: tên, địa chỉ, mã hàng, số điện thoại,
hàng email, …
Quản lý Thêm, sửa, xóa nhà cung cấp sản phẩm
8 nhà cung Admin
cấp
Quản lý Quản lý số lượng mua của khách hàng, thông tin
9 Admin
đơn hàng khách hàng, đơn vị vận chuyển
Thống kê Thống kê mặt hàng bán chạy, mặt hàng tồn kho,
10 Admin
sản phẩm thống kê đơn hàng
Xem thông tin sản phẩm, chọn sản phẩm, thêm sản
11 Giỏ hàng User
phẩm vào giỏ hàng, xóa sản phẩm, hủy giỏ hàng
Quản lý Thêm, sửa, xóa tài khoản người dùng, thay đổi mật
12 User
tài khoản khẩu, địa chỉ và thông tin liên lạc
Phương thức thanh toán, qua ví điện tử, thanh toán
Thanh
13 User sau khi nhận hàng, chọn hình thức vận chuyển để
toán
tiến hàng đặt hàng

2.1.2.2 Đặc tả Usecase và biểu đồ trình tự

- Usecase đăng ký: giúp khách hàng đăng ký tài khoản trên trang web khi khách
hàng có nhu cầu mua hàng.
+ Mô tả chi tiết:
● Load form giao diện chính

9
 ● Khách hàng chọn chức năng: đăng ký tài khoản
● Hệ thống hiển thị các thông tin yêu cầu để đăng ký: tên đăng nhập, mật
khẩu, email, … các thông tin cá nhân liên quan khác
● Khách hàng cung cấp các thông tin và tạo tài khoản
● Hệ thống xác nhận thông tin và tạo tài khoản cho khách hàng
● Lưu trữ thông tin khách hàng
● Website trả về kết quả: đăng ký thành công hoặc không thể đăng ký do
người dùng cung cấp thông tin không hợp lệ hay đã tồn tại hệ thống yêu
cầu người dùng cung cấp lại thông tin.
- Usecase đăng nhập: giúp người dùng đăng nhập vào website.
+ Mô tả chi tiết:
● Người dùng chọn chức năng: đăng nhập vào website
● Hệ thống hiển thị màn hình đăng nhập, yêu cầu người dùng điền đúng
đầy đủ thông tin như tên đăng nhập và mật khẩu.
● Người dùng nhập thông tin vào hệ thống
● Hệ thống kiểm tra thông tin đăng nhập
● Lưu trữ thông tin đăng nhập
● Trả về kết quả đăng nhập: đăng nhập thành công hoặc không thể đăng
nhập khi người dùng nhập sai mật khẩu, tên đăng nhập hay tài khoản
không hợp lệ, hệ thống yêu cầu đăng nhập lại.
- Usecase quản lý bán hàng: giúp quản lý việc bán hàng khi khách hàng mua
hàng, admin đăng nhập vào hệ thống để kiểm tra hàng và lập hóa đơn bán hàng.
+ Mô tả chi tiết:
● Admin đăng nhập vào hệ thống
● Hệ thống kiểm tra thông tin và trả về kết quả
● Admin chọn mục quản lý bán hàng
● Hệ thống hiển thị màn hình quản lý
● Admin kiểm tra số lượng hàng trong kho của mặt hàng khách hàng yêu
cầu
● Hệ thống thông báo số lượng, tình trạng của sản phẩm
● Admin lập hóa đơn cho sản phẩm
● Hệ thống hiển thị hóa đơn: yêu cầu điền đầy đủ thông tin khách hàng,
mặt hàng, số lượng bán hàng đơn giá, đơn vị vận chuyển, cách thức
thanh toán và tính tiền rồi hiển thị kết quả. Thông báo đến người dùng
nếu số lượng hàng trong kho không đủ.
- Usecase thanh toán: Giúp người dùng thanh toán hóa đơn mua hàng, admin
nhận được tiền thanh toán.
+ Mô tả chi tiết:

10
 ● Người dùng đăng nhập vào website, kiểm tra thông tin rồi trả về kết quả
đăng nhập
● Người dùng chọn mục thanh toán
● Hệ thống hiển thị chức năng thanh toán
● Người dùng chọn hóa đơn cần thanh toán
● Hệ thống xử lý yêu cầu, xác nhận thanh toán
● Hiển thị thông báo: đã thanh toán hoặc thanh toán không thành công khi
hóa đơn thanh toán không hợp lệ, người dùng nhập sai hoặc thiếu thông
tin yêu cầu kiểm tra lại.

- Biểu đồ Usecase
- Biểu đồ tuần tự

2.2 Thiết kế Website

2.2.1 Thiết kế cơ sở dữ liệu
2.2.1.1 Bảng cơ sở dữ liệu
2.2.1.2 Mô hình cơ sở dữ liệu quan hệ
2.2.2 Thiết kế giao diện
2.2.2.1 Thiết kế giao diện người dùng
- Giao diện hiển thị
- Giao diện giới thiệu
- Giao diện sản phẩm
- Giao diện giỏ hàng
- Giao diện thanh toán
- Giao diện đăng ký
- Giao diện đăng nhập
- Giao diện chi tiết sản phẩm
2.2.2.2 Thiết kế giao diện người quản trị
- Giao diện quản lý, đăng nhập
- Giao diện danh sách đơn hàng
- Hóa đơn mua hàng
- Giao diện danh mục sản phẩm
- Giao diện chỉnh sửa sản phẩm
- Giao diện thêm sản phẩm
- Giao diện chỉnh sửa thông tin

11
 CHƯƠNG 3. KẾT QUẢ WEBSITE

3.1 Mô hình Website

3.2 Ứng dụng Website
3.2.1 Các tính năng dành cho khách hàng
3.2.2 Các tính năng dành cho quản trị viên

12
 KẾT LUẬN

TÀI LIỆU THAM KHẢO

13