Giới thiệu dự án

Trong kỷ nguyên chuyển đổi số và Cách mạng Công nghiệp 4.0, tri thức đóng vai trò then chốt quyết định năng lực phát triển của thế hệ trẻ. Báo cáo Vietnam Digital Report 2024 từ DataReportal cho thấy Việt Nam hiện có hơn 78.4 triệu người dùng Internet (chiếm 79.1% dân số), với thời gian trực tuyến trung bình hàng ngày vượt 6 giờ 18 phút. Mặc dù thời lượng tiếp cận không gian số rất lớn, người dùng đang phải đối mặt với tình trạng "ô nhiễm thông tin", vấn nạn tin giả (fake news), nội dung rác và thuật toán câu tương tác (clickbait) trên các nền tảng mạng xã hội giải trí.

Thực trạng này đặt ra yêu cầu cấp thiết về một không gian số chuyên biệt, nơi tri thức học thuật, công nghệ và đời sống được chọn lọc, thảo luận văn minh và lan tỏa có hệ thống. Đề tài "Xây dựng website mạng xã hội sử dụng MERN Stack" (thực hiện tại Khoa Công nghệ Thông tin – Trường Đại học Sư phạm Kỹ thuật TP.HCM) được nghiên cứu nhằm giải quyết trực tiếp bài toán xây dựng nền tảng mạng xã hội tri thức hiệu năng cao, tích hợp cơ chế kiểm duyệt đa tầng và giao tiếp thời gian thực.

Mục tiêu đề tài

  1. Thiết kế kiến trúc hệ thống mạng xã hội hoàn chỉnh: Xây dựng mô hình Client-Server hiện đại, phân tách rõ ràng tầng hiển thị (Presentation Layer) và tầng xử lý nghiệp vụ (Business Logic Layer).
  2. Hiện thực hóa bộ tính năng tương tác đa chiều: Hỗ trợ đầy đủ vòng đời bài viết (tạo bản thảo, xuất bản, gắn thẻ tags, bình luận phân cấp, đánh dấu yêu thích), hệ thống quản lý nhóm (Groups), và liên kết chia sẻ đa nền tảng (Facebook Open Graph).
  3. Phát triển module giao tiếp thời gian thực (Real-time Communication): Tích hợp hạ tầng nhắn tin tức thời hai chiều, kiểm duyệt tin nhắn chờ và thông báo sự kiện theo thời gian thực với độ trễ thấp.
  4. Xây dựng hệ thống phân quyền đa cấp bậc (Multi-tier RBAC): Thiết lập cơ chế kiểm soát truy cập dựa trên vai trò cho 3 nhóm đối tượng: Người dùng (User), Biên tập viên (Editor), và Quản trị viên (Admin).
  5. Tự động hóa kiểm duyệt nội dung (Automated Moderation System): Thiết lập tác vụ lập lịch (cron job) chạy ngầm tự động quét và xử lý nội dung vi phạm tiêu chuẩn cộng đồng.
  6. Tối ưu hóa hiệu năng và khả năng mở rộng: Đảm bảo thời gian phản hồi máy chủ (TTFB) dưới 200ms và chịu tải đồng thời tối thiểu 500 CCU (Concurrent Users).

Phương pháp tiếp cận và phạm vi

Dự án áp dụng ngăn xếp công nghệ MERN Stack (MongoDB, ExpressJS, ReactJS, NodeJS) kết hợp cùng TypeScript nhằm tận dụng tối đa mô hình xử lý bất đồng bộ (Non-blocking I/O) và kiến trúc Virtual DOM tối ưu hóa render.

  • Phạm vi hệ thống: Xây dựng ứng dụng web đơn trang (Single Page Application - SPA) hỗ trợ Responsive Design đa thiết bị, triển khai hệ thống RESTful API kết hợp WebSocket Server.
  • Giới hạn: Tập trung vào tương tác dạng văn bản, hình ảnh và âm thanh/podcast nhúng; chưa hỗ trợ xử lý luồng video trực tiếp (Live Streaming) và các thuật toán học máy phức tạp (Deep Learning Recommendation).

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

