đề tài bài tập lớn xây dựng website bán cafe bánh ngọt

Sử dụng ngôn ngữ HTML, CSS, PHP, Javascript để xây dựng trang web.Lĩnh vực liên quan: Thương mại điện tử2.1 Hoạt động của hệ thống- Là một Website bán sản phẩm cà phê và bánh ngọt.- Ngườ

TRƯỜNG ĐẠI HỌC TÀI NGUYÊN VÀ MÔI TRƯỜNG HÀ NỘIKHOA CÔNG NGHỆ THÔNG TIN

KỲ THI KẾT THÚC HỌC PHẦN HỌC KỲ I NĂM HỌC 2023 – 2024

Đề tài bài tập lớn: “XÂY DỰNG WEBSITE BÁN CAFE & BÁNH NGỌT”

Họ và tên sinh viên : Nguyễn Thị LuyếnNguyễn Hữu TràNguyễn Lan HươngPhùng Thế MạnhLớp : DH11C13

Tên học phần : Phát Triển Hệ Thống Trên Nền WebGiảng viên hướng dẫn: VŨ VĂN HUÂN

HÀ NỘI - 2023

MỤC LỤC

DANH MỤC HÌNH ẢNH 1

DANH MỤC BẢNG BIỂU 3

LỜI NÓI ĐẦU 4

CHƯƠNG 1: TỔNG QUAN VỀ BÀI TOÁN 5

1 Tính cần thiết của đề tài 5

2 Đặc tả yêu cầu bài toán 5

3 Yêu cầu 7

4 Công nghệ sử dụng 8

CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ HỆ THỐNG 16

1 Mô tả bài toán 16

2 Phân tích yêu cầu 17

3 Biểu đồ Uescase 18

4 Biểu đồ tuần tự 23

5 Biểu đồ hoạt động 31

6 Thiết kế cơ sở dữ liệu 35

CHƯƠNG 3: GIAO DIỆN WEB 41

1 Giao diện website 41

2 Giao diện đăng nhập của khách hàng 41

3 Giao diện đăng ký 41

4 Giao diện tìm kiếm sản phẩm 42

5 Giao diện chi tiết sản phẩm 42

6 Giao diện giỏ hàng 43

7 Giao diện thanh toán 43

9 Giao diện đăng nhập trang admin 45

10 Giao diện quản lý sản phẩm 45

11 Giao diện quản lý đơn đặt hàng 47

12 Giao diện quản lý slide 48

13 Giao diện quản lý tài khoản khách hàng 48

14 Giao diện quản lý tài khoản nhân viên 49

KẾT LUẬN 50

TÀI LIỆU THAM KHẢO 51

DANH MỤC HÌNH ẢNH

Hình 1 Biểu đồ Use case tổng quát

Hình 2.1 Biểu đồ Use case phân rã chức năng quản lý giỏ hàng

Hình 2.2 Biểu đồ Use case phân rã chức năng quản lý đơn hàng

Hình 2.3 Biểu đồ Use case phân rã chức năng quản lý sản phẩm

Hình 2.4 Biểu đồ Use case phân rã chức năng quản lý danh mục sản phẩm

Hình 2.5 Biểu đồ Use case phân rã chức năng quản lý tài khoản khách hàng

Hình 2.6 Biểu đồ Use case phân rã chức năng tài khoản nhân viên

Hình 2.7 Biểu đồ tuần tự chức năng đăng nhập

Hình 2.8 Biểu đồ tuần tự chức năng đăng ký

Hình 2.9 Biểu đồ tuần tự chức năng tìm kiếm

Hình 2.10 Biểu đồ tuần tự chức năng thêm sản phẩm vào giỏ hàng

Hình 2.11 Biểu đồ tuần tự chức năng thanh toán

Hình 2.12 Biểu đồ tuần tự chức năng quản lý đơn hàng

Hình 2.13 Biểu đồ tuần tự chức năng thêm mới sản phẩm

Hình 2.14 Biểu đồ tuần tự chức năng chỉnh sửa sản phẩm

Hình 2.15 Biểu đồ tuần tự chức năng xóa sản phẩm

Hình 2.16 Biểu đồ tuần tự chức năng thêm mới danh mục sản phẩm

Hình 2.17 Biểu đồ tuần tự chức năng sửa danh mục sản phẩm

Hình 2.18 Biểu đồ tuần tự chức năng xóa danh mục sản phẩm

Hình 2.19 Biểu đồ tuần tự chức năng xóa tài khoản khách hàng

Hình 2.20 Biểu đồ tuần tự chức năng chỉnh sửa thông tin nhân viên

Hình 2.21 Biểu đồ tuần tự chức năng xóa tài khoản nhân viên

Hình 2.22 Biểu đồ hoạt động chức năng đăng nhập

Hình 2.23 Biểu đồ hoạt động chức năng đăng ký

Hình 2.24 Biểu đồ hoạt động chức năng quản lý giỏ hàng

Hình 2.25 Biểu đồ hoạt động chức năng quản lý đơn hàng

Hình 2.26 Biểu đồ hoạt động chức năng quản lý sản phẩm

Hình 2.27 Biểu đồ hoạt động chức năng quản lý danh mục sản phẩm

