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

Đồ án được thực hiện trong bối cảnh thương mại điện tử ngày càng trở nên phổ biến, khi Internet đã trở thành nền tảng không thể thiếu cho việc truyền tải và trao đổi thông tin trên toàn cầu. Nhóm tác giả xác định đơn vị khảo sát thực tế là FM Style Tam Kỳ — một cửa hàng quần áo thời trang tại khu vực Thành phố Tam Kỳ, hiện đang kinh doanh hoàn toàn theo hình thức mua bán trực tiếp tại cửa hàng.

Từ quá trình khảo sát, nhóm xác định ba vấn đề tồn tại cần giải quyết:

  1. Cửa hàng chưa quảng bá rộng rãi thương hiệu đến nhiều khách hàng.
  2. Khách hàng tốn thời gian xem và lựa chọn sản phẩm phù hợp khi đến trực tiếp.
  3. Chưa đáp ứng được nhu cầu đặt hàng trực tuyến và giao hàng tận nhà.

Nhiệm vụ đặt ra gồm hai nội dung chính: (1) thiết kế một website giúp quảng bá thương hiệu cửa hàng đến nhiều khách hàng hơn; (2) xây dựng các tính năng hiển thị chi tiết sản phẩm, cho phép đặt hàng trực tuyến và nhận hàng tại nhà.

Đồ án không xác định phạm vi thời gian khảo sát cụ thể, nhưng phạm vi không gian tập trung vào mô hình sàn thương mại điện tử thời trang mang tên TiTan (hay TTL), phục vụ ba nhóm người dùng: Khách hàng (Customer), Cửa hàng (Shop/Client) và Quản trị viên (Admin).


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

Khung lý thuyết và công nghệ sử dụng

Đồ án dựa trên nền tảng lý thuyết mô hình kiến trúc phần mềm MVC (Model–View–Controller) — được phát triển từ những năm 1980 bởi Trygve Reenskaug và Adele Goldberg tại Viện nghiên cứu Palo Alto (PARC) của Xerox. Nhóm tác giả trình bày cơ chế hoạt động của ba thành phần Model, View và Controller, cùng các ưu điểm (tái sử dụng, dễ bảo trì, quản lý luồng điều khiển hiệu quả) và hạn chế (số lượng tệp tin nhiều, ứng dụng ban đầu phức tạp) của mô hình này.

Về công nghệ, đồ án sử dụng tập hợp sau:

Công nghệ Vai trò trong hệ thống
React Xây dựng giao diện người dùng (SPA), sử dụng JSX và Virtual DOM
React Native Phát triển ứng dụng di động Android/iOS
Redux Quản lý trạng thái ứng dụng (State Management)
Node.js + Express Xây dựng back-end, xử lý RESTful API
MySQL Hệ quản trị cơ sở dữ liệu quan hệ
XAMPP (Apache + MySQL + PHP) Môi trường phát triển và thử nghiệm cục bộ
Bootstrap Framework CSS front-end, hỗ trợ responsive design
HTML, CSS Nền tảng cấu trúc và định dạng giao diện web

Kiến trúc tổng thể của hệ thống là client-server: front-end phát triển bằng React Native, back-end sử dụng Node.js với Express, cơ sở dữ liệu MySQL, giao tiếp qua RESTful API.

Phương pháp nghiên cứu

Nhóm tác giả áp dụng kết hợp ba phương pháp, được so sánh và lựa chọn ưu tiên có hệ thống:

Phương pháp Ưu điểm Hạn chế Kết luận
Nghiên cứu thực tế Khách quan, trung thực Tốn kém, mất nhiều thời gian Kém ưu việt
Nghiên cứu qua sách báo Thông tin cô đọng, dễ tiếp thu Nguồn chưa nhiều, không được cập nhật Kém ưu việt
Nghiên cứu qua Internet Dễ thực hiện, thông tin rộng lớn, cập nhật thường xuyên Dễ bị rối thông tin nếu không biết lọc Ưu việt nhất

Kết luận: ưu tiên phương pháp nghiên cứu qua Internet, kết hợp hai phương pháp còn lại.


Thiết kế và triển khai hệ thống

Chương 1 — Tổng quan

Chương này xác định bài toán, mục đích và bố cục thực hiện. Bài toán đặt ra là xây dựng website bán hàng có đầy đủ chức năng của một sàn thương mại điện tử, tham khảo các nền tảng trong nước như Shopee. Hệ thống được đặt tên sàn là TiTan, hướng đến ba nhóm đối tượng: Customer, Client (Shop) và Admin.

