Bối cảnh và vấn đề nghiên cứu

Sự bùng nổ của thương mại điện tử trong những năm gần đây đã tạo ra nhu cầu cấp thiết về các nền tảng bán hàng trực tuyến cho doanh nghiệp vừa và nhỏ trong lĩnh vực thiết bị công nghệ. Nhóm tác giả xuất phát từ nhận định rằng hầu hết các cá nhân và doanh nghiệp kinh doanh mặt hàng công nghệ đều cần website để giới thiệu sản phẩm và tiếp cận người tiêu dùng, trong khi khoảng cách giữa người mua và người bán vẫn còn tồn tại do thiếu các công cụ mua bán trực tuyến tiện lợi, giao diện thân thiện, và quy trình thanh toán rõ ràng.

Mục đích thực hiện đề tài bao gồm hai hướng chính được tác giả trình bày:

  1. Xây dựng trang website cửa hàng bán thiết bị công nghệ trực tuyến (điện thoại, laptop, máy tính bảng, tai nghe) giúp khách hàng xem sản phẩm, mua và thanh toán nhanh chóng; đồng thời giúp chủ cửa hàng dễ dàng quản lý các danh mục sản phẩm, khách hàng, và nguồn thu chi.
  2. Tạo nền tảng cập nhật thông tin về các thiết bị thông dụng, nơi khách hàng có thể trao đổi và bình luận trực tiếp về sản phẩm.

Đối tượng nghiên cứu là hệ thống website thương mại điện tử dành cho lĩnh vực thiết bị công nghệ tiêu dùng, với hai nhóm người dùng chính: khách hàng (người mua) và quản trị viên (Admin). Phạm vi của đề tài giới hạn trong việc thiết kế và xây dựng một website hoàn chỉnh ở cấp độ đồ án cơ sở, thực hiện tại Khoa Khoa Học Máy Tính, Trường Đại học Công nghệ Thông tin & Truyền thông Việt Hàn, hoàn thành vào tháng 12 năm 2023.


Cơ sở lý thuyết và phương pháp

Ngôn ngữ và công nghệ sử dụng

Nhóm tác giả trình bày và lựa chọn các công nghệ sau làm nền tảng xây dựng hệ thống:

Công nghệ Vai trò trong hệ thống
Go (Golang) Ngôn ngữ backend, xử lý logic nghiệp vụ và API
TypeScript Ngôn ngữ lập trình phía frontend, kiểm soát kiểu dữ liệu tĩnh
ReactJS Thư viện JavaScript xây dựng giao diện người dùng động
HTML Ngôn ngữ đánh dấu cấu trúc trang web
CSS Ngôn ngữ định kiểu, điều khiển bố cục và giao diện
SQL Hệ quản trị cơ sở dữ liệu quan hệ
UML Ngôn ngữ mô hình hóa hệ thống

Phương pháp thiết kế hệ thống

Phương pháp thực hiện được mô tả bao gồm: học tập và nắm vững các ngôn ngữ lập trình cần thiết; đọc tài liệu và nguồn thông tin tham khảo từ tài liệu chính thức của GoLang và TypeScript; xây dựng hệ thống theo các giai đoạn tuần tự gồm khảo sát, phân tích và thiết kế hệ thống, nghiên cứu công cụ lập trình, thiết kế website và kiểm thử.

Về mô hình hóa, nhóm sử dụng UML với đầy đủ các loại biểu đồ: Use Case, biểu đồ hoạt động (Activity Diagram), biểu đồ tuần tự (Sequence Diagram), và biểu đồ lớp (Class Diagram). Kiến trúc website phân chia rõ ràng giữa hai vai trò Admin và Khách hàng (Client).


Nội dung chính theo từng chương

Chương 1: Giới thiệu

Chương này trình bày lý do chọn đề tài xuất phát từ xu hướng phát triển thương mại điện tử; xác định mục đích, nhiệm vụ và phương pháp thực hiện. Kết quả dự kiến được nêu là một website có giao diện đẹp mắt, nội dung chất lượng, bố trí khoa học, và có thể áp dụng vào thực tế, cung cấp sản phẩm có nhiều discount nhằm làm hài lòng khách hàng.

Chương 2: Tổng quan về Ecommerce Website