Phân tích hiện trạng và khảo sát thực tế

Khảo sát các nền tảng nội dung hiện hữu như Spiderum, Medium và Facebook Groups giúp xác định khoảng trống công nghệ và trải nghiệm người dùng:

Tiêu chí so sánh Spiderum Facebook Groups Medium Giải pháp MERN Đề xuất
Định hướng nội dung Blog cá nhân, quan điểm Đa chủ đề, tương tác ngắn Học thuật, chuyên môn sâu Mạng xã hội chia sẻ tri thức
Cơ chế kiểm duyệt Thủ công qua BTV AI lọc từ khóa + Báo cáo Báo cáo cộng đồng Đa tầng: Tự động (Cron) + Ticket BTV
Phân quyền người dùng Cơ bản (User/Admin) Admin / Mod / Member Member / Publication Admin RBAC 3 cấp (User / Editor / Admin)
Nhắn tin thời gian thực Hạn chế, chỉ text đơn giản Tích hợp Messenger Không hỗ trợ Socket.io hỗ trợ media & tin nhắn chờ
Tốc độ tải & Trải nghiệm SPA Đa trang (MPA) / Hydration Tải nặng, nhiều tài nguyên Tối ưu hóa đọc SPA thuần React + TypeScript tối ưu

Yêu cầu hệ thống theo mô hình MoSCoW

  • Must-Have (Bắt buộc): Đăng ký/đăng nhập xác thực OTP qua Email; tạo bài viết Rich-text; tương tác Like/Bookmark/Share; hệ thống Ticket báo cáo vi phạm; phân quyền RBAC; chat 1-1 thời gian thực.
  • Should-Have (Nên có): Bộ lọc tự động định kỳ vào 23:59:59 hàng ngày; quản lý nhóm và phê duyệt thành viên; bảng điều khiển thống kê (Dashboard Analytics) cho Admin/Editor.
  • Could-Have (Có thể có): Tích hợp Chatbot trợ lý hỗ trợ điều hướng và tìm kiếm nội dung; gợi ý bài viết liên quan theo Tag taxonomy.
  • Won't-Have (Chưa thực hiện ở giai đoạn này): Tính năng gọi thoại/video qua WebRTC; hệ thống thanh toán và trả phí bài viết (Paywall/Monetization).

Thiết kế hệ thống

Hệ thống được thiết kế theo mô hình kiến trúc phân lớp Controller-Service-Repository, tách biệt hoàn toàn giữa Backend API và Frontend SPA:

+-----------------------------------------------------------------------+
|                       CLIENT LAYER (React 18 + TS)                    |
|   [Redux Toolkit State] <---> [Axios Interceptor] <---> [Socket Client]|
+-----------------------------------------------------------------------+
                                   | HTTP/REST & WSS
                                   v
+-----------------------------------------------------------------------+
|                    GATEWAY & MIDDLEWARE (Express 4)                   |
|   [CORS / Helmet] ---> [Rate Limiter] ---> [JWT & RBAC Auth Guards]   |
+-----------------------------------------------------------------------+
                                   |
                                   v
+-----------------------------------------------------------------------+
|                      APPLICATION SERVICES (Node.js)                   |
|  [User Service]   [Post Service]   [Chat Engine]   [Cron Moderation]  |
+-----------------------------------------------------------------------+
                                   |
                                   v
+-----------------------------------------------------------------------+
|                       DATABASE LAYER (MongoDB 7)                      |
|      Users  |  Posts  |  Comments  |  Groups  |  Messages  |  Reports |
+-----------------------------------------------------------------------+

Technology Stack & Phiên bản sử dụng

  • Frontend: React v18.2.0, TypeScript v5.2.2, Redux Toolkit v2.0.1, TailwindCSS v3.4.1, Lucide Icons, Socket.io-client v4.7.4.
  • Backend: Node.js v20.11.0 LTS, ExpressJS v4.19.2, Mongoose v8.2.1, Socket.io v4.7.4, Node-cron v3.0.3.
  • Cơ sở dữ liệu: MongoDB v7.0 (NoSQL Document Store).
  • Bảo mật & Tiện ích: JSON Web Token (JWT) v9.0.2, Bcrypt.js v2.4.3, Nodemailer v6.9.10 (SMTP OTP).

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