Bố cục thực hiện gồm bốn nội dung:

  • Nội dung 1: Tìm hiểu React Native và cơ chế hoạt động.
  • Nội dung 2: Tìm hiểu HTML, CSS, XAMPP.
  • Nội dung 3: Phân tích và thiết kế hệ thống.
  • Nội dung 4: Triển khai ứng dụng phía người dùng, client và admin.

Nhóm tác giả cũng nhận diện khó khăn thực tế: kiến thức còn hạn chế, công nghệ thay đổi nhanh, thiếu đa dạng sản phẩm và thiếu tính tương tác cộng đồng — và đề xuất hướng giải quyết tương ứng.

Chương 2 — Cơ sở lý thuyết

Chương này trình bày nền tảng lý luận gồm: khái niệm và lợi ích của website, tổng quan về HTML, CSS, mô hình MVC, và giới thiệu chi tiết các công nghệ được sử dụng (React, XAMPP, MySQL, Bootstrap, React Native, Redux). Đặc biệt, phần giới thiệu Redux trình bày ba nguyên lý cốt lõi: (1) tất cả trạng thái ứng dụng lưu trong một state tree duy nhất; (2) state chỉ được phép đọc, thay đổi phải thông qua Action; (3) thay đổi thực hiện bằng pure function — Reducer.

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

Đây là chương trọng tâm về kỹ thuật. Nhóm tác giả mô tả hệ thống xoay quanh ba nhóm tác nhân:

  • Khách hàng (Customer): duyệt sản phẩm, đặt hàng, theo dõi đơn hàng, quản lý giỏ hàng, tìm kiếm, đánh giá sản phẩm.
  • Shop (Client): quản lý sản phẩm (thêm/sửa/đóng băng), quản lý đơn hàng (cập nhật trạng thái qua các bước: Chờ xác nhận, Đã đặt, Đang giao, Đã giao, Đã hủy, Trả hàng, Chờ lấy hàng), quản lý danh mục, thương hiệu và voucher.
  • Quản trị viên (Admin): quản lý toàn bộ tài khoản, sản phẩm, đơn hàng, voucher, bài đăng, comment; duyệt yêu cầu nâng cấp từ User lên Shop; đóng băng tài khoản vi phạm.

Yêu cầu phi chức năng được xác định cụ thể:

  • Xử lý yêu cầu trong vòng 2 giây.
  • Hiển thị kết quả tìm kiếm trong vòng 3 giây.
  • Lưu giữ dữ liệu trong 2 năm.
  • Giao diện thân thiện, hỗ trợ bảo mật và mã hóa dữ liệu người dùng.

Chương 3 trình bày hệ thống biểu đồ use-case cho từng nhóm tác nhân (Admin, Client, Customer), biểu đồ tuần tự cho các luồng nghiệp vụ chính (đăng xuất, quản lý đơn hàng, tìm kiếm, quản lý tài khoản), và bảng đặc tả use-case chi tiết với điều kiện trước, điều kiện sau, luồng sự kiện chính và luồng ngoại lệ.


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

Đồ án hướng đến xây dựng một hệ thống sàn thương mại điện tử thời trang hoàn chỉnh mang tên TiTan, với đầy đủ ba giao diện: Customer (mua sắm), Client/Shop (quản lý cửa hàng) và Admin (quản trị nền tảng). Hệ thống bao gồm các tính năng nâng cao như gợi ý mua hàng, tìm kiếm gần đúng và đề xuất sản phẩm đến người dùng.

Về đóng góp thực tiễn, tác giả tự nêu:

  • Tạo ra sản phẩm công nghệ có giá trị sử dụng thực tế trong cuộc sống.
  • Đáp ứng nhu cầu đặt hàng trực tuyến và giao hàng tận nhà cho cửa hàng FM Style Tam Kỳ.
  • Hỗ trợ các doanh nghiệp nhỏ tiếp cận thị trường và xây dựng thương hiệu trực tuyến.
  • Phát triển kiến thức và kỹ năng thực tiễn nhằm đáp ứng yêu cầu nhà tuyển dụng sau khi ra trường.

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

