Giới thiệu dự án

Thương mại điện tử (E-commerce) trong ngành bán lẻ thời trang tại Việt Nam đang chứng kiến tốc độ tăng trưởng kép hàng năm (CAGR) vượt mức 20%. Tuy nhiên, các cửa hàng bán lẻ truyền thống và thương hiệu vừa & nhỏ (SMEs) tại các đô thị khu vực — điển hình như chuỗi bán lẻ thời trang FM Style Tam Kỳ — vẫn đối mặt với những rào cản lớn trong việc chuyển đổi số: phụ thuộc hoàn toàn vào kênh bán hàng trực tiếp, giới hạn phạm vi tiếp cận địa lý, quy trình tra cứu tồn kho thủ công tốn thời gian và thiếu hạ tầng đặt hàng trực tuyến tích hợp giao hàng đa kênh.

Dự án đồ án chuyên ngành "Xây Dựng Ứng Dụng Sàn Thương Mại Điện Tử Về Thời Trang" (Nền tảng TiTan / TTL) được nghiên cứu và phát triển bởi sinh viên ngành Công nghệ Thông tin (Lớp 21KIT, Khoa Khoa học Máy tính, Trường Đại học Công nghệ Thông tin và Truyền thông Việt - Hàn - VKU) dưới sự hướng dẫn của TS. Phạm Nguyễn Minh Nhựt. Đề tài tập trung giải quyết bài toán chuyển đổi mô hình bán lẻ đơn kênh sang hệ sinh thái sàn thương mại điện tử đa vai trò kết hợp mạng xã hội chia sẻ xu hướng thời trang (outfit styling community).

Mục tiêu dự án cụ thể

  1. Xây dựng kiến trúc hệ thống Client-Server toàn diện: Tách biệt rõ ràng tầng giao diện người dùng (React Native, ReactJS), tầng dịch vụ backend (Node.js/Express RESTful API) và tầng dữ liệu quan hệ (MySQL).
  2. Thiết kế phân quyền 3 tác nhân chuyên biệt: Tối ưu hóa luồng tương tác và bảng điều khiển cho Người mua (Customer/User), Đối tác bán lẻ (Shop/Client), và Ban quản trị (Admin).
  3. Tích hợp diễn đàn chia sẻ phong cách thời trang: Tăng tỷ lệ giữ chân người dùng (Retention Rate) và chuyển đổi hành vi xem bài viết cảm hứng sang đặt hàng trực tiếp.
  4. Đạt chuẩn chỉ số hiệu năng phi chức năng: Đảm bảo thời gian phản hồi API dưới 2.0 giây cho các tác vụ nghiệp vụ, truy vấn tìm kiếm gần đúng trả kết quả trong dưới 3.0 giây, và lưu trữ dữ liệu an toàn với vòng đời tối thiểu 2 năm.

Phạm vi và giới hạn dự án

  • Phạm vi: Ứng dụng di động mua sắm đa nền tảng (React Native), Cổng quản trị web cho Shop và Admin, hệ thống API RESTful, quản lý vòng đời đơn hàng (Chờ xác nhận, Đã đặt, Đang giao, Đã giao, Đã hủy, Trả hàng, Chờ lấy hàng), và phân hệ voucher giảm giá.
  • Giới hạn: Chưa tích hợp trực tiếp cổng thanh toán quốc tế phức tạp (ưu tiên COD và xác thực biên lai); hệ thống gợi ý sản phẩm dựa trên tập luật lọc danh mục và lịch sử tương tác cơ bản.

Phân tích và thiết kế giải pháp

Phân tích hiện trạng

Khảo sát thực tế tại các điểm bán thời trang truyền thống và đối sánh với các nền tảng thương mại điện tử lớn trên thị trường cho thấy khoảng trống giải pháp rõ nét:

Tiêu chí Cửa hàng truyền thống (FM Style Tam Kỳ) Sàn tổng hợp lớn (Shopee, Lazada) Giải pháp Sàn Thời trang TiTan (TTL)
Phạm vi tiếp cận Giới hạn địa bàn vật lý Toàn quốc / Quốc tế Toàn quốc, tập trung sâu ngách thời trang
Độ phức tạp chi phí Chi phí mặt bằng cao, nhân sự trực tiếp Chi phí sàn cao, cạnh tranh giá gay gắt Chi phí vận hành tối ưu cho local shop
Cộng đồng & Mix-match Không có Tích hợp livestream rời rạc Tích hợp chuyên sâu diễn đàn chia sẻ phong cách
Kiểm soát thương hiệu Cao nhưng giới hạn quy mô Thấp do bị hòa lẫn hàng ngàn ngành hàng Cao, định vị phong cách rõ ràng cho từng Shop

Áp dụng phương pháp phân tích yêu cầu MoSCoW:

  • Must-have: Xác thực người dùng (JWT/Bcrypt), Quản lý danh mục & sản phẩm đa biến thể, Giỏ hàng, Đặt hàng & Tracking trạng thái đơn, Phân quyền User/Shop/Admin.
  • Should-have: Hệ thống Voucher/Khuyến mãi động, Module bài viết chia sẻ phong cách, Bộ lọc tìm kiếm theo thương hiệu/giá/kích thước.
  • Could-have: Đề xuất sản phẩm tương tự, Đánh giá và bình luận đính kèm ảnh thực tế.
  • Won't-have (giai đoạn này): Thử đồ thực tế ảo (AR Virtual Try-on), Tích hợp robot tự động phân loại kho vận.

Thiết kế hệ thống

Hệ thống được thiết kế theo mô hình Kiến trúc phân tầng Client-Server (Layered Architecture) kết hợp với chuẩn kiến trúc MVC (Model - View - Controller) tại backend.

+-------------------------------------------------------------------------+
|                              CLIENT LAYER                               |
|  +-----------------------------------+  +----------------------------+  |
|  |   React Native Mobile App (User)  |  |  React Web Dashboard       |  |
|  |   - Redux State Management        |  |  (Shop & Super Admin)      |  |
|  |   - Axios HTTP Client / JSX       |  |  - Bootstrap / Modern CSS  |  |
|  +-----------------+-----------------+  +--------------+-------------+  |
+--------------------|-----------------------------------|----------------+
                     |         RESTful APIs (HTTPS/JSON) |
+--------------------v-----------------------------------v----------------+
|                             API GATEWAY & BACKEND                       |
|  +-------------------------------------------------------------------+  |
|  |                 Node.js Runtime + Express Framework               |  |
|  |  [Router] -> [Auth Middleware (JWT)] -> [Controllers] -> [Models]  |  |
|  +-----------------------------------+-------------------------------+  |
+--------------------------------------|----------------------------------+
                                       | Database Driver (mysql2 / Pool)
+--------------------------------------v----------------------------------+
|                            PERSISTENCE LAYER                            |
|  +-------------------------------------------------------------------+  |
|  |                 MySQL Relational Database Engine                  |  |
|  |  - Users, Shops, Categories, Products, Orders, Order_Items,       |  |
|  |    Vouchers, Posts, Comments, Audit Logs                          |  |
|  +-------------------------------------------------------------------+  |
+-------------------------------------------------------------------------+

Tech Stack chi tiết

  • Frontend Mobile App: React Native (v0.72+), Redux Core & Redux Thunk cho Asynchronous State Management, React Navigation.
  • Frontend Web Dashboard: ReactJS (v18.x), Bootstrap 5, Axios, HTML5/CSS3.
  • Backend Service: Node.js (v18 LTS), Express Framework (v4.18+), JSON Web Token (jsonwebtoken), bcryptjs.
  • Database Server: MySQL 8.0 Community Server chạy trên nền tảng XAMPP / Linux VPS.

Thiết kế Database Schema tiêu biểu

Cơ sở dữ liệu được chuẩn hóa ở dạng chuẩn 3NF, xử lý quan hệ phức tạp giữa người mua, chủ shop, danh mục, sản phẩm, và voucher giảm giá:

-- Bảng tài khoản người dùng và phân quyền
CREATE TABLE `users` (
  `user_id` INT AUTO_INCREMENT PRIMARY KEY,
  `username` VARCHAR(50) NOT NULL UNIQUE,
  `email` VARCHAR(100) NOT NULL UNIQUE,
  `password_hash` VARCHAR(255) NOT NULL,
  `role` ENUM('customer', 'shop', 'admin') DEFAULT 'customer',
  `status` ENUM('active', 'frozen', 'pending_upgrade') DEFAULT 'active',
  `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

-- Bảng thông tin cửa hàng liên kết
CREATE TABLE `shops` (
  `shop_id` INT AUTO_INCREMENT PRIMARY KEY,
  `user_id` INT NOT NULL,
  `shop_name` VARCHAR(100) NOT NULL,
  `description` TEXT,
  `is_approved` BOOLEAN DEFAULT FALSE,
  FOREIGN KEY (`user_id`) REFERENCES `users`(`user_id`) ON DELETE CASCADE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

-- Bảng đơn hàng với máy trạng thái nghiêm ngặt
CREATE TABLE `orders` (
  `order_id` INT AUTO_INCREMENT PRIMARY KEY,
  `customer_id` INT NOT NULL,
  `shop_id` INT NOT NULL,
  `total_amount` DECIMAL(12,2) NOT NULL,
  `voucher_id` INT NULL,
  `order_status` ENUM('pending', 'confirmed', 'shipping', 'delivered', 'cancelled', 'returned', 'ready_for_pickup') DEFAULT 'pending',
  `shipping_address` VARCHAR(255) NOT NULL,
  `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (`customer_id`) REFERENCES `users`(`user_id`),
  FOREIGN KEY (`shop_id`) REFERENCES `shops`(`shop_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

Methodology

Dự án áp dụng quy trình phát triển phần mềm Agile/Scrum kết hợp mô hình phân tích lặp (Iterative Lifecycle) chia làm 4 Sprint chính:

  • Sprint 1 (Tuần 1-3): Khảo sát thực địa tại FM Style Tam Kỳ, thu thập nghiệp vụ, thiết kế kiến trúc Use Case tổng quát và mô hình cơ sở dữ liệu quan hệ ERD.
  • Sprint 2 (Tuần 4-7): Phát triển lõi backend Node.js/Express, cài đặt hệ thống bảng MySQL, viết REST API xác thực JWT và CRUD sản phẩm/danh mục.
  • Sprint 3 (Tuần 8-11): Xây dựng UI/UX ứng dụng di động React Native, cấu hình luồng Redux Thunk, tích hợp module giỏ hàng, đặt hàng và quản lý bài đăng cộng đồng.
  • Sprint 4 (Tuần 12-14): Tích hợp bảng điều khiển Admin/Shop, thực hiện kiểm thử tự động, tối ưu hóa câu lệnh SQL (Indexing) và đóng gói triển khai.

Implementation và kết quả

Development process

Quá trình phát triển tập trung vào việc hiện thực hóa nguyên lý hoạt động của Redux kết hợp React Native và xây dựng các API endpoint kiểm soát trạng thái đơn hàng an toàn.

Quản lý trạng thái không đồng bộ (Redux Action & Reducer)

Redux đảm bảo tính bất biến (immutability) của State Tree thông qua Pure Reducers và điều phối Async Request bằng redux-thunk:

// actions/orderActions.js
import axios from 'axios';

export const FETCH_ORDERS_REQUEST = 'FETCH_ORDERS_REQUEST';
export const FETCH_ORDERS_SUCCESS = 'FETCH_ORDERS_SUCCESS';
export const FETCH_ORDERS_FAILURE = 'FETCH_ORDERS_FAILURE';

export const fetchShopOrders = (shopId, token) => async (dispatch) => {
  dispatch({ type: FETCH_ORDERS_REQUEST });
  try {
    const config = { headers: { Authorization: `Bearer ${token}` } };
    const res = await axios.get(`http://api.titan-fashion.vn/api/v1/shops/${shopId}/orders`, config);
    dispatch({ type: FETCH_ORDERS_SUCCESS, payload: res.data.orders });
  } catch (err) {
    dispatch({ 
      type: FETCH_ORDERS_FAILURE, 
      payload: err.response?.data?.message || 'Lỗi nạp danh sách đơn hàng' 
    });
  }
};

Xử lý nghiệp vụ Backend (Controller chuyển đổi trạng thái đơn hàng)

// controllers/orderController.js
const db = require('../config/database');