Hệ thống tối ưu hóa lược đồ MongoDB với việc đánh chỉ mục (Indexing) trên các trường truy vấn thường xuyên:

  • User: _id, username (Indexed, Unique), email (Indexed, Unique), password_hash, role ('user' | 'editor' | 'admin'), is_verified (Boolean), is_locked (Boolean), avatar_url, created_at.
  • Post: _id, author_id (Ref: User, Indexed), title, slug (Indexed), content, tags (Array of Strings, Indexed), status ('draft' | 'published' | 'hidden'), views_count, likes (Array of Ref: User), created_at.
  • ReportTicket: _id, reporter_id (Ref: User), target_type ('post' | 'comment' | 'user' | 'tag'), target_id (ObjectId, Indexed), reason, status ('pending' | 'resolved' | 'dismissed'), resolved_by (Ref: User).
  • Message: _id, conversation_id (Indexed), sender_id (Ref: User), recipient_id (Ref: User), content, attachments, is_read (Boolean), created_at.

Thiết kế API Endpoints chuẩn RESTful

Phương thức Endpoint Chức năng Phân quyền
POST /api/v1/auth/register Đăng ký tài khoản và gửi mã OTP qua Email Public
POST /api/v1/auth/verify-otp Xác thực tài khoản với mã OTP 6 số Public
POST /api/v1/auth/login Đăng nhập hệ thống & cấp Access/Refresh Token Public
GET / POST /api/v1/posts Lấy danh sách bài viết / Tạo bài viết mới Public / User
GET / PUT /api/v1/posts/:slug Xem chi tiết bài viết / Cập nhật nội dung Public / Author
POST /api/v1/reports Tạo báo cáo vi phạm nội dung hoặc người dùng User
GET / PUT /api/v1/editor/reports Xem danh sách ticket báo cáo / Phê duyệt xử lý Editor, Admin
PUT /api/v1/admin/users/:id/lock Khóa tài khoản vi phạm chính sách Admin
GET /api/v1/admin/analytics Thống kê số liệu tương tác toàn hệ thống Admin

Phương pháp quản lý và quy trình thực hiện

Dự án được tổ chức theo quy trình Agile/Scrum rút gọn trong 19 mốc công việc (Milestones), kéo dài từ 04/03/2024 đến 15/06/2024. Nhóm sử dụng Atlassian Jira để quản lý Backlog, theo dõi User Stories, quản lý lỗi (Bug Tracking) và phân công nhiệm vụ chi tiết:

[Khảo sát & Lập đề cương] -> [Thiết kế DB & API Specs] -> [Xây dựng Core Service] 
       -> [Tích hợp Frontend UI] -> [Kiểm thử Tích hợp & Tối ưu] -> [Nghiệm thu Đồ án]

Implementation và kết quả

Chi tiết phát triển mã nguồn

Hệ thống được phát triển tuân thủ nghiêm ngặt chuẩn Coding Conventions, sử dụng TypeScript strict-mode trên Client và kiến trúc Module hóa trên Server.

1. Xử lý Xác thực và Phân quyền JWT (Backend Middleware)

import { Request, Response, NextFunction } from 'express';
import jwt from 'jsonwebtoken';

interface AuthRequest extends Request {
  user?: { id: string; role: 'user' | 'editor' | 'admin' };
}

export const authenticateRole = (allowedRoles: string[]) => {
  return (req: AuthRequest, res: Response, next: NextFunction): void => {
    const authHeader = req.headers.authorization;
    if (!authHeader?.startsWith('Bearer ')) {
      res.status(401).json({ success: false, message: 'Authentication token missing.' });
      return;
    }

    const token = authHeader.split(' ')[1];
    try {
      const decoded = jwt.verify(token, process.env.JWT_SECRET as string) as { id: string; role: string };
      if (!allowedRoles.includes(decoded.role)) {
        res.status(403).json({ success: false, message: 'Forbidden: Insufficient privileges.' });
        return;
      }
      req.user = decoded as any;
      next();
    } catch (error) {
      res.status(401).json({ success: false, message: 'Invalid or expired token.' });
    }
  };
};

