Bối cảnh và vấn đề nghiên cứu
Khóa luận tốt nghiệp với đề tài "Xây dựng website kinh doanh thiết bị điện tử" (mã số SKL012534) được thực hiện bởi sinh viên Đặng Văn Thành (MSSV: 19110287) và Cao Xuân Thắng (MSSV: 19119222), thuộc chuyên ngành Công nghệ phần mềm, Khoa Công nghệ Thông tin – Trường Đại học Sư phạm Kỹ thuật Thành phố Hồ Chí Minh, dưới sự hướng dẫn của ThS. Nguyễn Trần Thi Văn (tháng 12/2023).
Lý do chọn đề tài và bối cảnh thực tiễn
Theo nhóm tác giả, công nghệ thông tin và tin học hóa đóng vai trò trọng yếu trong hoạt động của các tổ chức và doanh nghiệp. Sự tiến bộ của mạng điện tử và Internet toàn cầu đã thúc đẩy mạnh mẽ sự ra đời của thương mại điện tử (TMĐT), hỗ trợ truyền tải thông tin nhanh chóng với chi phí thấp hơn phương pháp truyền thống. Đối với các đơn vị kinh doanh, việc thiết lập một website bán hàng là nhu cầu thực tiễn cần thiết để giới thiệu, quảng bá sản phẩm mới và tiếp cận khách hàng. Xuất phát từ bối cảnh đó, nhóm nghiên cứu đã lựa chọn đề tài xây dựng một website TMĐT phục vụ hoạt động kinh doanh thiết bị điện tử.
Mục tiêu và nhiệm vụ nghiên cứu
Văn bản xác định các mục tiêu và nhiệm vụ cụ thể của đề tài như sau:
- Xây dựng website cho phép người dùng tra cứu, tìm kiếm, xem thông tin chi tiết và đặt mua các thiết bị điện tử trực tuyến.
- Tích hợp tính năng đánh giá và để lại bình luận cho các sản phẩm đã mua.
- Xây dựng hệ thống quản lý và thống kê doanh số bán hàng phục vụ công tác quản trị doanh nghiệp.
- Đảm bảo giao diện người dùng trực quan, thân thiện và bảo mật thông tin cá nhân của người dùng.
- Đáp ứng các yêu cầu chức năng nền tảng: xem danh mục và chi tiết đơn hàng, đăng ký/đăng nhập tài khoản, quản lý giỏ hàng và hỗ trợ thanh toán trực tuyến qua cổng VNPAY.
Đối tượng và phạm vi nghiên cứu
- Đối tượng nghiên cứu: Khóa luận tập trung vào hai đối tượng chính: (1) Kiến thức thực tiễn về quản lý, vận hành hệ thống kinh doanh (quy trình quản trị người dùng, sản phẩm, thống kê, đặt hàng, thanh toán và xử lý đơn hàng); (2) Các công nghệ xây dựng hệ thống gồm ReactJS, NodeJS, MySQL và JSON Web Token (JWT) nhằm xây dựng hệ thống API truy xuất dữ liệu an toàn cùng giao diện người dùng.
- Phạm vi nghiên cứu: Khảo sát các website TMĐT thực tế (Shopee, Thế giới di động, Linh kiện điện tử số). Hệ thống tập trung xử lý các tác vụ cơ bản của website bán hàng gồm: xem danh sách/chi tiết sản phẩm, tìm kiếm, lọc và sắp xếp sản phẩm, quản lý giỏ hàng, đặt hàng, hủy đơn hàng, thanh toán online/offline, đánh giá sản phẩm và quản trị hệ thống. Thời gian thực hiện đề tài từ ngày 30/08/2023 đến ngày 06/01/2024.
Cơ sở lý thuyết và phương pháp
Khóa luận áp dụng quy trình phát triển phần mềm dựa trên nền tảng kiến trúc web hiện đại và các công cụ mô hình hóa hệ thống thông tin.
Khung lý thuyết và công nghệ sử dụng
- ReactJS: Thư viện JavaScript mã nguồn mở do Facebook phát triển để xây dựng giao diện người dùng (UI). Tác giả khai thác cơ chế DOM ảo (Virtual DOM) để tối ưu hiệu suất render, cấu trúc Component lồng nhau theo quan hệ cha - con (parent-child) và cú pháp JSX.
- Redux: Thư viện quản lý trạng thái (State) tập trung cho ứng dụng frontend với mô hình 3 thành phần: Actions (sự kiện gửi dữ liệu), Reducers (hàm nhận state hiện tại và action để sinh state mới) và Store (nơi lưu trữ tập trung trạng thái hệ thống).
- Thư viện giao diện và giao tiếp mạng: Axios (HTTP client dựa trên JavaScript Promise để gọi Web Service API), Material UI và NextUI (bộ component UI dựng sẵn).
- NodeJS: Nền tảng thực thi JavaScript phía máy chủ xây dựng trên V8 engine, hoạt động theo mô hình đơn luồng (Single Threaded) kết hợp cơ chế vào/ra không chặn (non-blocking I/O) giúp xử lý lượng lớn kết nối đồng thời với thông lượng cao.
- MySQL: Hệ quản trị cơ sở dữ liệu quan hệ (RDBMS) mã nguồn mở hoạt động theo mô hình client - server, sử dụng ngôn ngữ truy vấn có cấu trúc (SQL).
- JSON Web Token (JWT): Chuỗi mã hóa gồm 3 phần: Header, Payload và Chữ ký (Signature được ký bằng thuật toán HMAC hoặc RSA), truyền trong HTTP Header để xác thực và phân quyền người dùng giữa Client và Server.
Phương pháp nghiên cứu
- Phương pháp khảo sát hiện trạng: Khảo sát thực tế 2 hệ thống TMĐT: shop Điện tử số (
linhkiendientu.vn) và shop Thế giới di động (thegioididong.com) để phân tích ưu điểm, nhược điểm về luồng nghiệp vụ và giao diện.
- Phương pháp mô hình hóa hướng đối tượng (UML): Sử dụng sơ đồ Use Case, bảng đặc tả chi tiết Use Case, sơ đồ tuần tự (Sequence Diagram) và sơ đồ lớp (Class Diagram).
- Phương pháp thiết kế cơ sở dữ liệu quan hệ: Chuẩn hóa dữ liệu và xây dựng mô hình thực thể quan hệ trên MySQL.
- Phương pháp thử nghiệm chức năng: Kiểm thử hộp đen theo kịch bản thực tế trên các luồng người dùng và luồng quản trị.
Thiết kế và triển khai
Hệ thống được thiết kế theo mô hình phân tầng, phân định rõ ràng giữa tầng giao diện Client-side (ReactJS) và tầng dịch vụ Server-side (NodeJS API kết nối MySQL).
Kiến trúc phân quyền và tác nhân
Hệ thống xác định 4 tác nhân chính tương ứng với các nhóm quyền truy cập:
KHACH: Người dùng truy cập website nhưng chưa đăng nhập (tra cứu, xem sản phẩm, đăng ký, đăng nhập).
KHACHHANG: Người dùng đã xác thực (quản lý giỏ hàng, đặt hàng, đánh giá sản phẩm, quản lý đơn hàng, đổi thông tin cá nhân, yêu thích sản phẩm, liên hệ).
NHANVIEN: Người dùng nội bộ phụ trách xử lý đơn hàng, quản lý bài viết blog, quản lý slide, xem đánh giá, xử lý liên hệ và xem thống kê.
QUANTRIVIEN: Quản trị viên cấp cao nắm toàn bộ quyền của nhân viên kèm theo quản lý phân loại danh mục, quản lý sản phẩm, quản lý người dùng, thiết lập mã giảm giá và phân quyền.
| Tác nhân |
Quyền hạn chính |
| Khách |
Xem sản phẩm, tìm kiếm, đăng ký tài khoản, đăng nhập |
| Khách hàng |
Đặt hàng (online/offline), quản lý giỏ hàng, quản lý đơn hàng, hủy đơn, đánh giá, yêu thích |
| Nhân viên |
Xử lý đơn hàng, quản lý blog, slide, theo dõi đánh giá và phản hồi liên hệ |
| Quản trị viên |
Quản lý toàn diện hệ thống: tài khoản, phân quyền, danh mục, sản phẩm, mã giảm giá, thống kê doanh thu |
Thiết kế cơ sở dữ liệu
Cơ sở dữ liệu của hệ thống được xây dựng trên MySQL với 16 bảng dữ liệu:
| STT |
Tên bảng |
Chức năng nghiệp vụ |
| 1 |
users |
Lưu thông tin định danh và tài khoản người dùng |
| 2 |
roles |
Định nghĩa các vai trò trong hệ thống |
| 3 |
permission |
Định nghĩa các quyền hạn chức năng |
| 4 |
user_roles |
Bảng liên kết vai trò của từng người dùng |
| 5 |
role_have_permissions |
Bảng phân quyền chi tiết cho từng vai trò |
| 6 |
categories |
Lưu trữ danh mục phân loại sản phẩm |
| 7 |
products |
Lưu thông tin chi tiết sản phẩm |
| 8 |
products_images |
Lưu danh sách hình ảnh của sản phẩm |
| 9 |
orders |
Lưu thông tin đơn đặt hàng |
| 10 |
transaction |
Lưu thông tin giao dịch thanh toán |
| 11 |
discounts |
Quản lý thông tin mã giảm giá và khuyến mãi |
| 12 |
blogs |
Lưu trữ nội dung bài viết tin tức/công nghệ |
| 13 |
menus |
Quản lý hệ thống danh mục menu hiển thị |
| 14 |
slides |
Quản lý banner hình ảnh trình chiếu trên trang chủ |
| 15 |
votes |
Lưu đánh giá và phản hồi của người dùng về sản phẩm |
| 16 |
Contact |
Lưu thông tin liên hệ và góp ý của khách hàng |
Nội dung chính theo từng chương
Chương 1: Cơ sở lý thuyết
Chương này giới thiệu tổng quan các công nghệ và thư viện nền tảng được lựa chọn để phát triển website:
- Phân tích nguyên lý làm việc của ReactJS, cơ chế Virtual DOM giúp giảm tải việc render lại toàn bộ cây DOM, cấu trúc phân nhánh component và truyền dữ liệu thông qua thuộc tính (
props).
- Trình bày kiến trúc luồng dữ liệu một chiều của Redux qua chuỗi liên kết: Action → Dispatcher → Reducer → Store.
- Giới thiệu các công cụ hỗ trợ giao diện và kết nối: Axios xử lý HTTP request không đồng bộ; Material UI và NextUI hỗ trợ các thành phần UI mẫu.
- Trình bày nền tảng NodeJS với mô hình thực thi đơn luồng (Single Threaded) và I/O non-blocking giúp tối ưu tài nguyên RAM và tiếp nhận nhiều yêu cầu đồng thời.
- Trình bày hệ quản trị cơ sở dữ liệu MySQL và cấu trúc chuỗi token JWT dùng trong việc xác thực bảo mật và phân quyền API.
Chương 2: Khảo sát hiện trạng và mô hình hóa yêu cầu
Nội dung chương 2 tập trung vào phân tích nghiệp vụ và đặc tả yêu cầu:
- Khảo sát hệ thống tương tự: Phân tích trang web shop Điện tử số (
linhkiendientu.vn) và shop Thế giới di động (thegioididong.com), chỉ ra các ưu điểm về giao diện, tính năng thanh toán cũng như nhược điểm về thiếu chức năng đánh giá hoặc hiển thị quá nhiều quảng cáo rối mắt.
- Yêu cầu chức năng nghiệp vụ người dùng: Tìm kiếm sản phẩm theo tên/mô tả; xem danh mục; xem chi tiết; quản lý giỏ hàng (thêm, sửa số lượng, xóa); đặt hàng; thanh toán online/offline; đánh giá sản phẩm; hủy đơn hàng; quản lý danh sách yêu thích; tính tổng giá trị đơn hàng; gửi thông tin liên hệ.
- Yêu cầu chức năng nghiệp vụ quản trị: Thêm/sửa/xóa sản phẩm, danh mục phân loại, tài khoản, mã giảm giá, phân quyền người dùng; cập nhật trạng thái đơn hàng; xem và lọc danh sách dữ liệu; xem liên hệ; tính toán thống kê doanh thu theo ngày/tháng trong năm; thống kê số lượng đơn và trạng thái đơn hàng.
- Yêu cầu chức năng hệ thống và phi chức năng: Cơ chế phân quyền nhiều cấp; khôi phục mật khẩu qua email; tích hợp thanh toán VNPAY; đảm bảo tốc độ phản hồi nhanh, độ tin cậy cao, bảo mật thông tin cá nhân và khả năng mở rộng quy mô.
- Mô hình hóa Use Case: Thiết lập sơ đồ Use case và bảng đặc tả chi tiết cho từng tác nhân (Khách, Khách hàng, Nhân viên, Quản trị viên), nêu rõ tiền điều kiện, hậu điều kiện, luồng sự kiện chính, luồng thay thế và luồng ngoại lệ (ví dụ: thông báo lỗi "out of stock" khi giỏ hàng vượt quá tồn kho).
Chương 3: Thiết kế hệ thống
Chương 3 trình bày các bản vẽ kỹ thuật chi tiết phục vụ hiện thực hóa phần mềm:
- Sơ đồ tuần tự (Sequence Diagram): Xây dựng 22 biểu đồ tuần tự mô tả tương tác giữa Người dùng/Admin, Giao diện (Client), Bộ điều khiển (Controller/Backend) và Cơ sở dữ liệu cho các luồng: Đăng ký, Đăng nhập, Đặt hàng, Đánh giá sản phẩm, Thay đổi thông tin cá nhân, Thêm danh sách đơn hàng, Hủy đơn hàng, Tìm kiếm sản phẩm, Thêm/Cập nhật sản phẩm, Thêm/Cập nhật phân loại, Thêm/Cập nhật mã giảm giá, Thêm/Cập nhật slide, Thêm/Cập nhật phân loại blog, Thêm/Cập nhật blog, Thêm/Cập nhật tài khoản và Cập nhật trạng thái đơn hàng.
- Thiết kế cơ sở dữ liệu: Sơ đồ liên kết thực thể và mô tả chi tiết kiểu dữ liệu, khóa chính, khóa ngoại của 16 bảng dữ liệu.
- Thiết kế giao diện: Thiết kế chi tiết các màn hình chức năng cho phía quản trị viên (15 màn hình quản trị danh mục, sản phẩm, giảm giá, blog, slide, đơn hàng, người dùng, đánh giá, liên hệ) và phía người dùng (14 màn hình từ đăng nhập, đăng ký, giỏ hàng, đặt hàng, chi tiết sản phẩm, quản lý đơn hàng đến blog và liên hệ).
Chương 4: Cài đặt và thử nghiệm
Chương 4 mô tả môi trường cài đặt và kết quả kiểm thử các chức năng cốt lõi:
- Nêu các bước cài đặt hệ thống và yêu cầu môi trường thực thi.
- Thử nghiệm các chức năng phía người dùng: Lưu sản phẩm vào danh sách yêu thích, Thêm sản phẩm vào giỏ hàng, Cập nhật thông tin tài khoản cá nhân.
- Thử nghiệm các chức năng phía quản trị: Tạo mới danh mục phân loại sản phẩm, Tạo mới chương trình mã giảm giá, Cập nhật và chuyển đổi trạng thái đơn đặt hàng.
Kết quả và đóng góp
Kết quả chính đạt được
- Hiện thực hóa hoàn chỉnh website thương mại điện tử phục vụ kinh doanh thiết bị điện tử với giao diện responsive, tương thích người dùng.
- Xây dựng đầy đủ quy trình nghiệp vụ mua sắm trực tuyến: tìm kiếm/lọc sản phẩm, quản lý giỏ hàng, đặt hàng, hủy đơn hàng, đánh giá phản hồi và theo dõi trạng thái đơn hàng.
- Tích hợp thành công cổng thanh toán trực tuyến VNPAY bên cạnh phương thức thanh toán khi nhận hàng (COD / offline).
- Xây dựng phân hệ quản trị (Admin Dashboard) hỗ trợ quản lý danh mục, sản phẩm, hình ảnh, bài viết blog, slider quảng cáo, mã giảm giá, tài khoản và thống kê doanh thu theo thời gian.
- Thiết lập hệ thống bảo mật và phân quyền vai trò (Role-based access control) thông qua JWT và phân tách rõ ràng 4 nhóm tác nhân (
KHACH, KHACHHANG, NHANVIEN, QUANTRIVIEN).
Đóng góp thực tiễn của đề tài
- Hệ thống hóa quy trình xây dựng ứng dụng web TMĐT hoàn chỉnh từ khâu khảo sát thực tế, phân tích yêu cầu, mô hình hóa UML đến lập trình và kiểm thử.
- Đưa ra giải pháp kết hợp kiến trúc single-page application (ReactJS + Redux) với backend xử lý bất đồng bộ (NodeJS) và cơ sở dữ liệu quan hệ MySQL, đảm bảo khả năng xử lý dữ liệu nhất quán và bảo mật.
Hạn chế và hướng nghiên cứu tiếp
Hạn chế
- Hệ thống tập trung giải quyết các tác vụ mua bán cơ bản, chưa phát triển sâu các thuật toán cá nhân hóa trải nghiệm hoặc hệ thống gợi ý sản phẩm thông minh nâng cao.
- Phạm vi kiểm thử mới dừng lại ở các kịch bản chức năng chính, chưa có số liệu đo lường chi tiết về tải trọng thực tế khi có lượng lớn người dùng đồng thời truy cập.
Hướng phát triển
- Tối ưu hóa hiệu năng giao diện và hoàn thiện thêm các tính năng mở rộng phục vụ người dùng.
- Nâng cấp và cải tiến hệ thống gợi ý sản phẩm dựa trên lịch sử xem và hành vi mua sắm.
- Bổ sung các phương thức thanh toán điện tử khác và mở rộng tính năng chăm sóc khách hàng tự động.
Giá trị tham khảo
Báo cáo khóa luận là tài liệu tham khảo hữu ích cho:
- Sinh viên ngành Công nghệ thông tin và Kỹ thuật phần mềm: Cung cấp tài liệu mẫu về quy trình xây dựng đồ án tốt nghiệp ứng dụng web thương mại điện tử full-stack (ReactJS, NodeJS, MySQL).
- Người học cần tham khảo mô hình hóa hệ thống: Cung cấp bộ tài liệu hoàn chỉnh về đặc tả Use Case, thiết kế 22 lược đồ tuần tự (Sequence Diagram), sơ đồ lớp và thiết kế cơ sở dữ liệu quan hệ gồm 16 bảng chuẩn hóa.
- Lập trình viên phát triển ứng dụng web bán hàng: Cung cấp giải pháp mẫu trong việc tổ chức quản lý trạng thái frontend bằng Redux, xác thực phân quyền qua JWT và tích hợp cổng thanh toán VNPAY.
Câu hỏi thường gặp
1. Hệ thống phân chia quyền hạn của người dùng như thế nào?
Hệ thống chia thành 4 tác nhân: KHACH (chưa đăng nhập, chỉ xem và tìm kiếm), KHACHHANG (đã đăng nhập, thực hiện mua hàng, đánh giá, quản lý đơn hàng), NHANVIEN (quản lý đơn hàng, blog, slide, đánh giá, liên hệ, xem thống kê) và QUANTRIVIEN (toàn quyền hệ thống, bổ sung quản lý sản phẩm, danh mục, người dùng, mã giảm giá và phân quyền).
2. Website hỗ trợ những phương thức thanh toán nào cho khách hàng?
Hệ thống cung cấp hai hình thức thanh toán: thanh toán trực tiếp khi nhận hàng (thanh toán offline / COD) và thanh toán trực tuyến qua cổng trung gian VNPAY.
3. Cơ chế bảo mật và xác thực người dùng trong hệ thống hoạt động ra sao?
Hệ thống sử dụng JSON Web Token (JWT) gồm 3 thành phần (Header, Payload, Signature) được mã hóa bằng thuật toán HMAC/RSA. Token này được đính kèm ở Header của mỗi yêu cầu gửi từ Client lên Backend để kiểm tra danh tính và phân quyền truy cập tài nguyên.
4. Cơ sở dữ liệu của hệ thống được tổ chức với bao nhiêu bảng và gồm những thực thể nào?
Cơ sở dữ liệu MySQL bao gồm 16 bảng: users, roles, permission, user_roles, role_have_permissions, categories, products, products_images, orders, transaction, discounts, blogs, menus, slides, votes, và Contact.
5. Website xử lý trường hợp số lượng sản phẩm trong giỏ hàng vượt quá số lượng tồn kho như thế nào?
Theo đặc tả Use case giỏ hàng, khi người dùng thêm hoặc cập nhật số lượng vượt quá số sản phẩm hiện có, hệ thống sẽ kích hoạt luồng ngoại lệ: hiển thị thông báo "out of stock" hoặc thông báo sản phẩm không đủ số lượng và từ chối thực hiện thao tác.
Kết luận
Khóa luận tốt nghiệp của sinh viên Đặng Văn Thành và Cao Xuân Thắng đã hoàn thành mục tiêu xây dựng website thương mại điện tử kinh doanh thiết bị điện tử hoàn chỉnh. Đề tài kết hợp hiệu quả giữa frontend ReactJS (quản lý trạng thái bằng Redux) và backend NodeJS cùng cơ sở dữ liệu MySQL, tích hợp cổng thanh toán trực tuyến VNPAY và cơ chế xác thực bảo mật JWT. Toàn bộ quy trình phân tích nghiệp vụ, mô hình hóa hệ thống và thiết kế cơ sở dữ liệu được trình bày chi tiết, đáp ứng đầy đủ yêu cầu của một đồ án tốt nghiệp chuyên ngành Công nghệ phần mềm.