Hình 2.28 Biểu đồ hoạt động chức năng quản lý tài khoản khách hàng

Hình 2.29 Biểu đồ hoạt động chức năng quản lý tài khoản nhân viên

Hình 2.30 Mô hình quan hệ cơ sở dữ liệu

Hình 3.1 Giao diện website

Hình 3.2 Giao diện đăng nhập trang khách hàng

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

Hình 3.4 Giao diện tìm kiếm sản phẩm

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

Hình 3.6 Giao diện giỏ hàng

Hình 3.7 Giao diện thanh toán

Hình 3.8 Giao diện thanh toán bằng VNPay

Hình 3.9 Giao diện trang admin

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

Hình 3.11 Giao diện quản lý sản phẩm

Hình 3.12 Giao diện thêm sản phẩm

Hình 3.13 Giao diện sửa sản phẩm

Hình 3.14 Giao diện quản lý đơn hàng

Hình 3.15 Giao diện xử lý đơn hàng

Hình 3.16 Giao diện đơn hàng thành công

Hình 3.17 Giao diện quản lý slide

Hình 3.18 Giao diện thêm slide

Hình 3.19 Giao diện quản lý tài khoản khách hàng

Hình 3.20 Giao diện quản lý tài khoản nhân viên

Hình 3.21 Giao diện cập nhật thông tin tài khoản nhân viên

DANH MỤC BẢNG BIỂU

Bảng 1 Mô tả Usecase quản lý giỏ hàng

Bảng 2 Mô tả Usecase quản lý đơn hàng

Bảng 3 Mô tả Usecase quản lý sản phẩm

Bảng 4 Mô tả Usecase quản lý danh mục sản phẩm

Bảng 5 Mô tả Usecase quản lý tài khoản khách hàng

Bảng 6 Mô tả Usecase quản lý tài khoản nhân viên

LỜI NÓI ĐẦU

Trong thời đại số hóa ngày nay, việc xây dựng một trang web bánhàng là cực kỳ quan trọng đối với các doanh nghiệp để tiếp cận thị trườngrộng lớn và tạo dựng mối quan hệ tốt với khách hàng Một trang web bánhàng hiệu quả không chỉ cung cấp một giao diện thuận tiện cho kháchhàng mua sắm, mà còn cung cấp cho doanh nghiệp một công cụ quản lýtoàn diện để quản lý sản phẩm, đơn hàng, thanh toán và thông tin kháchhàng.

Trong bài báo cáo này, nhóm chúng em quyết định chọn và thực hiện đềtài “Xây dựng website bán coffee và bánh ngọt” Nhằm giúp các doanhnghiệp trong ngành dịch vụ có thể quản lý các hoạt động bán hàng mộtcách hiệu quả, từ việc quản lý sản phẩm, đặt hàng, quản lý kho hàng, đếnviệc xử lý đơn hàng và thanh toán Hệ thống này sẽ mang lại nhiều lợiích, bao gồm tăng cường khả năng quản lý, nâng cao hiệu suất làm việcvà cải thiện trải nghiệm của khách hàng

CHƯƠNG 1: TỔNG QUAN VỀ BÀI TOÁN1 Tính cần thiết của đề tài

Trong thời đại số hóa ngày nay, việc xây dựng một trang web bán hàng là cực kỳ quan trọng đối với các doanh nghiệp để tiếp cận thị trườngrộng lớn và tạo dựng mối quan hệ tốt với khách hàng Một trang web bán hàng hiệu quả không chỉ cung cấp một giao diện thuận tiện cho khách hàng mua sắm, mà còn cung cấp cho doanh nghiệp một công cụ quản lý toàn diện để quản lý sản phẩm, đơn hàng, thanh toán và thông tin khách hàng.

Việc mở một quán cà phê đòi hỏi phải có nhiều yếu tố: tài chính, vật chất, địa lý thuận lợi để giúp cho việc buôn bán phát triển Bên cạnh đó thì việc quản lý website cà phê của mình như thế nào cũng là một câu hỏi lớn cần giải quyết.Vậy việc quản lý quán cà phê như thế nào và bằng cách gì? Quản lý về cái gì? Quản lý như thế nào được gọi là tiện lợi? Ít tốn công sức nhưng lại cho ra kết quả một cách hiệu quả Đó là một trongnhững lý do lớn nhất việc các phần mềm quản lý bán hàng ra đời và trả lời cho những câu hỏi trên nhằm đáp ứng cho việc kinh doanh của cá nhân hoặc một tổ chức nào đó thuận lợi và tiết kiệm thời gian hơn cho việc quản lý “đứa con tinh thần” của mình.

Trong bài báo cáo này, nhóm chúng em quyết định chọn và thực hiện đề tài “Xây dựng website bán coffee và bánh ngọt” Nhằm giúp các doanh nghiệp trong ngành dịch vụ có thể quản lý các hoạt động bán hàng một cách hiệu quả, từ việc quản lý sản phẩm, đặt hàng, đến việc xử lý đơn hàng và thanh toán Hệ thống này sẽ mang lại nhiều lợi ích, bao gồm tăng cường khả năng quản lý, nâng cao hiệu suất làm việc và cải thiện trảinghiệm của khách hàng.

2 Đặc tả yêu cầu bài toán