2. Tác vụ Lập lịch Tự động Kiểm duyệt Vi phạm (Scheduled Auto-moderation Engine)

Cơ chế chạy ngầm hàng ngày vào lúc 23:59:59 sử dụng node-cron để quét bài viết có lượng báo cáo vượt ngưỡng (threshold >= 5) và ẩn bài viết tạm thời trước khi BTV xem xét:

import cron from 'node-cron';
import { PostModel } from '../models/Post.model';
import { ReportModel } from '../models/Report.model';

// Lập lịch chạy tác vụ tự động vào 23:59:59 hàng ngày
export const initScheduledModerationTask = () => {
  cron.schedule('59 59 23 * * *', async () => {
    console.log('[CRON] Khởi chạy tác vụ kiểm duyệt nội dung tự động...');
    try {
      const pendingReports = await ReportModel.aggregate([
        { $match: { target_type: 'post', status: 'pending' } },
        { $group: { _id: '$target_id', reportCount: { $sum: 1 } } },
        { $match: { reportCount: { $gte: 5 } } }
      ]);

      for (const item of pendingReports) {
        await PostModel.findByIdAndUpdate(item._id, {
          status: 'hidden',
          moderation_note: 'Tạm khóa tự động do vượt quá 5 lượt báo cáo vi phạm'
        });
      }
      console.log(`[CRON] Hoàn tất xử lý: Tự động ẩn ${pendingReports.length} bài viết vi phạm.`);
    } catch (error) {
      console.error('[CRON ERROR] Lỗi trong quá trình kiểm duyệt:', error);
    }
  });
};

3. Xử lý Giao tiếp Thời gian thực (Socket.io Real-time Engine)

import { Server, Socket } from 'socket.io';

export const registerChatSocketHandlers = (io: Server) => {
  io.on('connection', (socket: Socket) => {
    const userId = socket.handshake.query.userId as string;
    if (userId) socket.join(`user_${userId}`);

    socket.on('send_message', async (data: { recipientId: string; message: string; conversationId: string }) => {
      // Broadcast tin nhắn trực tiếp đến room của người nhận
      io.to(`user_${data.recipientId}`).emit('receive_message', {
        senderId: userId,
        content: data.message,
        conversationId: data.conversationId,
        createdAt: new Date().toISOString()
      });
    });

    socket.on('disconnect', () => {
      if (userId) socket.leave(`user_${userId}`);
    });
  });
};

Kiểm thử và Đánh giá chất lượng (Testing & Validation)

Quy trình QA được tiến hành toàn diện qua 3 cấp độ:

  1. Unit Testing & Integration Testing: Sử dụng JestSupertest để kiểm thử 102 ca kiểm thử (test cases) trên toàn bộ Controller và Service. Tỷ lệ bao phủ mã nguồn (Code Coverage) đạt 84.5%.
  2. Hiệu năng chịu tải (Performance Benchmarks): Kiểm thử thông qua công cụ Apache JMeter giả lập 500 người dùng đồng thời (500 CCU) liên tục gửi request trong 10 phút:
    • Thời gian phản hồi trung bình (Average Response Time): 142ms.
    • Thời gian phản hồi Percentile 95 (P95): 188ms.
    • Tỷ lệ lỗi (Error Rate): 0.18%.
    • Throughput hệ thống: 1,250 requests/second.
  3. Quản trị Lỗi qua Jira: Ghi nhận tổng cộng 34 Bugs/Issues trong giai đoạn phát triển; 100% các lỗi nghiêm trọng (Critical/Blocker) liên quan đến rò rỉ token và đồng bộ Socket đã được khắc phục hoàn toàn trước khi nghiệm thu.

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

  • Về tính năng: Hoàn thành 100% các nhóm chức năng đặt ra trong đề cương: Xác thực OTP, tương tác bài viết, tương tác nhóm, chat thời gian thực, ticket report, và trang quản trị Admin Dashboard.
  • Đánh giá người dùng (UAT): Thử nghiệm với 45 người dùng sinh viên tại trường, kết quả khảo sát đạt chỉ số hài lòng (CSAT) 4.6 / 5.0 điểm, đánh giá cao về giao diện trực quan và tính năng nhắn tin tức thời mượt mà.

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

  1. Cơ chế Kiểm duyệt Tự động kết hợp Bán tự động (Hybrid Moderation): Khác biệt hoàn toàn với mô hình duyệt thủ công 100% của các diễn đàn truyền thống, đồ án kết hợp giữa bộ quét tự động theo lịch (Cron Job lúc 23:59:59) và hệ thống phân luồng Ticket cho Biên tập viên (Editor), giúp giảm 65% thời gian xử lý nội dung độc hại.
  2. Kiến trúc Dữ liệu Phản ứng nhanh trên MERN: Tận dụng triệt để cơ chế Non-blocking Event-driven I/O của Node.js kết hợp cùng Mongoose Query Caching, giúp hệ thống duy trì độ trễ dưới 50ms cho các tác vụ truyền thông tin qua WebSocket.
  3. Phân quyền RBAC 3 cấp độ chuyên biệt: Phân định rõ ràng trách nhiệm giữa Quản trị viên (quản lý hạ tầng, tài khoản, tags), Biên tập viên (chuyên trách nội dung, báo cáo), và Người dùng (sáng tạo, tương tác), hạn chế tối đa rủi ro lạm quyền trong vận hành mạng xã hội.

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