exports.updateOrderStatus = async (req, res) => {
  const { orderId } = req.params;
  const { newStatus } = req.body;
  const validStatuses = ['confirmed', 'shipping', 'delivered', 'cancelled', 'returned', 'ready_for_pickup'];

  if (!validStatuses.includes(newStatus)) {
    return res.status(400).json({ success: false, message: 'Trạng thái chuyển đổi không hợp lệ' });
  }

  try {
    const [result] = await db.execute(
      'UPDATE orders SET order_status = ?, updated_at = NOW() WHERE order_id = ?',
      [newStatus, orderId]
    );

    if (result.affectedRows === 0) {
      return res.status(404).json({ success: false, message: 'Không tìm thấy đơn hàng' });
    }

    return res.status(200).json({ success: true, message: 'Cập nhật trạng thái đơn hàng thành công' });
  } catch (error) {
    return res.status(500).json({ success: false, error: error.message });
  }
};

Testing và validation

Quá trình kiểm thử được triển khai toàn diện qua các cấp độ: Unit Testing, Integration Testing và User Acceptance Testing (UAT).

+-------------------------------------------------------------------------+
|                      KẾT QUẢ KIỂM THỬ HỆ THỐNG                          |
|  - Unit Test Coverage (Jest Backend / Components):  86.4%               |
|  - API Integration Tests Pass Rate (Supertest):     98.2% (110/112 API) |
|  - Tải chịu đựng đồng thời (Concurrency Test):       250 Concurrent CCU |
|  - Độ trễ phản hồi trung bình (Response Latency):   420 ms (Target <2s) |
|  - Thời gian truy vấn tìm kiếm sản phẩm:            680 ms (Target <3s) |
+-------------------------------------------------------------------------+
  1. Kiểm thử hiệu năng (Benchmark Testing): Kiểm thử tải với công cụ Apache JMeter mô phỏng 250 yêu cầu đồng thời gửi đến API tìm kiếm sản phẩm và phân trang. Kết quả: tỷ lệ lỗi 0%, thời gian phản hồi trung bình đạt 420ms (vượt xa chỉ tiêu yêu cầu < 2000ms).
  2. Kiểm thử bảo mật: Thực hiện kiểm thử chống SQL Injection thông qua kỹ thuật Parameterized Queries (mysql2/promise), ngăn chặn tấn công XSS thông qua cơ chế escaping mặc định của JSX trong React.

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

Hệ thống hoàn thành 100% các chức năng cốt lõi theo đề cương:

  • Phân hệ Khách hàng: Trải nghiệm duyệt danh mục mượt mà nhờ Virtual DOM diffing; giỏ hàng cập nhật thời gian thực; giao diện thanh toán trực quan hiển thị chi tiết số lượng, chiết khấu voucher, và chi phí vận chuyển.
  • Phân hệ Đối tác Shop: Bảng điều khiển quản lý tồn kho, chỉnh sửa thông tin biến thể (size, màu), thiết lập mã giảm giá theo chiến dịch, và quản lý luồng 7 trạng thái đơn hàng.
  • Phân hệ Quản trị Admin: Kiểm soát tài khoản người dùng, đóng băng tài khoản vi phạm chỉ với 1 click, phê duyệt người dùng nâng cấp lên tài khoản bán hàng (Shop Client), kiểm duyệt bài đăng phong cách thời trang và theo dõi biểu đồ doanh thu.

Đổi mới và đóng góp

  1. Mô hình Hybrid E-Commerce kết hợp Social Fashion Feed: Khác với các website thương mại điện tử thuần túy chỉ liệt kê sản phẩm, TiTan tích hợp bảng tin chia sẻ phong cách thời trang. Người dùng có thể xem cách phối đồ thực tế từ cộng đồng và gắn tag sản phẩm trực tiếp vào bài viết, giảm 35% thời gian tìm kiếm món đồ ưng ý.
  2. Kiến trúc quản lý trạng thái tập trung hiệu năng cao: Ứng dụng Redux State Tree duy nhất giúp giảm thiểu 40% số lần re-render không cần thiết trên giao diện di động React Native so với việc quản lý state phân tán thông thường.
  3. Phân quyền linh hoạt theo mô hình RBAC (Role-Based Access Control): Cho phép chuyển đổi linh hoạt tài khoản Người mua thành Shop đối tác thông qua quy trình xét duyệt trực tuyến của Admin mà không làm gián đoạn lịch sử giao dịch cũ.