Yêu cầu của việc xây dựng website cà phê và bánh ngọt là cung cấp một nền tảng hiệu quả để quản lý các hoạt động bán hàng liên quan đến

ngành dịch vụ nói chung.

Xác định yêu cầu của khách hàng: Hiển thị danh sách các mặt hàng của website để khách hàng, sau khi khách hàng chọn và đặt hàng trực tiếp thì phải hiện lên đơn hàng để khách hàng có thể xem hóa đơn mua hàng.

Xác định yêu cầu của quản trị viên (admin): Tiếp nhận xử lý đơn đặthàng của khách hàng Có các chức năng thêm, sửa, xoá các mặt hàng, loạihàng.

Mục tiêu cuối cùng là tạo ra một hệ thống linh hoạt, dễ sử dụng và đáng tin cậy, giúp các doanh nghiệp tối ưu hóa hoạt động kinh doanh, nâng cao hiệu suất và cung cấp trải nghiệm tốt cho khách hàng.Lĩnh vực:

Chuyên ngành: Phát triển ứng dụng trên nền web

Chuyên môn: Lập trình web Sử dụng ngôn ngữ HTML, CSS, PHP, Javascript để xây dựng trang web.

Lĩnh vực liên quan: Thương mại điện tử

2.1 Hoạt động của hệ thống

- Là một Website bán sản phẩm cà phê và bánh ngọt.

- Người dùng truy cập vào Website có thể xem, tìm kiếm, mua và đặt hàng sản phẩm.

- Cách trình bày hợp lý đơn giản, không cầu kì.

- Người dùng có thể xem chi tiết từng sản phẩm (có hình ảnh minh hoạsản phẩm).

- Khi đã chọn được món hàn mình ưa thích thì người dùng click vào nút đặt hàng để sản phẩm được cập nhật trong giỏ hàng.

- Người dùng có thể quay trở lại trang sản phẩm để xem và chọn hàng, các sản phẩm đã chọn sẽ được lưu vào trong giỏ hàng.

- Người dùng có thể tăng số lượng hoặc xóa sản phẩm không vừa ý.- Khi đã tìm được sản phẩm ưng ý thì người dùng click vào mục xác

nhận để hoàn tất việc mua hàng.

- Giá sản phẩm sẽ được hiển thị trong giỏ hàng.

- Người dùng có thể chọn các hình thức thanh toán: tiền mặt, thanh toán VNPay

2.2 Đối tượng sử dụng

Có 2 đối tượng sử dụng là người dùng và nhà quản trị (admin):+ Người dùng: Người dùng có thể xem thông tin cửa hàng, thông tin sản phẩm,tìm kiếm và thêm sản phẩm vào giỏ hàng và đặt mua hàng + Nhà quản trị: Nhà quản trị là người có quyền cao nhất, và cũng là người đóng vai trò quan trọng của hệ thống.

2.3 Mục đích của hệ thống

- Đáp ứng nhu cầu mua bán online bất cứ khi nào, bất cứ nơi đâu.- Góp phần phát triển buôn bán trực tuyến.

- Việc quản lý sản phẩm trở nên dễ dàng.

- Sản phẩm được sắp xếp đơn giản, người dùng có thể dễ dàng tìm kiếm sản phẩm.

3 Yêu cầu

- Yêu cầu về sản phẩm: hệ thống là một website thương mại điện tử nên mọi doanh thu và lợi nhuận sẽ đến từ phía khách hàng Do đó các yêu cầuđặt ra cho hệ thống cũng phải phù hợp với nhu cầu của khách hàng.- Yêu cầu về giao diện: website phải có giao diện dễ nhìn, bắt mắt, dễ sử dụng, phù hợp với thị yếu và nhu cầu của người dùng Trang chủ phải hiển thị bao quát toàn bộ hệ thống và phải làm nổi bật những sản phẩm mới, sản phẩm được ưa chuộng, hệ thống phải có các trang giới thiệu, trang hướng dẫn để người dùng có thể tìm được thông tin và tạo sự tin tưởng cho khách hàng Có danh mục sản phẩm, có chức năng đặt hàng,

mua hàng, có biểu mẫu liên hệ, có biểu mẫu đăng ký khách hàng, có chứcnăng tìm kiếm sản phẩm.

- Về hiệu năng của hệ thống: hệ thống phải có hiệu năng xử lí yêu cầu của khách hàng nhanh nhất có thể, ngay lập tức phản hồi khi người dùng click vào chức năng cụ thể Bên cạnh đó còn phải xử lý chính xác yêu cầucủa khách hàng và đảm bảo an toàn bảo mật cho khách hàng.

- Về các chức năng của hệ thống: đảm bảo hệ thống có đầy đủ chức năng cần thiết của một trang thương mại điện tử Khách hàng có thể tạo tài khoản và đăng nhập, tìm kiếm, thêm sản phẩm vào giỏ hàng, mua hàng và thanh toán Admin có thể quản lý tất cả người dùng trong hệ thống, quản lý sản phẩm, quản lý danh mục, quản lý đơn hàng, quản lý tài khoảnkhách hàng.…

4 Công nghệ sử dụng

4.1 Tổng quan về ngôn ngữ lập trình PHP 4.1.1 Tổng quan