Khả năng ứng dụng thực tiễn

  • Môi trường Giáo dục & Đại học: Triển khai làm mạng xã hội nội bộ cho các trường Đại học/Cao đẳng, giúp sinh viên trao đổi tài liệu học thuật, nghiên cứu khoa học và kết nối câu lạc bộ/nhóm đồ án.
  • Doanh nghiệp & Tổ chức nghiên cứu: Ứng dụng làm cổng thông tin tri thức nội bộ (Knowledge Base Portal) với chi phí bản quyền 0 đồng nhờ sử dụng 100% nền tảng mã nguồn mở.

Chiến lược Triển khai và Mở rộng (Deployment & Scalability)

  • Containerization: Đóng gói ứng dụng thành các Docker Containers riêng biệt (frontend-app, backend-api, cron-worker).
  • Reverse Proxy & SSL: Sử dụng Nginx làm Reverse Proxy xử lý cân bằng tải (Load Balancing) và mã hóa kết nối HTTPS/WSS với Let's Encrypt.
  • Cơ sở dữ liệu đám mây: Kết nối MongoDB Atlas Replica Sets (1 Primary, 2 Secondaries) đảm bảo tính sẵn sàng cao (High Availability 99.9%).
  • Hiệu quả đầu tư (Cost-Benefit & ROI): Việc loại bỏ chi phí bản quyền cơ sở dữ liệu thương mại (như Oracle/SQL Server) và tối ưu hóa tài nguyên phần cứng giúp giảm thiểu tới 45% chi phí vận hành máy chủ hàng tháng so với kiến trúc phần mềm doanh nghiệp truyền thống.

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

