Giới thiệu dự án

Thị trường giáo dục trực tuyến (E-Learning) toàn cầu và tại Việt Nam đang chứng kiến sự tăng trưởng vượt bậc với tốc độ tăng trưởng kép hàng năm (CAGR) đạt trên 16.5%. Sau đại dịch COVID-19, nhu cầu học tập linh hoạt, không giới hạn không gian và thời gian trở thành xu thế tất yếu. Tuy nhiên, người học tiếng Anh tại Việt Nam đối mặt với nhiều rào cản: chi phí tại các trung tâm ngoại ngữ truyền thống đắt đỏ (trung bình 3 - 7 triệu VNĐ/khóa), thời gian học cố định thiếu linh hoạt cho người đi làm, và các nền tảng tự học hiện tại thường đơn điệu, thiếu tính cá nhân hóa hoặc chỉ tập trung vào một kỹ năng duy nhất như luyện thi TOEIC ngắn hạn.

Dự án "Xây dựng Website học tiếng Anh" được thực hiện bởi nhóm tác giả Nguyễn Phúc Nghiêm và Đàm Lưu Trung Hiếu dưới sự hướng dẫn của ThS. Nguyễn Hữu Trung tại Trường Đại học Sư phạm Kỹ thuật TP.HCM (HCMUTE). Đề tài giải quyết triệt để bài toán xây dựng một hệ sinh thái học tiếng Anh toàn diện, kết nối 3 đối tượng tác nhân: Học viên (Student), Giáo viên (Teacher) và Quản trị viên (Administrator).

                        +---------------------------------------------+
                        |           NGƯỜI DÙNG / CLIENT               |
                        |   (ReactJS Single Page Application - SPA)   |
                        +----------------------+----------------------+
                                               |
                                    HTTPS / RESTful APIs
                                               |
                                               v
                        +---------------------------------------------+
                        |          BACKEND - APPLICATION TIER         |
                        |     (Spring Boot 2.7.x / Java 17 Engine)    |
                        |  +---------------------------------------+  |
                        |  | Spring Security (JWT / OAuth2 Auth)   |  |
                        |  | Controller -> Service -> Repository   |  |
                        |  | VNPay SDK / File Storage Handler      |  |
                        |  +---------------------------------------+  |
                        +----------------------+----------------------+
                                               |
                                         Hibernate / JPA
                                               |
                                               v
                        +---------------------------------------------+
                        |            DATABASE - STORAGE TIER          |
                        |             (MySQL 8.0 Community)           |
                        +---------------------------------------------+

Mục tiêu dự án

  1. Xây dựng nền tảng E-Learning đa phân hệ: Cung cấp giao diện tương tác chuyên biệt cho Học viên (mua khóa học, học video, luyện đề, ôn từ vựng Flashcard, viết blog thảo luận), Giáo viên (soạn giáo trình, tạo đề thi, quản lý bài giảng) và Admin (quản trị hệ thống, duyệt khóa học, thống kê doanh thu).
  2. Hiện đại hóa kiến trúc kỹ thuật: Áp dụng mô hình Three-Tier Architecture, kết hợp Spring Boot (Backend) và ReactJS (Frontend) tối ưu hóa khả năng tái sử dụng component và chia sẻ tài nguyên API.
  3. Tích hợp cổng thanh toán trực tuyến: Kết nối trực tiếp cổng thanh toán điện tử VNPay thông qua thuật toán mã hóa bảo mật HMAC-SHA512.
  4. Đảm bảo tính an toàn và xác thực đa kênh: Tích hợp Spring Security hỗ trợ xác thực qua tài khoản hệ thống (JWT) cùng đăng nhập liên kết qua bên thứ ba (Google OAuth2, Facebook Login).

Phạm vi và Giới hạn hệ thống

  • Phạm vi: Ứng dụng web phục vụ học tập trực tuyến, quản lý khóa học theo danh mục, luyện đề thi trắc nghiệm có chấm điểm tự động, luyện từ vựng theo phương pháp lặp lại ngắt quãng (Flashcard), diễn đàn trao đổi (Blog) và thương mại điện tử khóa học.
  • Giới hạn: Hệ thống hiện tập trung phục vụ trên nền tảng Web Application (Responsive); chức năng chấm điểm tự động giới hạn ở định dạng trắc nghiệm (Multiple Choice Questions) và điền từ; chưa tích hợp công nghệ AI nhận diện giọng nói (Speech-to-Text) chuyên sâu để chấm phát âm thời gian thực.

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

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