PHP (Hypertext Preprocessor) là ngôn ngữ lập trình mã nguồn mở phía server được thiết kế để dễ dàng xây dựng các trang web động Mã PHP có thể thực thi trên server để tạo ra mã HTML và xuất ra trình duyệt web theo yêu cầu của người sử dụng PHP cho phép xây dựng ứng dụng web trên mạng internet tương tác với mọi cơ sở dữ liệu như: MySQL, Oracle, …

4.1.2 Lịch sử phát triển

Dưới đây là một số phiên bản quan trọng của PHP:

PHP 3: Được phát hành lần đầu vào năm 1997, PHP 3 đánh dấu sự phát triển ban đầu của PHP thành một ngôn ngữ lập trình web phía máy chủ Nó cung cấp các khả năng xử lý biểu mẫu và tương tác với cơ sở dữ liệu.

PHP 4: Được phát hành vào năm 2000, PHP 4 mang đến nhiều cải tiến đáng kể Nó bao gồm hỗ trợ đầy đủ cho lập trình hướng đối tượng

(OOP), cung cấp hiệu suất tốt hơn và nhiều tính năng mới như kế thừa đa cấp, lớp trừu tượng và giao diện.

PHP 5: Ra mắt vào năm 2004, PHP 5 tiếp tục mở rộng khả năng lập trình hướng đối tượng và đưa vào sử dụng nhiều tính năng mới Nó cung cấp hỗ trợ cho các khái niệm như namespace, giao diện, lớp trừu tượng và các tính năng khác để làm việc với đối tượng một cách linh hoạthơn.

PHP 7: Ra mắt vào năm 2015, PHP 7 mang lại những cải tiến đáng kể về hiệu suất và tiết kiệm tài nguyên PHP 7 tăng tốc độ thực thi và giảm đáng kể sử dụng bộ nhớ, làm cho ứng dụng PHP nhanh hơn và tiết kiệm tài nguyên hệ thống.

PHP 7.1, 7.2, 7.3, 7.4: Các phiên bản PHP 7.x tiếp tục đưa ra cáccải tiến và bổ sung tính năng mới Mỗi phiên bản đều cung cấp hiệu suất tốt hơn, bảo mật cải thiện và các cải tiến ngôn ngữ.

PHP 8: Ra mắt vào năm 2020, PHP 8 là phiên bản mới nhất của PHP tính đến thời điểm hiện tại Nó đem đến nhiều tính năng mới như JIT (Just-In-Time) Compiler, cải tiến syntax, hỗ trợ union types, match expressions, và nhiều cải tiến khác.

Các phiên bản PHP tiếp tục được phát triển và cập nhật để cải thiện hiệu suất, bảo mật và tính năng của ngôn ngữ Các phiên bản sau này thường tập trung vào việc tối ưu hóa và cải thiện kỹ thuật của PHP.

4.2 Tổng quan về ngôn ngữ lập trình Javascript

Cùng thời điểm Netscape bắt đầu sử dụng công nghệ Java trên trình duyệt Netscape, LiveScript đã được đổi tên thành JavaScript để được chú ý hơn bởi ngôn ngữ lập trình Java lúc đó đang được coi là một hiện tượng JavaScript được bổ sung vào trình duyệt Netscape bắt đầu từ phiênbản 2.0b3 của trình duyệt này vào tháng 12 năm 1995 Trên thực tế, hai ngôn ngữ lập trình Java và JavaScript không có liên quan gì đến nhau,

ngoại trừ việc cú pháp của cả hai ngôn ngữ cùng được phát triển dựa trên cú pháp của C Java Script gồm 2 mảng là client-server thực hiện lệnh trên máy của end-user và web-server.

Sau thành công của JavaScript, Microsoft bắt đầu phát triển JScript, một ngôn ngữ có cùng ứng dụng và tương thích với JavaScript JScript được bổ sung vào trình duyệt Internet Explorer bắt đầu từ Internet Explorer phiên bản 3.0 được phát hành tháng 8 năm 1996.

DOM (Document Object Model), một khái niệm thường được nhắc đến với JavaScript trên thực tế không phải là một phần của chuẩn ECMAScript, DOM là một chuẩn riêng biệt có liên quan chặt chẽ với XML.

Hàm là một khối các câu lệnh với một danh sách một hoặc nhiều đốisố (có thể không có đối số) và thường có tên (mặc dù trong JavaScript hàm không nhất thiết phải có tên) Hàm có thể trả lại một giá trị.

Trong JavaScript, khi gọi hàm không nhất thiết phải gọi hàm với cùng số đối số như khi định nghĩa hàm, nếu số đối số ít hơn khi định nghĩa hàm, những đối số không được chuyển cho hàm sẽ mang giá trị undefined Các kiểu cơ bản sẽ được chuyển vào hàm theo giá trị, đối tượng sẽ được chuyển vào hàm theo tham chiếu.

Hàm là đối tượng hạng nhất trong JavaScript Tất cả các hàm là đối tượng của nguyên mẫu Function Hàm có thể được tạo và dùng trong phép toán gán như bất kỳ một đối tượng nào khác, và cũng có thể được dùng làm đối số cho các hàm khác Do đó, JavaScript hỗ trợ hàm cấp độ cao.

4.3 Tổng quan về HTML