Văn bản ghi nhận một số hạn chế mà nhóm tác giả tự nhận thức:

  • Kiến thức thực tế còn hạn chế trong quá trình triển khai.
  • Công nghệ thay đổi nhanh, đòi hỏi thời gian và công sức cập nhật liên tục (đặc biệt với React, vốn được cập nhật thường xuyên).
  • Thiếu sự đa dạng trong sản phẩm và tính năng tương tác cộng đồng.
  • React Native còn thiếu một số component quan trọng, hiệu năng kém hơn so với native app trong các tình huống tính toán cao.

Hướng phát triển tiếp theo có thể mở rộng sang hoàn thiện tính năng tương tác cộng đồng (diễn đàn chia sẻ phong cách thời trang) và tối ưu hiệu năng hệ thống khi quy mô người dùng tăng lên.


Giá trị tham khảo

Đồ án phù hợp để tham khảo với các đối tượng sau:

  • Sinh viên ngành Công nghệ thông tin, Khoa học máy tính đang thực hiện đồ án xây dựng hệ thống web hoặc ứng dụng di động, đặc biệt các đề tài về thương mại điện tử.
  • Người học React, React Native, Redux muốn tham khảo cách áp dụng các công nghệ này vào dự án thực tế quy mô sinh viên.
  • Người tìm hiểu kiến trúc MVC và RESTful API trong bối cảnh ứng dụng web thương mại điện tử.

Phần đáng tham khảo nhất là Chương 3 với hệ thống biểu đồ use-case và bảng đặc tả chi tiết — cung cấp mẫu tham chiếu tốt cho việc phân tích yêu cầu hệ thống. Phần Chương 2 về cơ sở lý thuyết cũng hữu ích cho người mới bắt đầu cần nắm nền tảng về React, Redux và mô hình MVC.


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

1. Hệ thống TiTan gồm những nhóm người dùng nào và quyền hạn của mỗi nhóm ra sao? Hệ thống có ba nhóm: Customer (mua sắm, quản lý giỏ hàng và đơn hàng của cá nhân), Shop/Client (quản lý sản phẩm, đơn hàng, danh mục, thương hiệu, voucher của cửa hàng mình), và Admin (quyền cao nhất: quản lý toàn bộ tài khoản, phê duyệt nâng cấp User lên Shop, đóng băng tài khoản, quản lý voucher và bài đăng toàn hệ thống).

2. Cửa hàng thực tế nào được khảo sát làm cơ sở xây dựng hệ thống? FM Style Tam Kỳ — cửa hàng quần áo thời trang tại khu vực Thành phố Tam Kỳ, đang kinh doanh theo hình thức mua bán trực tiếp tại cửa hàng vào thời điểm khảo sát.

3. Đồ án sử dụng công nghệ gì cho phần back-end và cơ sở dữ liệu? Back-end sử dụng Node.js với Express, cơ sở dữ liệu dùng MySQL, giao tiếp giữa các thành phần thực hiện qua RESTful API. Môi trường phát triển cục bộ sử dụng XAMPP.

4. Trạng thái đơn hàng được quản lý qua những bước nào trong hệ thống? Hệ thống định nghĩa bảy trạng thái đơn hàng: Chờ xác nhận → Đã đặt → Đang giao → Đã giao → Đã hủy → Trả hàng → Chờ lấy hàng. Cả Shop và Admin đều có khả năng cập nhật trạng thái này.

5. Yêu cầu phi chức năng nào được xác định cụ thể về hiệu năng hệ thống? Văn bản quy định: các yêu cầu phải được xử lý trong vòng 2 giây, kết quả tìm kiếm hiển thị trong vòng 3 giây, và dữ liệu phải được lưu giữ trong ít nhất 2 năm để đảm bảo khả năng phục hồi.


Kết luận

Đồ án chuyên ngành 2 của nhóm sinh viên Trần Tấn Tài và Trần Chánh Tín (lớp 21KIT, Trường Đại học Công nghệ Thông tin và Truyền thông Việt – Hàn) tập trung vào việc phân tích, thiết kế và xây dựng một sàn thương mại điện tử thời trang mang tên TiTan, xuất phát từ nhu cầu thực tiễn khảo sát tại cửa hàng FM Style Tam Kỳ. Hệ thống được thiết kế theo kiến trúc client-server với React Native ở front-end, Node.js/Express ở back-end và MySQL làm cơ sở dữ liệu, phục vụ đồng thời ba nhóm người dùng với phân quyền rõ ràng. Chương 3 là phần có giá trị kỹ thuật cao nhất, cung cấp tài liệu phân tích yêu cầu và thiết kế hệ thống chi tiết qua biểu đồ use-case và bảng đặc tả nghiệp vụ.