Hạn chế kỹ thuật

  • Chưa tích hợp cơ sở dữ liệu Vector (như Pinecone/Milvus) để hỗ trợ tìm kiếm ngữ nghĩa (Semantic Search) và thuật toán gợi ý bài viết cá nhân hóa bằng AI.
  • Hệ thống nhắn tin chưa hỗ trợ mã hóa đầu cuối (End-to-End Encryption - E2EE) và chưa hỗ trợ gọi thoại/video trực tiếp qua giao thức WebRTC.

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

  1. Chuyển dịch sang kiến trúc Microservices: Phân tách Chat EnginePost Service thành các dịch vụ độc lập giao tiếp qua Apache Kafka để chịu tải hàng triệu người dùng.
  2. Tích hợp Trí tuệ nhân tạo (Generative AI): Ứng dụng mô hình ngôn ngữ lớn (LLM) để tự động tóm tắt nội dung bài viết dài và lọc ảnh vi phạm bằng Computer Vision.
  3. Mở rộng đa nền tảng: Phát triển ứng dụng di động native bằng React Native, tái sử dụng 70% Business Logic và API hiện có.

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

  • Sinh viên & Học viên: Tiếp cận mã nguồn mẫu hoàn chỉnh về MERN Stack, hiểu sâu cách thiết kế kiến trúc SPA kết hợp WebSocket và quy trình làm việc chuẩn Agile/Jira.
  • Lập trình viên (Developers): Tham khảo kiến trúc phân tầng chuẩn mực, mẫu thiết kế Authentication/RBAC an toàn, và kỹ thuật xử lý bất đồng bộ hiệu quả trong Node.js.
  • Cộng đồng & Tổ chức Giáo dục: Sở hữu giải pháp mạng xã hội học thuật mã nguồn mở, độc lập và dễ dàng tùy biến theo nhu cầu đặc thù của đơn vị.
  • Nhà nghiên cứu: Tài liệu tham khảo thực nghiệm về hiệu năng của ngăn xếp JavaScript toàn diện (Full-JavaScript Stack) trong bài toán xử lý dữ liệu mạng xã hội quy mô vừa.

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

1. Yêu cầu phần cứng và môi trường để triển khai hệ thống là gì?

Hệ thống yêu cầu tối thiểu máy chủ VPS (Ubuntu 22.04 LTS) với cấu hình: 2 vCPU, 4GB RAM, 40GB SSD Storage; môi trường cài đặt sẵn Docker v24+, Node.js v20 LTS, và kết nối Internet ổn định cho dịch vụ gửi mail SMTP.

2. Hệ thống xử lý thế nào khi lượng người dùng đồng thời tăng đột biến?

Nhờ kiến trúc phi trạng thái (Stateless Authentication) với JWT, hệ thống dễ dàng mở rộng theo chiều ngang (Horizontal Scaling) bằng cách nâng số lượng phiên bản Backend API chạy sau Nginx Load Balancer, kết hợp dịch chuyển MongoDB sang cụm Sharded Cluster.

3. Làm thế nào để tích hợp hệ thống với các mạng xã hội hiện có?

Hệ thống đã tích hợp sẵn chuẩn Open Graph Protocol (OG Meta Tags) và Facebook SDK API, cho phép chia sẻ bài viết trực tiếp lên dòng thời gian Facebook chỉ với một cú nhấp chuột.

4. Chi phí duy trì và bảo trì hệ thống hàng tháng ước tính bao nhiêu?

Với quy mô thử nghiệm dưới 10.000 người dùng tích cực hàng tháng, tổng chi phí duy trì máy chủ Cloud VPS (DigitalOcean/AWS Lightsail) và tài khoản MongoDB Atlas M10 ước tính dao động từ 30 - 50 USD/tháng.

5. Dữ liệu và hình ảnh người dùng được lưu trữ và bảo mật ra sao?

Mật khẩu người dùng được băm 10 vòng với thuật toán Bcrypt. Hình ảnh tải lên được mã hóa định danh, xác thực loại tệp tin (MIME Type) chặt chẽ và lưu trữ tối ưu trên dịch vụ đám mây (Cloud Storage) nhằm ngăn chặn các lỗ hổng tải tệp độc hại (Arbitrary File Upload).


Kết luận

Đề tài tốt nghiệp "Xây dựng website mạng xã hội sử dụng MERN STACK" của nhóm tác giả Lê Trương Ngọc Hải và Phan Đại Đăng Khoa (HD: ThS. Nguyễn Hữu Trung) tại Trường Đại học Sư phạm Kỹ thuật TP.HCM đã hoàn thành xuất sắc các mục tiêu đề ra. Dự án không chỉ chứng minh tính thực tiễn và sức mạnh vượt trội của ngăn xếp MERN Stack trong việc giải quyết bài toán ứng dụng mạng xã hội thời gian thực, mà còn đem lại một giải pháp công nghệ hoàn chỉnh, đóng góp thiết thực cho cộng đồng học thuật và phát triển phần mềm.

Hãy tham khảo và khai thác mã nguồn mở của dự án để phát triển các nền tảng số hóa tri thức hữu ích hơn nữa cho xã hội!