HTML (HyperText Markup Language) là một ngôn ngữ đánh dấu được sử dụng để xây dựng và cấu trúc nội dung của các trang web Nó là một phần quan trọng của công nghệ web và là ngôn ngữ cơ bản để xây

dựng các trang web tĩnh.

HTML sử dụng các "thẻ" để đánh dấu các phần tử trong trang web và mô tả cách các phần tử đó sẽ hiển thị trên trình duyệt Mỗi thẻ được bao quanh bởi dấu ngoặc nhọn < > và thường đi cặp với thẻ mở và thẻ đóng Ví dụ, <p> là thẻ mở của một đoạn văn bản và </p> là thẻ đóng.HTML sử dụng cấu trúc cây để tổ chức các phần tử trên trang web Các phần tử có thể chứa các phần tử khác và tạo thành một cây phân cấp Ví dụ, một trang web có thể có một phần tử <body> chứa các phần tử <header>, <nav>, <main>, <footer>, và nhiều phần tử khác.

HTML cung cấp cho chúng ta nhiều thẻ và thuộc tính để định dạng và kiểm soát cách nội dung hiển thị trên trình duyệt Bằng cách sử dụng các thẻ như <h1>, <p>, <ul>, <img>, <a>, chúng ta có thể tạo tiêu đề, đoạn văn bản, danh sách, hình ảnh và liên kết.

Ngoài ra, HTML cũng hỗ trợ việc tạo các biểu mẫu (forms) để thu thập thông tin từ người dùng và tạo liên kết giữa các trang web thông qua các thẻ <form> và các phần tử input như <input>, <textarea>, <select>, và nút gửi (<button>).

HTML là một ngôn ngữ mô tả cấu trúc nội dung của trang web và không xử lý logic hoặc tương tác động Để thêm tính năng tương tác và xử lý logic, chúng ta thường kết hợp HTML với CSS (Cascading Style Sheets) để định dạng và trang trí trang web, và JavaScript để thực hiện các tác vụ động và xử lý sự kiện trên trang web.

4.4 Tổng quan về CSS

CSS (Cascading Style Sheets) là một ngôn ngữ định dạng và trang trí trong việc hiển thị các phần tử HTML trên trình duyệt CSS cho phép bạn xác định các quy tắc và kiểu dáng cho các phần tử HTML, giúp điều chỉnh màu sắc, kích thước, khoảng cách, vị trí và các thuộc tính khác của nội dung trên trang web.

CSS hoạt động bằng cách gắn kết các quy tắc định dạng với các phần tử HTML thông qua các bộ chọn (selectors) Một bộ chọn có thể xác định một phần tử cụ thể hoặc một nhóm các phần tử để áp dụng các quy tắc định dạng Ví dụ, bạn có thể sử dụng bộ chọn h1 để áp dụng một kiểu dáng đặc biệt cho tất cả các tiêu đề h1 trên trang web.

CSS cung cấp một loạt các thuộc tính để điều chỉnh kiểu dáng của các phần tử HTML Ví dụ, bạn có thể sử dụng thuộc tính color để định rõ màu sắc chữ, font-size để đặt kích thước chữ, margin và padding để điều chỉnh khoảng cách xung quanh các phần tử, và background-color để đặt màu nền của phần tử.

CSS cũng hỗ trợ các khối kiểu dáng (style sheets) bên ngoài, cho phép bạn tách biệt kiểu dáng từ nội dung HTML Điều này giúp tái sử dụng và duy trì kiểu dáng dễ dàng hơn, đồng thời cung cấp khả năng áp dụng kiểu dáng đồng nhất cho nhiều trang web.

Ngoài ra, CSS cũng hỗ trợ các khái niệm như kế thừa (inheritance), ưu tiên (priority) và trang trí (styling) theo trạng thái (state) của phần tử Điều này cho phép bạn tạo các hiệu ứng và thay đổi kiểu dáng dựa trên tương tác của người dùng hoặc trạng thái của phần tử.

Tổng quan về CSS cho thấy rằng nó là một công cụ mạnh mẽ, quan trọng để điều chỉnh kiểu dáng và trang trí các phần tử HTML, đồng thời giúp tạo ra các trang web đẹp, điều chỉnh theo ý muốn và linh hoạt.

4.5 Môi trường lập trình và công cụ hỗ trợVisual Studio Code

Visual Studio Code (viết tắt là VS Code) là một trình chỉnh sửa mã nguồn mã nguồn mở và miễn phí được phát triển bởi Microsoft Nó là một trong những công cụ phổ biến nhất cho phát triển phần mềm và hỗ trợ nhiều ngôn ngữ lập trình và nền tảng khác nhau Dưới giao diện đồ

họa thân thiện và linh hoạt, VS Code cung cấp nhiều tính năng hữu ích cho các nhà phát triển Dưới đây là một số điểm nổi bật:

Đa nền tảng: VS Code có sẵn trên Windows, macOS và Linux, cho phép người dùng sử dụng trên nhiều hệ điều hành khác nhau.

Hỗ trợ ngôn ngữ phong phú: VS Code hỗ trợ nhiều ngôn ngữ lậptrình phổ biến như JavaScript, Python, C++, Java, HTML, CSS và nhiều ngôn ngữ khác Nó cung cấp cú pháp nhấn mạnh, gợi ý mã, dò lỗi và các công cụ phân tích mã để nâng cao hiệu suất phát triển.