Chương này giới thiệu mô hình Ecommerce website bán thiết bị công nghệ theo dạng mua bán trực tuyến (B2C). Nhóm mô tả chi tiết các quy trình nghiệp vụ cốt lõi dưới dạng lưu đồ:

  • Quy trình đăng ký tài khoản: khách hàng điền form → hệ thống kiểm tra tính hợp lệ → xác nhận hoặc yêu cầu nhập lại.
  • Quy trình đăng nhập: nhập tên tài khoản và mật khẩu → xác thực → chuyển về trang chủ hoặc thông báo lỗi.
  • Quy trình tìm kiếm sản phẩm: nhập từ khóa vào ô input ở header → hiển thị danh sách sản phẩm phù hợp.
  • Quy trình thêm vào danh sách yêu thích: lưu sản phẩm chưa mua ngay bằng biểu tượng hình trái tim.
  • Quy trình thêm vào giỏ hàng: chọn sản phẩm → cập nhật giỏ hàng.
  • Quy trình thanh toán: gồm hai giai đoạn — (1) gửi thông tin đến ngân hàng hoặc nhà cung cấp dịch vụ để xác thực; (2) trả kết quả cho người dùng, hiển thị thông tin giao dịch nếu thành công hoặc thông báo lỗi nếu thất bại.
  • Các quy trình quản lý dành cho Admin: quản lý tài khoản khách hàng (xem thông tin, khóa tài khoản vi phạm, gửi voucher), quản lý đơn đặt hàng, và quản lý sản phẩm (thêm, sửa, xóa).

Cơ cấu tổ chức website xác định hai actor chính: Admin quản lý hoạt động chung và Khách hàng thực hiện các chức năng cơ bản.

Chương 3: Nghiên cứu tổng quan

Chương này trình bày kiến thức nền về từng công nghệ được sử dụng. Golang được làm nổi bật với các đặc điểm: hiệu suất cao, hỗ trợ concurrency thông qua goroutines và channels, kiểu dữ liệu tĩnh, quản lý bộ nhớ an toàn, và khả năng phát triển microservices. TypeScript được chọn vì là siêu tập của JavaScript, hỗ trợ kiểm soát kiểu tĩnh, tích hợp sâu với Node và môi trường trình duyệt. ReactJS được sử dụng để xây dựng giao diện dựa trên khái niệm component và Virtual DOM. SQL được dùng làm cơ sở dữ liệu quan hệ. UML phục vụ toàn bộ quá trình từ phân tích đến kiểm thử với các loại sơ đồ: Class Diagram, Use Case Diagram, Sequence Diagram, Activity Diagram, Component Diagram, và Deployment Diagram.

Chương 4: Phân tích và thiết kế hệ thống

Đây là chương có khối lượng lớn nhất, gồm bốn nhóm nội dung:

Biểu đồ Use Case: Sơ đồ Use Case tổng thể thể hiện toàn bộ các chức năng hệ thống. Nhóm đặc tả riêng biệt 11 Use Case quan trọng:

Use Case Actor Điều kiện tiên quyết
Login (Đăng nhập) Người dùng Không có
Client Register (Đăng ký) Client Không có
View Items (Xem sản phẩm) Người dùng Không có
Add product into cart Người dùng Đã đăng nhập, đã xem sản phẩm
Add product into wishlist Người dùng Đã đăng nhập, đã xem sản phẩm
Post comment (Bình luận) Người dùng Đã đăng nhập, đã xem sản phẩm
Check out (Thanh toán) Người dùng Đã đăng nhập
Make purchase (Mua hàng) Người dùng Đã đăng nhập, đã xem và thanh toán
Manage users Admin Đăng nhập tài khoản quản trị
Manage products Admin Đăng nhập tài khoản quản trị
Manage bills Admin Đăng nhập tài khoản quản trị

Biểu đồ hoạt động được xây dựng cho 9 tiến trình: đăng ký, đăng nhập, bình luận, thêm sản phẩm vào giỏ hàng, thanh toán, thêm comment, cập nhật thông tin cá nhân, quản lý tài khoản, quản lý sản phẩm, và quản lý đơn đặt hàng.

Biểu đồ lớp thể hiện cấu trúc các class và mối quan hệ trong hệ thống.

Biểu đồ tuần tự được vẽ cho 8 kịch bản: đăng ký, đăng nhập, bình luận, thêm sản phẩm vào giỏ hàng, thanh toán, thêm blog, cập nhật thông tin cá nhân, và quản lý tài khoản.

Chương 5: Thiết kế cơ sở dữ liệu

Chương trình bày mối quan hệ giữa các bảng trong cơ sở dữ liệu. Đây được xác định là phần quan trọng giúp việc viết code dễ dàng hơn và tăng hiệu suất hệ thống. Các class và mối quan hệ được nghiên cứu chặt chẽ trước khi triển khai.