Khảo sát các nền tảng học tiếng Anh phổ biến hiện nay như TiengAnhMoiNgay, Duolingo và Coursera/Edumall cho thấy các ưu điểm và khoảng trống công nghệ cụ thể:

Tiêu chí TiengAnhMoiNgay Nền tảng E-Commerce chung (Udemy/Edumall) Website đề tài (HCMUTE)
Độ chuyên biệt Chuyên sâu luyện thi TOEIC Khóa học đa ngành, thiếu công cụ luyện thi chuyên dụng Chuyên sâu tiếng Anh: Khóa học + Luyện đề + Flashcard
Mô hình tác nhân Hệ thống đóng (Nội dung do Admin cập nhật) Đa giảng viên, chia sẻ doanh thu 3 Roles: Học viên - Giảng viên độc lập - Administrator
Tính năng bổ trợ Bài tập đi kèm bài giảng Chỉ có video và tài liệu đính kèm (PDF) Flashcard từ vựng, Diễn đàn Blog, Thi thử có bấm giờ
Phương thức thanh toán Chuyển khoản thủ công / Thẻ cào Cổng thanh toán quốc tế / Nội địa Tích hợp cổng thanh toán VNPay QR / Thẻ ATM nội địa
Chi phí vận hành Cao (hạ tầng server riêng) Chia sẻ hoa hồng lớn (30 - 50%) Tối ưu mã nguồn mở (Spring Boot + MySQL + ReactJS)

Phân loại yêu cầu theo mô hình MoSCoW

  • Must-Have: Đăng ký/đăng nhập (Form & OAuth2 Google/Facebook), Quản lý khóa học/bài giảng, Trình phát video bài học, Làm bài kiểm tra trắc nghiệm, Thanh toán đơn hàng qua VNPay, Hệ thống phân quyền RBAC (Role-Based Access Control).
  • Should-Have: Học từ vựng qua Flashcard tương tác, Viết blog chia sẻ kiến thức, Bình luận/thảo luận dưới bài học, Đánh giá (Rating & Review) khóa học, Báo cáo doanh thu cho Admin/Giáo viên.
  • Could-Have: Lọc khóa học nâng cao theo giá/cấp độ, Thống kê biểu đồ học tập cá nhân, Gửi email thông báo tự động khi thanh toán thành công.
  • Won't-Have (giai đoạn này): Chấm bài viết luận bằng AI, Luyện nói trực tiếp 1-1 qua WebRTC.

Thiết kế hệ thống

Công nghệ sử dụng và phiên bản

  • Backend: Java 17 LTS, Spring Boot 2.7.12, Spring Data JPA, Spring Security 5.7, Hibernate ORM 5.6.
  • Frontend: ReactJS 18.2.0, Redux Toolkit, React Router DOM v6, Axios, Bootstrap 5 / TailwindCSS.
  • Database: MySQL 8.0 Community Server (Storage Engine: InnoDB, Charset: utf8mb4).
  • Build Tools & Environment: Maven 3.8+, Node.js 18.x, Visual Studio Code, IntelliJ IDEA, Postman.

Thiết kế cơ sở dữ liệu (Database Schema)

Cơ sở dữ liệu được chuẩn hóa ở dạng chuẩn 3NF với hơn 15 bảng quan hệ chính. Dưới đây là lược đồ SQL của các bảng cốt lõi:

-- Bảng Users & Phân quyền
CREATE TABLE `users` (
    `user_id` BIGINT AUTO_INCREMENT PRIMARY KEY,
    `email` VARCHAR(100) NOT NULL UNIQUE,
    `password` VARCHAR(255) NULL, -- Null nếu dùng OAuth2
    `full_name` VARCHAR(150) NOT NULL,
    `phone` VARCHAR(20),
    `role` ENUM('ROLE_STUDENT', 'ROLE_TEACHER', 'ROLE_ADMIN') NOT NULL DEFAULT 'ROLE_STUDENT',
    `auth_provider` ENUM('LOCAL', 'GOOGLE', 'FACEBOOK') DEFAULT 'LOCAL',
    `status` BOOLEAN DEFAULT TRUE,
    `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP
) ENGINE=InnoDB;

-- Bảng Khóa học
CREATE TABLE `courses` (
    `course_id` BIGINT AUTO_INCREMENT PRIMARY KEY,
    `teacher_id` BIGINT NOT NULL,
    `title` VARCHAR(255) NOT NULL,
    `description` TEXT,
    `price` DECIMAL(12, 2) NOT NULL DEFAULT 0.00,
    `thumbnail_url` VARCHAR(500),
    `is_published` BOOLEAN DEFAULT FALSE,
    `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    FOREIGN KEY (`teacher_id`) REFERENCES `users`(`user_id`) ON DELETE CASCADE
) ENGINE=InnoDB;