Mở rộng và tùy chỉnh: VS Code có một hệ thống mở rộng mạnh mẽ cho phép bạn cài đặt các tiện ích và chức năng bổ sung từ cộng đồng Bạn có thể tùy chỉnh giao diện, cài đặt các chủ đề (themes) và tiện ích mởrộng để phù hợp với nhu cầu phát triển của mình.

Hỗ trợ điều hướng và gỡ lỗi: VS Code cung cấp các công cụ điều hướng dễ sử dụng giúp bạn tìm kiếm và duyệt mã nguồn Nó cũng tích hợp tính năng gỡ lỗi mạnh mẽ để giúp bạn tìm và sửa lỗi trong mã.

Tích hợp quản lý phiên bản: VS Code tích hợp với các hệ thống quản lý phiên bản phổ biến như Git, cho phép bạn quản lý và kiểm soát phiên bản của mã nguồn dễ dàng.

Hỗ trợ khả năng làm việc nhóm: VS Code cung cấp tính năng chia sẻ và cộng tác trực tuyến, cho phép bạn làm việc cùng nhau trên cùng một dự án và xem các thay đổi từ các thành viên khác trong nhóm.

Visual Studio Code là một công cụ phát triển mã nguồn mở, mạnh mẽ và linh hoạt, được sử dụng rộng rãi bởi các nhà phát triển trên toàn thếgiới Điều này đặt nó trở thành một trong những trình chỉnh sửa mã nguồn phổ biến nhất trong cộng đồng phát triển phần mềm.

PhpMyAdmin

PhpMyAdmin là một công cụ quản lý cơ sở dữ liệu MySQL dựa trêngiao diện web Nó được phát triển bằng ngôn ngữ PHP và được thiết kếđể cung cấp một giao diện đồ họa dễ sử dụng để quản lý các hoạt độngliên quan đến cơ sở dữ liệu MySQL.

Với phpMyAdmin, bạn có thể thực hiện nhiều tác vụ quản lý cơ sở dữliệu, bao gồm:

- Tạo và xóa cơ sở dữ liệu: Bạn có thể tạo cơ sở dữ liệu mới, xóa cơ sởdữ liệu không cần thiết hoặc sao chép cơ sở dữ liệu hiện có.

- Tạo và xóa bảng: Bạn có thể tạo bảng mới trong cơ sở dữ liệu, xóabảng hiện có hoặc chỉnh sửa cấu trúc của bảng.

- Thực hiện truy vấn SQL: Bạn có thể thực hiện các truy vấn SQL đểtruy xuất, cập nhật hoặc xóa dữ liệu từ cơ sở dữ liệu.

- Xem và chỉnh sửa dữ liệu: phpMyAdmin cho phép bạn xem và chỉnhsửa dữ liệu trong các bảng Bạn có thể thêm, sửa đổi hoặc xóa các bản ghitrong bảng.

- Sao lưu và khôi phục cơ sở dữ liệu: Bạn có thể tạo bản sao lưu của cơsở dữ liệu hoặc khôi phục cơ sở dữ liệu từ các bản sao lưu trước đó - Quản lý người dùng và đặc quyền: phpMyAdmin cho phép bạn quản

lý người dùng và đặc quyền truy cập đến cơ sở dữ liệu Bạn có thể tạongười dùng mới, xóa người dùng hiện có và cấp phép truy cập cho từngngười dùng.

PhpMyAdmin cung cấp một giao diện đơn giản và trực quan, giúpngười dùng không cần biết nhiều về lệnh SQL vẫn có thể quản lý cơ sởdữ liệu MySQL một cách dễ dàng và thuận tiện.

XAMPP là một gói phần mềm mã nguồn mở được sử dụng để tạomôi trường phát triển web trên máy tính cá nhân Tên gọi XAMPP là viết

tăt của "X" (thể hiện cho các hệ điều hành khác nhau như Windows,Linux, macOS), Apache, MySQL, PHP và Perl - những thành phần chínhcủa gói phần mềm này Các thành phần chính của XAMPP bao gồm:

Apache: Là một máy chủ web mã nguồn mở phổ biến, XAMPP baogồm phiên bản Apache để bạn có thể chạy các ứng dụng web trên máytính cá nhân của mình.

MySQL: Là một hệ quản trị cơ sở dữ liệu phổ biến, XAMPP cungcấp phiên bản MySQL để bạn có thể lưu trữ và quản lý cơ sở dữ liệu củaứng dụng web.

PHP: Là một ngôn ngữ lập trình phía máy chủ phổ biến, XAMPPcung cấp phiên bản PHP để bạn có thể phát triển và chạy các ứng dụngweb động.

Perl: Là một ngôn ngữ lập trình đa mục đích mạnh mẽ, XAMPP baogồm phiên bản Perl để bạn có thể sử dụng nó cho các tác vụ máy chủ vàphát triển ứng dụng web.

STAR UML

STAR UML (Unified Modeling Language) là một công cụ mô hìnhhóa phần mềm được sử dụng trong quy trình phát triển phần mềm Nócung cấp một giao diện đồ họa cho phép người dùng tạo, chỉnh sửa vàquản lý các biểu đồ UML để mô phỏng và thiết kế hệ thống phần mềm.