Chương 6: Thiết kế Website

Chương minh họa toàn bộ giao diện người dùng đã hoàn thành, gồm:

  • Trang chủ: hiển thị sản phẩm giảm giá, sản phẩm bán chạy nhất, sản phẩm mới nhất, và footer với thông tin liên hệ cửa hàng.
  • Giao diện đăng nhập: hỗ trợ đăng nhập bằng tài khoản thường, Google Account, và Facebook Account.
  • Giao diện đăng ký: hỗ trợ đăng ký bằng tài khoản thường, Google Account, và Facebook Account.
  • Giao diện cập nhật thông tin khách hàng: bắt buộc hoàn thiện trước khi đặt hàng.
  • Giao diện sản phẩm: trang danh sách và trang chi tiết sản phẩm với tùy chọn thêm vào giỏ hàng hoặc danh sách yêu thích.
  • Giao diện giỏ hàng và danh sách yêu thích.
  • Giao diện thanh toán: gồm nhiều bước xác nhận thông tin và chọn phương thức thanh toán.
  • Giao diện blog và tính năng bình luận bài viết.
  • Giao diện liên hệ.

Thiết kế và triển khai

Kiến trúc hệ thống

Website được xây dựng theo mô hình phân lớp với phần backend sử dụng Go (Golang) đảm nhiệm xử lý logic nghiệp vụ và API, phần frontend sử dụng ReactJS kết hợp TypeScript để xây dựng giao diện người dùng tương tác, và SQL làm cơ sở dữ liệu quan hệ lưu trữ toàn bộ thông tin hệ thống.

Các chức năng đã triển khai

Hệ thống phân chia rõ ràng giữa hai nhóm chức năng:

Phía khách hàng: đăng ký, đăng nhập (hỗ trợ Google Account và Facebook Account), xem sản phẩm (không yêu cầu đăng nhập), tìm kiếm sản phẩm theo từ khóa, thêm vào giỏ hàng, thêm vào danh sách yêu thích, bình luận sản phẩm và bài viết blog, thanh toán qua ngân hàng hoặc trực tiếp, cập nhật thông tin cá nhân.

Phía Admin: quản lý tài khoản khách hàng (xem thông tin, khóa tài khoản, gửi voucher), quản lý sản phẩm (thêm, sửa, xóa, lọc), quản lý hóa đơn (xem trạng thái, quản lý doanh thu), quản lý đơn đặt hàng.

Công cụ mô hình hóa

Toàn bộ phân tích và thiết kế được thực hiện bằng UML với đầy đủ: sơ đồ Use Case tổng thể và phân rã, biểu đồ hoạt động, biểu đồ tuần tự, và biểu đồ lớp — tổng cộng trên 40 hình minh họa được ghi chép trong tài liệu.


Kết quả và đóng góp

Kết quả đạt được

Nhóm tác giả tự đánh giá đã đạt được các kết quả sau:

  • Xây dựng thành công website bán hàng với giao diện có tính thẩm mỹ cao, nhiều chức năng, tối ưu hóa trong việc quản lý và tìm kiếm.
  • Hỗ trợ khách hàng đặt hàng nhanh chóng và tiện lợi.
  • Về năng lực kỹ thuật: nhóm nắm vững phân tích và thiết kế hệ thống UML, hiểu sâu về API và cách sử dụng framework, cải thiện kỹ năng tư duy lập trình.

Giải pháp và tính năng đề xuất thêm

Nhóm đề xuất bổ sung các tính năng trong tương lai: tối ưu hóa SEO, tăng cường bảo mật website, và bổ sung thêm nhiều chức năng cho hệ thống.

Đóng góp so với phạm vi học phần

Đây là đồ án cơ sở cấp 2, kết hợp đầy đủ các bước từ phân tích nghiệp vụ đến triển khai giao diện thực tế, sử dụng Golang ở phía backend — một lựa chọn ít phổ biến trong các đồ án sinh viên so với các framework như Node.js hay PHP — kết hợp với ReactJS và TypeScript phía frontend.


Hạn chế và hướng nghiên cứu tiếp

Tài liệu ghi nhận một hạn chế rõ ràng: do thời gian hạn chế, giao diện quản trị (Admin UI) chưa được hoàn thiện về mặt thẩm mỹ và tính tối giản. Đây là điểm cần cải thiện trực tiếp trong giai đoạn tiếp theo.