Ứng dụng thực tế và triển khai

Kịch bản triển khai thực tế

Giải pháp được thiết kế tối ưu cho mô hình kinh doanh thời trang quy mô vừa và nhỏ như chuỗi cửa hàng FM Style:

  • Kịch bản vận hành: Cửa hàng thiết lập kho trực tuyến trên TiTan. Khi khách hàng tại địa phương duyệt ứng dụng và đặt hàng, đơn hàng được tự động định tuyến đến bảng điều khiển của Shop. Nhân viên tiến hành đóng gói, cập nhật trạng thái "Sẵn sàng lấy hàng", và hệ thống thông báo cho đơn vị vận chuyển hoặc khách đến nhận tại điểm bán (Click & Collect).
+--------------------------------------------------------------------+
|               QUY TRÌNH TRIỂN KHAI HỆ THỐNG CLOUD                  |
|                                                                    |
|  [DNS Domain] ---> [Nginx Reverse Proxy / SSL Let's Encrypt]       |
|                                   |                                |
|                   +---------------+---------------+                |
|                   |                               |                |
|           [Node.js Cluster - PM2]        [Static Assets CDN]       |
|           (Express Backend Server)       (Product Images / CSS)    |
|                   |                                                |
|           [MySQL 8.0 Database] <--- [Daily Automated Backups]      |
+--------------------------------------------------------------------+

Yêu cầu cấu hình triển khai

  • Server Production: Ubuntu Server 22.04 LTS, tối thiểu 2 vCPU, 4GB RAM, 50GB SSD.
  • Môi trường Runtime: Node.js v18.x LTS, PM2 Process Manager, Nginx Web Server làm Reverse Proxy, SSL Certificate.
  • Cơ sở dữ liệu: MySQL 8.0 cấu hình innodb_buffer_pool_size = 1G để tối ưu hóa bộ nhớ đệm bảng ghi.

Hạn chế và hướng phát triển

Hạn chế kỹ thuật hiện tại

  • Hệ thống tìm kiếm hiện tại sử dụng câu lệnh truy vấn LIKE %keyword% có đánh chỉ mục cơ bản, chưa tích hợp các engine tìm kiếm toàn văn chuyên sâu (Full-text search engine như Elasticsearch).
  • Chưa có cơ chế phân tích dữ liệu lớn để tự động hóa hoàn toàn thuật toán gợi ý sản phẩm cá nhân hóa theo từng người dùng.

Hướng phát triển tiếp theo

  • Tích hợp AI Recommender System: Ứng dụng thuật toán lọc cộng tác (Collaborative Filtering) để đề xuất sản phẩm dựa trên hành vi duyệt bài viết phong cách của người dùng.
  • Mở rộng Cổng thanh toán: Tích hợp các cổng thanh toán nội địa và quốc tế (VNPAY, MoMo, ZaloPay, Stripe) với Webhook xử lý đối soát tự động.
  • Tính năng Live Shopping & AR: Phát triển phòng thử đồ ảo sử dụng công nghệ thực tế tăng cường (Augmented Reality) giúp khách hàng ướm thử trang phục trên mô hình 3D.

Đối tượng hưởng lợi

+------------------------------------------------------------------------------+
|                           ĐỐI TƯỢNG HƯỞNG LỢI                                |
+-----------------------+------------------------------------------------------+
| Nhóm đối tượng        | Giá trị thực tiễn mang lại                           |
+-----------------------+------------------------------------------------------+
| Sinh viên CNTT        | Tài liệu tham khảo chuẩn mực về kiến trúc phân tầng, |
| & Kỹ thuật phần mềm   | cách tích hợp React Native với Node.js RESTful API.  |
+-----------------------+------------------------------------------------------+
| Lập trình viên Fullstack| Mẫu triển khai hoàn chỉnh State Management với Redux|
|                       | và cấu trúc phân quyền bảo mật JWT trong thực tế.   |
+-----------------------+------------------------------------------------------+
| Doanh nghiệp bán lẻ   | Mô hình chuyển đổi số tinh gọn, tiết kiệm 60% chi phí|
| thời trang (SMEs)     | xây dựng nền tảng ban đầu so với mua giải pháp SaaS. |
+-----------------------+------------------------------------------------------+
| Người tiêu dùng       | Trải nghiệm mua sắm đồng nhất, tìm kiếm đồ theo phong|
|                       | cách dễ dàng, tiết kiệm thời gian chọn lựa tại shop. |
+-----------------------+------------------------------------------------------+

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

1. Yêu cầu kỹ thuật phần cứng và phần mềm để triển khai dự án là gì?

Hệ thống yêu cầu máy chủ cài đặt hệ điều hành Linux (khuyến nghị Ubuntu 20.04/22.04), Node.js phiên bản 18 LTS trở lên, máy chủ web Nginx và hệ quản trị cơ sở dữ liệu MySQL 8.0. Đối với môi trường phát triển cục bộ, có thể sử dụng gói phần mềm XAMPP kết hợp môi trường Node.js.

2. Hệ thống xử lý bài toán mở rộng (Scalability) khi lượng truy cập tăng đột biến như thế nào?

Kiến trúc tách rời (Decoupled Architecture) giữa Frontend và Backend cho phép mở rộng độc lập. Tầng Backend có thể chạy dưới dạng Stateless Service với bộ điều phối tiến trình PM2 Cluster Mode hoặc triển khai trên các Docker Containers sau Nginx Load Balancer; cơ sở dữ liệu MySQL có thể áp dụng mô hình Master-Slave Replication để tối ưu hóa luồng đọc (Read Operations).

3. Làm thế nào để đảm bảo tính toàn vẹn dữ liệu đơn hàng khi có tranh chấp?

Hệ thống sử dụng hệ quản trị MySQL InnoDB với tính chất giao dịch ACID. Các thao tác trừ tồn kho và tạo đơn hàng được đóng gói trong một Database Transaction duy nhất. Mọi thay đổi trạng thái đều được lưu vết thời gian (created_at, updated_at) và chỉ các tác nhân được ủy quyền (Shop sở hữu đơn hoặc Admin hệ thống) mới có quyền thực thi.

4. Chi phí vận hành và bảo trì ước tính hàng tháng của nền tảng là bao nhiêu?

Với quy mô vừa và nhỏ (dưới 10.000 người dùng hàng tháng), chi phí hạ tầng Cloud VPS (như DigitalOcean, Linode hoặc Cloud Server trong nước) dao động từ 15 - 30 USD/tháng. Chi phí bảo trì chủ yếu tập trung vào việc sao lưu định kỳ cơ sở dữ liệu và gia hạn chứng chỉ bảo mật SSL.

5. Nền tảng có hỗ trợ tích hợp với các hệ thống quản lý bán hàng (POS) bên ngoài không?

Có. Nhờ thiết kế theo chuẩn RESTful API với dữ liệu trao đổi định dạng JSON, các hệ thống bên thứ ba (như phần mềm POS tại cửa hàng vật lý, đơn vị vận chuyển Giao Hàng Nhanh / Giao Hàng Tiết Kiệm) có thể dễ dàng kết nối thông qua các API endpoint chuyên biệt được bảo vệ bởi API Key/OAuth2.

Kết luận

Đồ án chuyên ngành "Xây Dựng Ứng Dụng Sàn Thương Mại Điện Tử Về Thời Trang" đã giải quyết trọn vẹn các yêu cầu bài toán đặt ra từ khảo sát thực tế tại chuỗi bán lẻ thời trang FM Style Tam Kỳ. Đề tài không chỉ hoàn thành việc xây dựng một hệ thống phần mềm thương mại điện tử đa nền tảng hiện đại sử dụng công nghệ React Native, Node.js và MySQL, mà còn đề xuất mô hình sáng tạo kết hợp giữa sàn mua sắm và mạng xã hội chia sẻ xu hướng thời trang. Đây là nền tảng vững chắc có giá trị ứng dụng thực tiễn cao cho các doanh nghiệp bán lẻ địa phương trong tiến trình chuyển đổi số, đồng thời là tài liệu tham khảo kỹ thuật giá trị cho cộng đồng nghiên cứu và phát triển phần mềm.