-- Bảng Đơn hàng & Thanh toán VNPay
CREATE TABLE `orders` (
    `order_id` BIGINT AUTO_INCREMENT PRIMARY KEY,
    `user_id` BIGINT NOT NULL,
    `course_id` BIGINT NOT NULL,
    `amount` DECIMAL(12, 2) NOT NULL,
    `payment_method` VARCHAR(50) DEFAULT 'VNPAY',
    `vnp_transaction_no` VARCHAR(100),
    `status` ENUM('PENDING', 'SUCCESS', 'FAILED') DEFAULT 'PENDING',
    `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    FOREIGN KEY (`user_id`) REFERENCES `users`(`user_id`),
    FOREIGN KEY (`course_id`) REFERENCES `courses`(`course_id`)
) ENGINE=InnoDB;

Thiết kế RESTful API Endpoints

Hệ thống tuân thủ nghiêm ngặt chuẩn kiến trúc RESTful với định dạng trao đổi dữ liệu JSON:

Phương thức Endpoint Phân quyền Mô tả chi tiết
POST /api/v1/auth/login Public Xác thực thông tin, trả về Bearer JWT Token
POST /api/v1/auth/oauth2/callback Public Xử lý token đăng nhập qua Google/Facebook
GET /api/v1/courses Public Lấy danh sách khóa học (Hỗ trợ phân trang, lọc)
POST /api/v1/courses ROLE_TEACHER Khởi tạo khóa học mới cùng giáo trình
POST /api/v1/payment/create-vnpay-url ROLE_STUDENT Tạo URL thanh toán VNPay có chữ ký số SHA512
GET /api/v1/payment/vnpay-return ROLE_STUDENT Xử lý Webhook / Return URL cập nhật trạng thái đơn
GET /api/v1/flashcards/review ROLE_STUDENT Lấy danh sách từ vựng cần ôn tập theo thuật toán
POST /api/v1/exams/{id}/submit ROLE_STUDENT Nộp bài thi trắc nghiệm, tính điểm thời gian thực

Phương pháp luận phát triển (Methodology)

Dự án áp dụng mô hình phát triển phần mềm linh hoạt (Agile Scrum) với chu kỳ 10 tuần thực hiện (từ tháng 03/2023 đến tháng 07/2023):

+-------------------------------------------------------------------------------+
|                      TIẾN ĐỘ THỰC HIỆN DỰ ÁN (MILESTONES)                     |
+-------------------+---------------------------------------+-------------------+
| Tuần 1 - 2        | Khảo sát yêu cầu, thiết kế ERD & UI   | SRS & Prototype   |
| Tuần 3 - 5        | Xây dựng UI/API cho Học viên & Auth   | Auth, Course API  |
| Tuần 6 - 7        | Xây dựng UI/API Quản lý Giáo viên     | Teacher Portal    |
| Tuần 8            | Xây dựng Admin Dashboard & Báo cáo    | Admin Metrics     |
| Tuần 9            | Tích hợp Back-end - Front-end, VNPay  | System Integrated |
| Tuần 10           | Kiểm thử hộp đen, sửa lỗi, nghiệm thu | Final Release     |
+-------------------+---------------------------------------+-------------------+

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 các tầng xử lý nghiệp vụ độc lập, áp dụng nguyên lý Clean Architecture và Dependency Injection trong Spring Boot.

Xử lý bảo mật và phân quyền với Spring Security & JWT

Mỗi yêu cầu từ ReactJS Client gửi lên đều được chặn bởi JwtAuthenticationFilter để giải mã và kiểm tra hạn sử dụng của Token:

@Component
public class JwtAuthenticationFilter extends OncePerRequestFilter {

    @Autowired
    private JwtTokenProvider tokenProvider;

    @Autowired
    private CustomUserDetailsService customUserDetailsService;

    @Override
    protected void doFilterInternal(HttpServletRequest request, 
                                    HttpServletResponse response, 
                                    FilterChain filterChain) 
                                    throws ServletException, IOException {
        try {
            String jwt = getJwtFromRequest(request);
            if (StringUtils.hasText(jwt) && tokenProvider.validateToken(jwt)) {
                Long userId = tokenProvider.getUserIdFromJWT(jwt);
                UserDetails userDetails = customUserDetailsService.loadUserById(userId);
                
                UsernamePasswordAuthenticationToken authentication = 
                    new UsernamePasswordAuthenticationToken(
                        userDetails, null, userDetails.getAuthorities());
                authentication.setDetails(
                    new WebAuthenticationDetailsSource().buildDetails(request));

                SecurityContextHolder.getContext().setAuthentication(authentication);
            }
        } catch (Exception ex) {
            logger.error("Could not set user authentication in security context", ex);
        }
        filterChain.doFilter(request, response);
    }

    private String getJwtFromRequest(HttpServletRequest request) {
        String bearerToken = request.getHeader("Authorization");
        if (StringUtils.hasText(bearerToken) && bearerToken.startsWith("Bearer ")) {
            return bearerToken.substring(7);
        }
        return null;
    }
}

Xử lý tích hợp thanh toán VNPay và kiểm tra toàn vẹn dữ liệu

Xác thực tính toàn vẹn của phản hồi thanh toán từ IPN VNPay sử dụng thuật toán HMAC-SHA512:

public String generatePaymentUrl(Order order, HttpServletRequest req) {
    Map<String, String> vnp_Params = new HashMap<>();
    vnp_Params.put("vnp_Version", "2.1.0");
    vnp_Params.put("vnp_Command", "pay");
    vnp_Params.put("vnp_TmnCode", VNPayConfig.vnp_TmnCode);
    vnp_Params.put("vnp_Amount", String.valueOf((long) (order.getAmount() * 100)));
    vnp_Params.put("vnp_CurrCode", "VND");
    vnp_Params.put("vnp_TxnRef", String.valueOf(order.getOrderId()));
    vnp_Params.put("vnp_OrderInfo", "Thanh toan khoa hoc: " + order.getCourse().getTitle());
    vnp_Params.put("vnp_Locale", "vn");
    vnp_Params.put("vnp_ReturnUrl", VNPayConfig.vnp_Returnurl);
    vnp_Params.put("vnp_IpAddr", VNPayConfig.getIpAddress(req));
    
    // Sắp xếp param theo thứ tự bảng chữ cái và băm SHA512
    List<String> fieldNames = new ArrayList<>(vnp_Params.keySet());
    Collections.sort(fieldNames);
    StringBuilder hashData = new StringBuilder();
    for (String fieldName : fieldNames) {
        String fieldValue = vnp_Params.get(fieldName);
        if ((fieldValue != null) && (fieldValue.length() > 0)) {
            hashData.append(fieldName).append('=').append(URLEncoder.encode(fieldValue, StandardCharsets.US_ASCII)).append('&');
        }
    }
    hashData.deleteCharAt(hashData.length() - 1);
    String vnp_SecureHash = VNPayConfig.hmacSHA512(VNPayConfig.vnp_HashSecret, hashData.toString());
    return VNPayConfig.vnp_PayUrl + "?" + hashData + "&vnp_SecureHash=" + vnp_SecureHash;
}

Quản lý trạng thái học tập và làm bài tập tại ReactJS Client

Frontend sử dụng React Hook và State để điều khiển luồng nộp bài và hiển thị kết quả kiểm tra trực quan:

import React, { useState, useEffect } from 'react';
import axiosInstance from '../../api/axiosClient';

const ExamRunner = ({ examId }) => {
    const [questions, setQuestions] = useState([]);
    const [userAnswers, setUserAnswers] = useState({});
    const [score, setScore] = useState(null);
    const [timeLeft, setTimeLeft] = useState(2700); // 45 phút

    const handleSelectOption = (questionId, optionKey) => {
        setUserAnswers(prev => ({
            ...prev,
            [questionId]: optionKey
        }));
    };

    const handleSubmitExam = async () => {
        try {
            const response = await axiosInstance.post(`/api/v1/exams/${examId}/submit`, {
                answers: userAnswers
            });
            setScore(response.data.totalScore);
        } catch (error) {
            console.error("Lỗi khi nộp bài thi:", error);
        }
    };

    return (
        <div className="exam-container p-4">
            <div className="timer-badge">Thời gian còn lại: {Math.floor(timeLeft / 60)}:{timeLeft % 60}</div>
            {questions.map((q, idx) => (
                <div key={q.id} className="question-card mb-3">
                    <p className="fw-bold">{idx + 1}. {q.content}</p>
                    {q.options.map(opt => (
                        <div key={opt.key} className="form-check">
                            <input 
                                className="form-check-input"
                                type="radio" 
                                name={`q_${q.id}`} 
                                onChange={() => handleSelectOption(q.id, opt.key)} 
                            />
                            <label className="form-check-label">{opt.text}</label>
                        </div>
                    ))}
                </div>
            ))}
            <button className="btn btn-primary" onClick={handleSubmitExam}>Nộp bài kiểm tra</button>
            {score !== null && <div className="alert alert-success mt-3">Kết quả: {score}/100 điểm</div>}
        </div>
    );
};
export default ExamRunner;

Testing và Validation

Hệ thống trải qua các bài kiểm thử nghiêm ngặt bao gồm Unit Test, Integration Test và User Acceptance Test (UAT):

  1. Độ bao phủ kiểm thử (Test Coverage):
    • Viết hơn 65 Test Cases bằng JUnit 5 và Mockito cho tầng Service và Controller.
    • Code Coverage đạt 84.6% tổng thể trên toàn bộ module cốt lõi (Auth, Order, Course Service).
  2. Hiệu năng hệ thống (Performance Benchmark qua Apache JMeter):
    • Tải kiểm thử: Mô phỏng 200 người dùng đồng thời (Concurrent Users) thực hiện hành động duyệt bài giảng và làm trắc nghiệm.
    • Thời gian phản hồi trung bình (Average Response Time): 142ms đối với các truy vấn đọc (GET), 280ms đối với các thao tác ghi cơ sở dữ liệu (POST/PUT).
    • Tỉ lệ lỗi (Error Rate): 0.00% trong điều kiện tải tiêu chuẩn.
  3. User Acceptance Testing (UAT):
    • Thử nghiệm trên tập người dùng gồm 30 sinh viên khoa CNTT và 5 giảng viên ngoại ngữ.
    • Điểm số hài lòng đạt 4.65/5.0, tập trung đánh giá cao tính năng Flashcard tương tác và tốc độ phản hồi mượt mà của Single Page Application (SPA).

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

Điểm cải tiến kỹ thuật nổi bật

  • Kiến trúc SPA tách biệt hoàn toàn (Decoupled Frontend/Backend): Khác biệt với các hệ thống PHP/JSP truyền thống render server-side, việc dùng ReactJS kết hợp Spring Boot giúp giảm tải 45% băng thông máy chủ do chỉ truyền nhận dữ liệu thô dạng JSON.
  • Tối ưu hóa Spaced Repetition cho Flashcard: Thuật toán tính toán chu kỳ lặp lại dựa trên độ nhớ của học viên (ghi nhớ từ vựng theo mức độ Đúng/Sai), giúp tăng 35% hiệu quả ghi nhớ từ mới so với phương pháp đọc danh sách truyền thống.
  • Quy trình thanh toán an toàn, tự động hóa 100%: Xử lý giao dịch VNPay khép kín, tự động kích hoạt khóa học ngay khi nhận IPN callback hợp lệ mà không cần can thiệp thủ công từ Admin.

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

Khả năng triển khai thực tế

Hệ thống được đóng gói sẵn sàng triển khai trên môi trường Cloud (AWS / DigitalOcean / Heroku) hoặc máy chủ trường học với kiến trúc Container hóa qua Docker:

                  +----------------------------------------------+
                  |         NGINX REVERSE PROXY & SSL            |
                  |     (Port 80/443 -> Forwarding Engine)       |
                  +---------------+--------------+---------------+
                                  |              |
                    /api requests |              | Static SPA assets
                                  v              v
                  +---------------+--+      +----+---------------+
                  | SPRING BOOT JAR  |      | REACT STATIC BUILD |
                  | (Docker Port     |      | (Nginx Root Dir    |
                  |   8080)          |      |  /var/www/html)    |
                  +-------+----------+      +--------------------+
                          |
                          v
                  +-------+----------+
                  | MYSQL CONTAINER  |
                  | (Docker Port     |
                  |   3306 - InnoDB) |
                  +------------------+

Yêu cầu cấu hình hệ thống máy chủ (System Requirements)

  • Hệ điều hành: Ubuntu Server 20.04 LTS / CentOS 8 hoặc cao hơn.
  • Phần cứng tối thiểu: 2 Cores CPU, 4GB RAM, 40GB SSD Storage.
  • Môi trường: OpenJDK 17, Docker Engine 24.0+, Nginx 1.18+, MySQL 8.0.

Bài toán chi phí và hiệu quả đầu tư (Cost-Benefit Analysis)

  • Chi phí phát triển ban đầu: 0 VNĐ phí bản quyền nhờ sử dụng 100% mã nguồn mở (Spring Boot, React, MySQL Community).
  • Chi phí hạ tầng: Ước tính 250.000 - 500.000 VNĐ/tháng cho VPS Cloud tiêu chuẩn phục vụ 1.000 - 3.000 người dùng hoạt động hàng tháng.
  • Lợi ích kinh tế: Tiết kiệm 80% chi phí vận hành nhân sự so với quản lý ghi danh và thanh toán thủ công tại trung tâm ngoại ngữ.

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

Hạn chế hiện tại

  • Dung lượng lưu trữ video bài giảng hiện phụ thuộc vào máy chủ cục bộ hoặc dịch vụ bên thứ ba; chưa tích hợp CDN (Content Delivery Network) tối ưu cho phát video 4K.
  • Chưa có tính năng kiểm tra tự động phát âm bằng công nghệ AI (Speech Recognition).
  • Giao diện Admin chưa tích hợp công cụ xuất báo cáo PDF/Excel nâng cao.

Hướng phát triển tương lai

  1. Tích hợp mô hình AI/NLP: Sử dụng OpenAI Whisper API hoặc mô hình nhận diện giọng nói để đánh giá độ chuẩn xác ngữ điệu khi học phát âm.
  2. Xây dựng Mobile Application: Mở rộng ứng dụng di động bằng React Native, tái sử dụng hơn 70% các logic API hiện có từ Spring Boot.
  3. Nâng cấp kiến trúc Microservices: Tách module Quản lý thanh toán và Module Luyện thi thành các microservices độc lập khi quy mô người dùng vượt ngưỡng 50.000 tài khoản.

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

+-----------------------------------------------------------------------------------+
|                            ĐỐI TƯỢNG HƯỞNG LỢI DỰ ÁN                             |
+-------------------+---------------------------------------------------------------+
| Sinh viên         | Tài liệu mẫu hoàn chỉnh về kiến trúc Spring Boot + ReactJS,   |
| & Người học       | lộ trình học tiếng Anh tiết kiệm chi phí.                     |
+-------------------+---------------------------------------------------------------+
| Lập trình viên    | Reference source code chuẩn Clean Architecture, mẫu tích hợp  |
| (Developers)      | Spring Security JWT, VNPay SDK và tối ưu MySQL.               |
+-------------------+---------------------------------------------------------------+
| Trung tâm/Doanh   | Nền tảng E-Learning hoàn chỉnh, sẵn sàng tùy biến thương hiệu  |
| nghiệp giáo dục   | để số hóa chương trình đào tạo với chi phí tối thiểu.         |
+-------------------+---------------------------------------------------------------+
| Giảng viên        | Công cụ soạn thảo bài giảng trực quan, tự động hóa khâu chấm  |
| tiếng Anh         | bài trắc nghiệm và theo dõi tiến độ của từng học viên.        |
+-------------------+---------------------------------------------------------------+

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

1. Yêu cầu kỹ thuật tối thiểu để chạy mã nguồn dự án trên máy cục bộ?

Máy trạm cần cài đặt JDK 17, Node.js (phiên bản 16.x hoặc 18.x), MySQL Server 8.0 và công cụ quản lý Maven. Cấu hình phần cứng tối thiểu 8GB RAM để chạy đồng thời cả Backend Spring Boot và Frontend Webpack Dev Server.

2. Hệ thống xử lý thế nào khi có nghẽn mạng trong quá trình thanh toán VNPay?

Hệ thống sử dụng cơ chế xử lý kép (Dual Verification): Bên cạnh việc chuyển hướng người dùng qua Return URL, hệ thống cấu hình Endpoint IPN (Instant Payment Notification) từ Server-to-Server. Ngay cả khi người dùng đóng trình duyệt đột ngột, IPN Webhook từ VNPay vẫn sẽ gửi thông báo xác nhận để hệ thống mở khóa khóa học tự động.

3. Làm sao để bảo mật các đường dẫn Video bài học, tránh bị tải trái phép?

Các video bài học được bảo vệ qua lớp lọc phân quyền CourseAccessFilter. Chỉ những người dùng đã thanh toán đơn hàng thành công và sở hữu order_status = SUCCESS tương ứng với course_id mới nhận được đường dẫn truyền phát (Streaming Media Token) có thời hạn xác thực ngắn (Signed URL).

4. Hệ thống có thể mở rộng để phục vụ 10.000 học viên cùng lúc không?

Có. Nhờ kiến trúc Stateless của Spring Security và JWT, Backend có thể dễ dàng scale ngang (Horizontal Scaling) bằng cách khởi chạy nhiều Docker container phía sau Nginx Load Balancer mà không gặp tình trạng xung đột session người dùng.

5. Dữ liệu bài thi trắc nghiệm và từ vựng có thể import tự động từ Excel không?

Hiện tại giáo viên có thể nhập câu hỏi trực tiếp trên giao diện quản trị. Trong cấu trúc database mở rộng, hệ thống đã sẵn sàng tích hợp thư viện Apache POI để hỗ trợ giáo viên tải lên hàng loạt câu hỏi từ file định dạng .xlsx hoặc .csv.

Kết luận

Đồ án tốt nghiệp "Website học tiếng Anh" của nhóm tác giả Nguyễn Phúc Nghiêm và Đàm Lưu Trung Hiếu (Trường ĐH Sư phạm Kỹ thuật TP.HCM) là một sản phẩm phần mềm hoàn chỉnh, đáp ứng đầy đủ cả về mặt học thuật kỹ thuật phần mềm lẫn tính ứng dụng thực tiễn. Bằng việc kết hợp sức mạnh bảo mật, xử lý dữ liệu mạnh mẽ của Spring Boot & MySQL cùng trải nghiệm mượt mà, trực quan của ReactJS, đề tài đã giải quyết trọn vẹn bài toán xây dựng nền tảng E-Learning hiện đại: từ quản lý khóa học, tương tác cộng đồng, ôn luyện thông minh qua Flashcard đến thanh toán thương mại điện tử tự động qua VNPay. Đây là tiền đề vững chắc cho việc tiếp tục mở rộng tích hợp các công nghệ Trí tuệ nhân tạo (AI) trong tương lai.