Hướng phát triển được nhóm đề xuất gồm:

  • Hoàn thiện giao diện Admin với đầy đủ chức năng quản lý để chủ cửa hàng và doanh nghiệp sử dụng thuận tiện hơn.
  • Phát triển và mở rộng phạm vi phổ biến của website.
  • Tìm hiểu thêm các framework khác nhau để tối ưu và nâng cao hiệu suất hệ thống.

Ngoài các hạn chế tác giả tự nêu, phạm vi đồ án cơ sở cũng chưa đề cập đến kiểm thử (testing), triển khai lên môi trường production, hay các yêu cầu về bảo mật chuyên sâu.


Giá trị tham khảo

Tài liệu này phù hợp cho các đối tượng sau:

  • Sinh viên ngành Công nghệ Thông tin đang chuẩn bị thực hiện đồ án cơ sở hoặc đồ án tốt nghiệp liên quan đến xây dựng hệ thống thương mại điện tử, có thể tham khảo cách tổ chức và đặc tả Use Case, cách xây dựng các biểu đồ UML từ yêu cầu nghiệp vụ thực tế.
  • Sinh viên mới tiếp cận Golang và ReactJS có thể tham khảo lý do lựa chọn công nghệ và sự phân công vai trò giữa các ngôn ngữ trong một hệ thống web.
  • Giảng viên và trợ giảng có thể dùng tài liệu này làm ví dụ minh họa cho cấu trúc đồ án cơ sở và mức độ yêu cầu của từng chương.

Phần đáng tham khảo nhất là Chương 4 với hệ thống đặc tả Use Case chi tiết (gồm Actor, Objective, Pre-conditions, Post-conditions, và bảng tương tác) và hệ thống biểu đồ UML đầy đủ các loại.


Câu hỏi thường gặp

1. Website bán những loại thiết bị công nghệ nào? Theo tài liệu, website hướng đến bán các thiết bị công nghệ tiêu dùng gồm: điện thoại, laptop, máy tính bảng, và tai nghe.

2. Hệ thống thanh toán hoạt động theo cơ chế nào? Quá trình thanh toán gồm hai giai đoạn: giai đoạn 1, hệ thống gửi thông tin của khách hàng đến ngân hàng hoặc nhà cung cấp dịch vụ liên kết để chứng thực; giai đoạn 2, hệ thống nhận phản hồi và thông báo kết quả — hiển thị thông tin giao dịch nếu thành công, hoặc trả về giao diện kèm thông báo lỗi nếu thất bại.

3. Khách hàng có thể đăng nhập bằng các phương thức nào? Website hỗ trợ ba phương thức: đăng nhập bằng tài khoản thường (username/password), đăng nhập bằng Google Account, và đăng nhập bằng Facebook Account. Tương tự, đăng ký cũng hỗ trợ cả ba phương thức này.

4. Admin có những quyền quản lý gì đối với tài khoản khách hàng? Admin có thể xem thông tin các tài khoản, khóa các tài khoản bị vi phạm, và gửi voucher tri ân cho những khách hàng mua hàng thường xuyên tại website.

5. Tại sao nhóm chọn Golang làm ngôn ngữ backend thay vì các lựa chọn phổ biến hơn? Tài liệu giải thích Golang được chọn vì hiệu suất cao, khả năng xử lý đa nhiệm qua goroutines và channels, cú pháp đơn giản, quản lý bộ nhớ an toàn, và phù hợp với phát triển ứng dụng web lẫn microservices — đồng thời hỗ trợ đa nền tảng và dễ tích hợp với các công nghệ khác.


Kết luận

Đồ án Cơ sở 2 của nhóm sinh viên Phan Tá Tấn Lực và Mai Công Sơn trình bày quá trình phân tích, thiết kế và xây dựng một website thương mại điện tử bán thiết bị công nghệ sử dụng Golang, ReactJS, TypeScript và SQL. Tài liệu thể hiện quy trình phát triển phần mềm đầy đủ từ đặc tả yêu cầu, mô hình hóa UML đến thiết kế cơ sở dữ liệu và giao diện người dùng. Hệ thống đã triển khai đầy đủ các chức năng cốt lõi phía khách hàng và các chức năng quản trị cơ bản, với hạn chế chính là giao diện Admin chưa được hoàn thiện do giới hạn thời gian thực hiện. Hướng phát triển tiếp theo tập trung vào hoàn thiện Admin UI, tối ưu hóa SEO, và nâng cao bảo mật hệ thống.