STAR UML hỗ trợ nhiều loại biểu đồ UML, bao gồm biểu đồ lớp,biểu đồ use case, biểu đồ tuần tự, biểu đồ hoạt động, biểu đồ trạng thái,biểu đồ cơ sở dữ liệu, và nhiều loại khác Người dùng có thể tạo ra cácbiểu đồ này bằng cách kéo và thả các phần tử UML từ thư viện vàokhung làm việc STAR UML là một công cụ mô hình hóa phần mềmmạnh mẽ và linh hoạt, giúp người dùng thiết kế và mô phỏng hệ thốngphần mềm theo tiêu chuẩn UML.

Draw.io là một ứng dụng cho phép người dùng có thể vẽ sơ đồ, lưu trữ, và chia sẻ với bạn bè hay đồng nghiệp một cách dễ dàng và tiện lợi Nó được phát hành vào năm 2013 và là một nền tảng trực tuyến mã nguồn mở Draw.io có thể được sử dụng trực tuyến tại app.diagrams.net hoặc offline thông qua draw.io desktop Draw.io là một công cụ vẽ sơ đồ rất mạnh mẽ, hỗ trợ nhiều hình khối và không giới hạn số biểu đồ như nhiều công cụ vẽ sơ đồ khác Draw.io hoàn toàn trực tuyến và miễn phí Có thể lưu trữ các biểu đồ của mình trên Google Drive, OneDrive, Dropbox hoặc vị trí khác

CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ HỆ THỐNG1 Mô tả bài toán

Cửa hàng cần xây dựng 1 hệ thống để quản lý giới thiệu và bán sảnphẩm Hoạt động của hệ thống được xây dựng đảm bảo các yêu cầu sau:

Website sẽ hiển thị danh sách sản phẩm với thông tin chi tiết nhưhình ảnh, mô tả, giá cả, và thông tin khác liên quan.

Đối tượng là Khách hàng:

Khách hàng có thể tìm kiếm sản phẩm bằng cách nhập từ khóa hoặcsử dụng bộ lọc để thu hẹp kết quả tìm kiếm Sau khi tìm thấy sản phẩm,khách hàng có thể xem thông tin chi tiết thành phần và giá sản phẩm Sauđó có thể thêm sản phẩm vào giỏ hàng, chỉnh sửa số lượng và xóa sảnphẩm khỏi giỏ hàng Khi mua sản phẩm khách hàng có thể chọn phươngthức thanh toán và cung cấp thông tin thanh toán để hoàn tất quá trìnhmua hàng.

Đối tượng Admin:

Admin có thể đăng nhập vào hệ thống bằng tài khoản và mật khẩuriêng, sau đó có thể làm các nghiệp vụ của cửa hàng Khi đăng nhập tài

khoản, admin có thể thực hiện các nghiệp vụ như: Quản lý sản phẩm,quản lý danh mục sản phẩm, quản lý tài khoản khách hàng, quản lý tàikhoản nhân viên với các chức năng cơ bản: thêm, sửa, xóa Với quản lýđơn hàng: Admin có thể xem và quản lý các đơn hàng từ khách hàng, baogồm xác nhận đơn hàng.

2 Phân tích yêu cầu

Chương trình phải đáp ứng được các mục tiêu sau:

- Đăng nhập/Đăng kí: Khi muốn sử dụng phần mềm, admin và kháchhàng cần đăng nhập bằng tài khoản có sẵn hoặc có thể đăng ký, từ đó cóthể sử dụng các chức năng khác của phần mềm.

Chức năng dành cho admin

- Quản lý sản phẩm: Admin có thể thêm mới, chỉnh sửa hoặc xóa sản phẩm.- Quản lý danh mục sản phẩm: Admin có thể thêm mới, chỉnh sửa hoặcxóa danh mục sản phẩm.

- Quản lý đơn hàng: Admin có thể xem danh sách đơn đặt hàng, chọnxác nhận hoặc hủy đơn đặt hàng.

- Quản lý tài khoản khách hàng: Admin có thể thêm mới, chỉnh sửa hoặcxóa tài khoản khách hàng.

- Quản lý tài khoản nhân viên: Admin có thể cập nhật lại thông tin vàxóa tài khoản nhân viên.

3 Biểu đồ Uescase3.1 Use case tổng quát

Hình 1 Biểu đồ Use case tổng quát

• Mô tả: Quản trị có thể đăng nhập vào hệ thống và sẽ có tất cả cácquyền quản lý chức năng hệ thống này Khách hàng có thể đăng nhậpbằng tài khoản có sẵn hoặc có thể đăng ký, từ đó có thể sử dụng cácchức năng khác của phần mềm.

1 Quản trị Là người chịu trách nhiệm chính của hệ thống,duy trì và điều hành hệ thống và có tất cả cácquyền quản trị

2 Khách hàng Khách hàng là những cá nhân sử dụng phầnmềm với mục đích tham khảo, mua đồ ăn trên

trang web

3.2 Use case phân rã3.2 Use quản lý giỏ hàng

Hình 2.1 Biểu đồ Use case phân rã chức năng quản lý giỏ hàng

Bảng 1 Mô tả Usecase quản lý giỏ hàng

STTTên usecaseMô tả hoạt động

1 Tìm kiếm sản phẩm Nhập vào hoặc lựa chọn thông tin tìmkiếm theo tên sản phẩm, hiển thị chi tiếtsản phẩm dựa vào yêu cầu tìm kiếm2 Xem mô tả sản phẩm Cho phép xem chi tiết mô tả sản phẩm và

hiện chi tiết thông tin sản phẩm

3 Thêm vào giỏ hàng Cho phép xem chi tiết giỏ hàng, hiển thịtên sản phẩm, ảnh, đơn giá, số lượng,thành tiền, tổng tiền của sản phẩm4 Thanh toán Cho phép người dùng đã đăng kí tài

khoản của hệ thống đặt hàng, đưa rathông báo đơn hàng đã đặt thành công vàtình trạng hiện tại của đơn hàng

5 Đăng nhập Cho phép người dùng đã đăng kí tài

khoản thêm vào giỏ hàng và thanh toán

3.3 Use case quản lý đơn hàng

Hình 2.2 Biểu đồ Use case phân rã chức năng quản lý đơn hàngBảng 2 Mô tả Usecase quản lý đơn hàng

1 Đăng nhập Use case này giúp admin sử dụng các chức năngcủa hệ thống cần đến quyền truy cập

2 Hiển thị thông tinđơn đơn hàng

Use case này giúp admin có thể xem các đơn đặthàng đã đặt và có thể xem trạng thái của đơn hàng 3 Xác nhận thông tin

đơn hàng

Admin sử dụng usecase này để xác nhận đơn đặthàng

3.4 Use case quản lý sản phẩm

Hình 2.3 Biểu đồ usecase phân rã chức năng quản lý sản phẩmBảng 3 Mô tả Usecase quản lý sản phẩm

1 Đăng nhập Usecase này giúp admin truy cập các chức

năng của hệ thống cần đến quyền truy cập2 Thêm sản phẩm Admin có thể thêm sản phẩm mới nếu chưa

tồn tại sản phẩm đó

3 Sửa sản phẩm Admin sửa thông tin sản phẩm nếu sản phẩmđó cần chỉnh sửa và đã được lưu trữ rồi4 Xóa sản phẩm Admin có thể xóa sản phẩm khi cửa hàng

dừng bán sản phẩm đó

3.5 Use case danh mục sản phẩm

Hình 2.4 Biểu đồ Use case phân rã chức năng quản lý danh mục sản phẩmBảng 4 Mô tả Usecase quản lý danh mục sản phẩm

1 Đăng nhập Use case này giúp admin quản lý các chức năng củahệ thống cần đến quyền truy cập

2 Thêm danh mục Use case này giúp admin có thể thêm nhiều danhmục sản phẩm vào giỏ hàng khi mua sắm 3 Sửa danh mục Sau khi thêm danh mục sản phẩm vào giỏ hàng thì

admin có thể chỉnh sửa danh mục

4 Xóa danh mục Cho phép admin xóa danh mục khi cần cập nhật sảnphẩm trong cửa hàng

3.6 Use case quản lý tài khoản khách hàng

Hình 2.5 Biểu đồ Use case phân rã chức năng quản lý tài khoản khách hàng

Bảng 5 Mô tả Usecase quản lý tài khoản khách hàng

1 Đăng nhập Use case này giúp admin sử dụng các chức năng củahệ thống cần đến quyền truy cập.

2 Hiển thị thông tintài khoản khách

Admin có thể xem danh sách khách hàng đã đăng kýtài khoản

3 Hiển thị đơn đặthàng của tài khoản

Admin có thể xem chi tiết đơn hàng gồm tên kháchhàng, tên sản phẩm và số lượng

4 Xóa thông tin tàikhoản khách hàng

Admin có thể xoá thông tin tài khoản khách khi tàikhoản khách hàng bị lỗi hoặc không cần thiết

3.7 Use case quản lý tài khoản nhân viên

Hình 2.6 Biểu đồ Use case phân rã chức năng tài khoản nhân viê

Bảng 6 Mô tả Usecase quản lý tài khoản nhân viên

STTTên Use caseMô tả hoạt động

1 Đăng nhập Use case này giúp admin sử dụng các chứcnăng của hệ thống cần đến quyền truy cập2 Hiển thị thông tin

nhân viên

Use case này giúp admin xem chi tiếtthông tin nhân viên

3 Cập nhật thông tinnhân viên

Use case này giúp admin chỉnh sửa thôngtin cá nhân của nhân viên

4 Xóa thông tin tàikhoản nhân viên

Use case này giúp admin xóa thông tin cánhân của nhân viên hoặc tài khoản khinhân viên nghỉ việc

4 Biểu đồ tuần tự

4.1 Biểu đồ tuần tự chức năng đăng nhập/ Đăng ký

Hình 2.7 Biểu đồ tuần tự chức năng đăng nhập

Hình 2.8 Biểu đồ tuần tự chức năng đăng ký

4.2 Biểu đồ tuần tự chức năng tìm kiếm sản phẩm

Hình 2.9 Biểu đồ tuần tự chức năng tìm kiếm