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

Ngành du lịch được xác định là một ngành kinh tế quan trọng, thường được định danh là "ngành công nghiệp không khói" với tầm ảnh hưởng mang tính toàn cầu. Theo số liệu công bố từ Hội đồng Lữ hành và Du lịch Quốc tế (World Travel and Tourism Council – WTTC), du lịch đã vươn lên trở thành một trong những ngành kinh tế lớn nhất thế giới, vượt qua các ngành sản xuất ô tô, điện tử và nông nghiệp, đồng thời là nguồn thu ngoại tệ chủ lực trong cán cân thương mại của nhiều quốc gia. Tại Việt Nam, du lịch đang được định hướng phát triển thành ngành kinh tế mũi nhọn, tạo lực đẩy hỗ trợ các lĩnh vực giao thông vận tải, hàng không và dịch vụ lưu trú. Về mặt cấu trúc, hoạt động du lịch bao gồm hai mảng cốt lõi: kinh doanh lưu trú (dịch vụ buồng phòng, ăn uống, giải trí) và kinh doanh lữ hành (thiết kế chương trình tour, điều hành và hướng dẫn du lịch).

Xuất phát từ bối cảnh thực tiễn đó, nhu cầu thiết lập một nền tảng trực tuyến kết nối trực tiếp giữa đơn vị cung cấp dịch vụ lữ hành và khách hàng tiềm năng là yêu cầu cấp thiết nhằm cắt giảm chi phí trung gian và tối ưu hóa thời gian giao dịch. Khóa luận tốt nghiệp kỹ sư ngành Công nghệ phần mềm của hai sinh viên Hoàng Trọng Tấn và Nguyễn Ngọc Hoàng Vy (Trường Đại học Sư phạm Kỹ thuật TP. Hồ Chí Minh, dưới sự hướng dẫn của TS. Lê Văn Vinh) đã tập trung giải quyết bài toán này thông qua đề tài "Xây dựng website quản lý và kinh doanh dịch vụ lữ hành".

Mục tiêu và nhiệm vụ nghiên cứu được phân định thành các nội dung cụ thể:

  1. Nghiên cứu cơ sở lý thuyết và công nghệ nền tảng: Tìm hiểu nguyên lý hoạt động, cấu hình và tích hợp của ExpressJS, Bootstrap UI v4, Ant Design v3.x và thư viện ReactJS; nghiên cứu lý thuyết nghiệp vụ dịch vụ lữ hành; ngôn ngữ JavaScript (chuẩn ES6, ES7, ES9), Redux và React Router DOM.
  2. Xây dựng máy chủ ứng dụng: Ứng dụng ExpressJS để xây dựng hệ thống RESTful API bảo mật và xử lý tốc độ cao.
  3. Phát triển giao diện người dùng: Ứng dụng ReactJS và Ant Design để thiết kế giao diện ứng dụng đơn trang (Single-Page Application - SPA) có tính tương tác cao và tối ưu trải nghiệm người dùng (UX).
  4. Xây dựng phần mềm hoàn chỉnh: Hoàn thiện cổng thông tin người dùng (cho phép tìm kiếm, đặt tour, thanh toán trực tuyến, đánh giá) và cổng quản trị hệ thống (cho phép quản lý danh mục tour, lịch trình, nội dung blog, thông báo và thống kê báo cáo).
  5. Nâng cao kỹ năng phân tích thiết kế, giải quyết vấn đề kỹ thuật và triển khai ứng dụng thực tế.

Đối tượng và phạm vi nghiên cứu:

  • Đối tượng nghiên cứu: Kiến trúc ứng dụng web hiện đại (Client - Server), ngôn ngữ lập trình JavaScript, hệ quản trị cơ sở dữ liệu quan hệ MySQL, khung làm việc ExpressJS, thư viện ReactJS, hệ thống thiết kế Ant Design UI, các cơ chế giao tiếp Ajax, Token, Session, Cookie, mô hình MVC và các dịch vụ đám mây (AWS, Heroku).
  • Phạm vi không gian và hệ thống: Đề tài tập trung vào việc số hóa quy trình kinh doanh dịch vụ lữ hành cho một chủ thể (doanh nghiệp hoặc đơn vị kinh doanh tour); tiến hành khảo sát thực nghiệm 5 website lữ hành tại Việt Nam bao gồm: Tugo (tugo.vn), Saigontourist (saigontourist.net), iVIVU (ivivu.com), Mytour (mytour.vn) và Travel.com.vn (travel.com.vn).
  • Phạm vi thời gian: Đề tài được thực hiện trong thời gian từ ngày 16/03/2020 đến ngày 30/07/2020.

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

Khóa luận thiết lập nền tảng kỹ thuật dựa trên các công nghệ và mô hình phát triển phần mềm:

  • ExpressJS Framework: Là khung làm việc linh hoạt xây dựng trên môi trường thực thi Node.js, cung cấp hệ thống định tuyến (Routing), cơ chế lớp trung gian (Middleware) để tiếp nhận và phản hồi các yêu cầu HTTP (HTTP request/response), hỗ trợ xây dựng kiến trúc RESTful API hiệu suất cao và có độ bao phủ kiểm thử rộng.
  • Thư viện ReactJS: Thư viện JavaScript hỗ trợ xây dựng giao diện người dùng tương tác dạng Single-Page Application (SPA). Các cơ chế cốt lõi được vận dụng bao gồm: Virtual DOM (tối ưu hóa thao tác cập nhật giao diện bằng cách so sánh DOM ảo với DOM thật), luồng dữ liệu một chiều (One-way data binding từ thành phần cha xuống con thông qua Props), cú pháp mở rộng JSX, kiến trúc hướng thành phần (Component-based), cơ chế Hooks và vòng đời quản lý trạng thái (Lifecycle).
  • Ant Design v3.x và Bootstrap UI v4: Cung cấp bộ quy chuẩn thiết kế và thư viện thành phần giao diện phục vụ tối ưu hóa trải nghiệm người dùng.
  • Hệ quản trị cơ sở dữ liệu MySQL: Thiết kế cơ sở dữ liệu quan hệ lưu trữ thông tin nghiệp vụ du lịch, phân quyền tài khoản và quản lý giao dịch.
  • Mô hình kiến trúc ứng dụng: Mô hình phân lớp tương tự MVC (Model - View - Controller), phân tách rành mạch giữa lớp hiển thị (React Client) và lớp logic dịch vụ (Express Server API).

Phương pháp nghiên cứu thực tế được triển khai qua các bước:

  • Phương pháp phân tích và thiết kế hệ thống thông tin theo hướng đối tượng: Sử dụng hệ thống biểu đồ UML gồm lược đồ ca sử dụng (Use Case Diagram), lược đồ lớp (Class Diagram) và lược đồ tuần tự (Sequence Diagram) để mô hình hóa toàn diện các luồng nghiệp vụ.
  • Phương pháp khảo sát so sánh hiện trạng: Khảo sát đối chuẩn giao diện, tính năng và luồng tương tác thực tế của 5 website du lịch hiện hành tại Việt Nam để tổng hợp yêu cầu kỹ thuật.
  • Phương pháp kiểm thử phần mềm: Xây dựng các ca kiểm thử (Test Cases) kiểm tra tính đúng đắn của giao diện và chức năng hệ thống trước khi triển khai.
  • Nguồn dữ liệu: Dữ liệu nghiệp vụ thực tế về thông tin tour, đơn đặt tour, tài liệu kỹ thuật chuyên ngành từ trang chủ ExpressJS, ReactJS, Ant Design, kết hợp bộ dữ liệu khảo sát từ các nền tảng lữ hành trực tuyến.

Thiết kế và triển khai

Hệ thống được thiết kế theo mô hình tách biệt hoàn toàn giữa Front-end và Back-end:

  • Kiến trúc Back-end: Sử dụng Node.js kết hợp ExpressJS đóng vai trò máy chủ API. Hệ thống xử lý các yêu cầu gửi đến thông qua hệ thống Middleware để xác thực mã truy cập, giải mã dữ liệu yêu cầu, thực thi các truy vấn với cơ sở dữ liệu MySQL và phản hồi dữ liệu định dạng JSON về phía máy khách.
  • Kiến trúc Front-end: Xây dựng dưới dạng ứng dụng đơn trang (SPA) bằng ReactJS. Quản lý trạng thái tập trung được hỗ trợ bởi thư viện Redux (phân chia Actions, Reducers, Store); cơ chế điều hướng URL nội bộ xử lý bởi React Router DOM; giao diện hiển thị được chuẩn hóa qua các thành phần của Ant Design.

Cơ sở dữ liệu của hệ thống được chuẩn hóa trên MySQL, phân rã thành các bảng lưu trữ thuộc tính chi tiết: bảng người dùng và phân quyền quản trị, bảng thông tin tour, bảng lịch trình chi tiết, bảng timeline các ngày đi, bảng hóa đơn và trạng thái thanh toán, bảng đánh giá nhận xét, bảng thẻ dịch vụ đi kèm, bảng danh mục bài viết blog du lịch và bảng thông báo hệ thống.

Tích hợp dịch vụ bên thứ ba và hạ tầng triển khai:

  • Tích hợp cổng thanh toán trực tuyến: Kết nối API cổng thanh toán điện tử Ngân Lượng (nganluong.vn) và dịch vụ ví MoMo để xử lý các giao dịch đặt tour tự động.
  • Tích hợp tiện ích giao tiếp: Nhúng plugin Facebook Messenger phục vụ việc trao đổi thông tin trực tiếp giữa khách hàng và bộ phận hỗ trợ.
  • Hạ tầng triển khai (Deployment): Back-end Node.js và Front-end React app được đóng gói và triển khai thực tế trên nền tảng điện toán đám mây Amazon Web Services (AWS) kết hợp dịch vụ Heroku Add-ons quản lý cơ sở dữ liệu; quản lý tên miền và cấu hình máy chủ DNS thông qua Hostinger và AWS Route53; chứng chỉ bảo mật mã hóa SSL được cấu hình cho tên miền hệ thống (ithoangtan); kiểm thử kết nối và dữ liệu đầu ra của các điểm cuối API thông qua công cụ Postman.

Chiến lược kiểm thử phần mềm được xây dựng bài bản với 18 bảng kịch bản kiểm thử, phân chia đều giữa kiểm thử giao diện và kiểm thử chức năng cho 9 phân hệ trọng yếu: Trang chủ, Trang danh mục tour, Trang chi tiết tour, Trang đặt tour, Trang đăng ký, Trang đăng nhập người dùng, Trang đăng nhập quản trị viên, Trang chủ bảng điều khiển quản trị và Trang cập nhật/chỉnh sửa tour.

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

Phần mở đầu

Phần mở đầu luận giải tính cấp thiết của đề tài dựa trên vai trò mũi nhọn của ngành du lịch trong nền kinh tế toàn cầu và định hướng phát triển du lịch tại Việt Nam. Tác giả xác định rõ sự cần thiết của việc xây dựng kênh bán hàng trực tuyến nhằm tối ưu hóa kết nối giữa doanh nghiệp lữ hành và khách hàng. Phần này đặt ra các mục tiêu kỹ thuật về việc làm chủ ngăn xếp công nghệ ExpressJS, ReactJS, Ant Design; xác định đối tượng, phạm vi nghiên cứu, phương pháp tiếp cận và kế hoạch thực hiện đồ án từ ngày 16/03/2020 đến ngày 30/07/2020.

Chương 1: Cơ sở lý thuyết

Chương 1 cung cấp tổng quan kỹ thuật chuyên sâu về hai công nghệ chính của hệ thống:

  • Khung làm việc ExpressJS: Phân tích lịch sử hình thành từ ngày 16/11/2010, cơ chế hoạt động của các lớp trung gian xử lý yêu cầu HTTP, hệ thống định tuyến phân tách theo các phương thức GET, POST, PUT, DELETE, cùng các thành phần cốt lõi gồm hàm khởi tạo ứng dụng, đối tượng Request, Response và Router.
  • Thư viện ReactJS: Phân tích lịch sử phát hành từ ngày 29/05/2013 bởi Facebook, cơ chế Virtual DOM giúp tối ưu tốc độ kết xuất dữ liệu, cú pháp JSX, nguyên lý một chiều của luồng dữ liệu, phân biệt giữa Props (bất biến) và State (thay đổi theo tương tác), vòng đời của một thành phần (Lifecycle) và giải pháp Hook trong React 16.8+. Chương này cũng đánh giá khách quan các ưu điểm về hiệu năng hiển thị và nhược điểm khi React chỉ đóng vai trò tầng hiển thị (View), đòi hỏi cấu hình bổ sung khi tích hợp vào kiến trúc MVC truyền thống.

Chương 2: Khảo sát hiện trạng

Chương 2 trình bày khảo sát thực tiễn 5 hệ thống website kinh doanh dịch vụ lữ hành phổ biến tại Việt Nam nhằm đúc rút bài học thiết kế và xác định yêu cầu tính năng:

Website khảo sát Đặc điểm giao diện Chức năng nổi bật Nhược điểm được ghi nhận
Tugo (tugo.vn) Gam màu lạnh (tím chủ đạo), thanh điều hướng ngang, trình chiếu toàn màn hình. Tìm kiếm theo từ khóa đơn giản; hiển thị đầy đủ thông tin chi tiết tour, điều kiện visa. Đặt tour chủ yếu qua tổng đài điện thoại; cỡ chữ nhỏ, bố cục dùng chữ hoa chưa hợp lý; màu sắc trầm; phân trang kéo dài gây khó khăn khi thao tác.
Saigontourist (saigontourist.net) Gam màu tương phản (lam - cam) sinh động, bố cục hài hòa, hình ảnh chất lượng cao. Bộ lọc tìm kiếm có chọn ngày đi - ngày về, lọc theo mức giá và ngày gần nhất; cho phép in chương trình tour; chatbot hỗ trợ; đa ngôn ngữ. Hiệu ứng rê chuột (hover) làm mờ thành phần; xuất hiện pop-up chọn khu vực lặp lại liên tục trên mọi trang gây phiền toái; chưa có đánh giá từ khách hàng cũ.
iVIVU (ivivu.com) Màu sắc tương phản (lam - cam), thông tin kỳ nghỉ chi tiết. Tìm kiếm có gợi ý địa điểm đang thịnh hành; nhúng Facebook Messenger; tích lũy điểm thưởng. Tập trung chủ yếu vào dịch vụ phòng khách sạn hơn là tour du lịch lữ hành; hiệu ứng rê chuột làm che khuất thông tin tour; đặt tour qua tổng đài.
Mytour (mytour.vn) Gam màu trắng và xanh dương, thiết kế rõ ràng, bố cục trải nghiệm người dùng chuẩn mực. Bộ lọc chi tiết theo mức giá, loại tour, dịch vụ; cẩm nang du lịch; đa ngôn ngữ và tiền tệ; gửi phiếu đặt tour. Chưa có tính năng thuyết minh trực tiếp chương trình tour; chưa tích hợp đa dạng cổng thanh toán điện tử trực tiếp; chưa tích hợp mạng xã hội.
Travel.com.vn (Vietravel) Tông màu trắng kết hợp hồng neon, bố cục truyền thống. Tìm kiếm tour giờ chót; sắp xếp theo số ngày, giá và phương tiện vận chuyển; thanh toán trực tuyến; liên kết mạng xã hội. Chất lượng hình ảnh chưa đồng đều; màu sắc và kiểu chữ thiếu hài hòa; tính năng thuyết minh chương trình tour chưa hoàn thiện và chỉ áp dụng cục bộ.

Từ kết quả khảo sát, nhóm tác giả rút ra kết luận cần thiết lập một hệ thống khắc phục triệt để các hạn chế trên, tập trung vào thanh toán trực tuyến tự động, tối ưu bộ lọc tìm kiếm và cải tiến tính tương tác của giao diện.

Chương 3: Xác định yêu cầu

Chương 3 xây dựng mô hình ca sử dụng (Use Case) tổng quát và lập bảng đặc tả nghiệp vụ phân định rõ ràng giữa hai nhóm đối tượng:

  • Nghiệp vụ người dùng (Khách hàng): Thiết lập 22 nghiệp vụ chính được chuẩn hóa theo mã hiệu kỹ thuật, gồm: xem trang chủ (U-XTC), đăng ký tài khoản (U-DK), đăng nhập (U-DN), nhóm quản lý tài khoản từ ca U-XTK đến U-DLMK, nhóm tương tác tour từ ca U-XDMT đến U-DGT (trong đó có tính năng in lịch trình U-ILT, đặt tour U-DT, thanh toán U-TTT, tìm kiếm U-TKT), nhóm quản lý tour yêu thích (U-XDSTYT đến U-TVTYT), nhóm bài viết blog (U-XBDL đến U-STBV), xem thông báo (U-XTB) và gửi yêu cầu tư vấn du lịch (U-YCTV).
  • Nghiệp vụ quản trị viên (Admin): Thiết lập danh mục 26 nghiệp vụ quản trị, bao gồm đăng nhập quản trị (A-DN), xem bảng điều khiển (A-XTC), quản trị vòng đời tour từ thêm, sửa, xóa (A-TT, A-ST, A-XT), cập nhật lịch trình và chính sách tour (A-SLTT), quản lý thẻ và dịch vụ đi kèm (A-TTVDV đến A-XTVDV), quản trị blog, quản lý thông báo, phân hệ thống kê doanh thu (A-TKDT), thống kê điểm đến và cấu hình thông tin doanh nghiệp (A-STTCT).

Chương 4: Thiết kế phần mềm

Chương 4 hoàn thiện thiết kế kiến trúc phần mềm thông qua các lược đồ chuẩn UML:

  • Thiết kế lược đồ lớp (Class Diagram): Xây dựng chi tiết 6 lược đồ lớp chuyên biệt gồm: phân quyền tài khoản, quản lý dữ liệu tour, hóa đơn và thanh toán, quản lý blog tin tức, quản lý thông báo và quản lý thẻ/dịch vụ.
  • Thiết kế lược đồ tuần tự (Sequence Diagram): Xây dựng 16 lược đồ tuần tự phản ánh chính xác chu trình tương tác thời gian thực giữa Khách hàng/Quản trị viên, Giao diện Front-end, Máy chủ Express Back-end và Cơ sở dữ liệu MySQL. Các lược đồ bao quát từ luồng đăng ký (U-DK), xác thực email (U-XTM), đăng nhập, đặt tour (U-DT), thanh toán (U-TTT), đến các luồng quản trị như thêm tour (A-TT), cập nhật lịch trình (A-SLTT) và tổng hợp thống kê doanh thu (A-TKDT).
  • Thiết kế cơ sở dữ liệu: Trình bày chi tiết cấu trúc các bảng quan hệ, định nghĩa kiểu dữ liệu, khóa chính, khóa ngoại và từ điển dữ liệu phản ánh toàn vẹn các ràng buộc nghiệp vụ.

Chương 5: Thiết kế giao diện

Chương 5 cụ thể hóa các yêu cầu thành giao diện đồ họa hoàn chỉnh với 42 biểu mẫu giao diện tương ứng với các bảng mô tả thuộc tính:

  • Giao diện người dùng: Thiết kế các trang chính bao gồm trang chủ đa khối (thanh trình chiếu, công cụ tìm kiếm, danh mục điểm đến thịnh hành, phản hồi khách hàng), thanh điều hướng, chân trang, danh mục tour có bộ lọc, trang chi tiết tour hiển thị chi tiết chính sách và lịch trình, biểu mẫu đánh giá, quy trình đặt tour phân bước (Step 1 đến Step 3), màn hình thanh toán kết nối cổng Ngân Lượng, danh sách đơn hàng đã đặt, các trang blog và liên hệ.
  • Giao diện quản trị: Xây dựng màn hình đăng nhập quản trị tách biệt, giao diện bảng điều khiển (Dashboard) hiển thị trực quan biểu đồ doanh thu và lượng truy cập, màn hình quản lý danh sách tour, khung biểu mẫu dùng chung để thêm/sửa tour, bài viết, thông báo và tài khoản, giao diện chỉnh sửa dòng thời gian (timeline), giao diện xem trước nội dung (preview) và các trang hiển thị mã trạng thái HTTP (403, 404, 500).

Chương 6: Cài đặt và kiểm thử

Chương 6 tài liệu hóa quá trình cài đặt hệ thống trên hạ tầng đám mây và thực nghiệm kiểm thử:

  • Triển khai hệ thống: Hướng dẫn chi tiết quy trình đưa ứng dụng lên AWS, thiết lập cổng thanh toán Ngân Lượng và MoMo, cấu hình chuyển tiếp tên miền với Route53 và Hostinger, quản trị cơ sở dữ liệu MySQL trên Heroku Add-ons và cấu hình chứng chỉ mã hóa đường truyền SSL.
  • Kiểm thử hệ thống: Thực hiện kiểm thử toàn diện thông qua 18 bảng kịch bản kiểm thử (Test Cases) giao diện và chức năng trên 9 màn hình chức năng cốt lõi (Trang chủ, Danh mục tour, Chi tiết tour, Đặt tour, Đăng ký, Đăng nhập người dùng, Đăng nhập admin, Bảng điều khiển admin và Chỉnh sửa tour). Kết quả kiểm thử trên công cụ Postman và môi trường duyệt web thực tế cho thấy các API và giao diện đều phản hồi chính xác theo đúng kịch bản thiết kế.

Phần kết luận

Đánh giá mức độ hoàn thành nhiệm vụ theo đề cương, tổng kết các kết quả đạt được về sản phẩm phần mềm, chỉ rõ các giới hạn còn tồn đọng trong quá trình thử nghiệm và vạch ra các hướng phát triển kỹ thuật trong tương lai.

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

Khóa luận đã hoàn thành các mục tiêu đề ra với những kết quả cụ thể:

  • Xây dựng hoàn chỉnh một ứng dụng website thương mại điện tử chuyên ngành lữ hành, vận hành theo kiến trúc ứng dụng đơn trang (SPA) sử dụng ReactJS và hệ thống máy chủ RESTful API trên nền tảng ExpressJS.
  • Giao diện được thiết kế tương thích linh hoạt trên nhiều loại thiết bị có trình duyệt khác nhau (Responsive Web Design) như máy tính để bàn, máy tính bảng và điện thoại di động thông minh.
  • Triển khai thành công 22 nghiệp vụ phía khách hàng và 26 nghiệp vụ quản trị hệ thống, bao gồm các luồng chức năng hoàn chỉnh: tìm kiếm tour đa tiêu chí, quy trình đặt tour trực tuyến 3 bước, in lịch trình tour, đánh giá chất lượng tour, quản lý tài khoản cá nhân và quản lý danh sách tour yêu thích.
  • Tích hợp thành công cổng thanh toán điện tử Ngân Lượng và MoMo, cho phép giao dịch trực tuyến tự động thay thế cho phương thức đặt tour qua tổng đài truyền thống.
  • Xây dựng phân hệ quản trị trực quan với bảng điều khiển thống kê số liệu doanh thu và lượt khách bằng biểu đồ, quản trị linh hoạt nội dung đa cấp (tour, lịch trình, timeline từng ngày, chính sách, thẻ dịch vụ, tin tức, thông báo cấu hình doanh nghiệp).
  • Ứng dụng đã được triển khai thực tế trên hạ tầng đám mây của AWS, Heroku, định tuyến DNS qua Hostinger/Route53 và được cấp chứng chỉ bảo mật mã hóa giao thức SSL (ithoangtan).
  • Khắc phục các nhược điểm của các website thực tế được khảo sát: loại bỏ pop-up gây phiền hà, tối ưu quy trình đặt tour khép kín và tăng cường tính tương tác thông qua Facebook Messenger nhúng trực tiếp.

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

Hạn chế của đề tài:

  • Hệ thống kiểm thử mới chỉ tập trung vào kiểm thử giao diện và kiểm thử chức năng theo các kịch bản định sẵn trên 9 màn hình cốt lõi, chưa thực hiện kiểm thử hiệu năng chịu tải lớn (stress test, load test) khi có lượng người dùng truy cập đồng thời cao.
  • Việc hỗ trợ thanh toán điện tử mới dừng lại ở các cổng thanh toán nội địa (Ngân Lượng, MoMo), chưa mở rộng kết nối với các cổng thanh toán quốc tế.
  • Tính năng thuyết minh chương trình tour và gợi ý cá nhân hóa cho người dùng vẫn ở mức cơ bản.

Hướng nghiên cứu và phát triển tiếp theo:

  • Tích hợp thêm các phương thức thanh toán trực tuyến quốc tế (như PayPal, Stripe, thẻ tín dụng quốc tế) để hỗ trợ khách du lịch nước ngoài.
  • Ứng dụng kỹ thuật kết xuất phía máy chủ (Server-Side Rendering - SSR) thông qua Next.js hoặc mở rộng bộ định tuyến Express để tối ưu hóa công cụ tìm kiếm (SEO) vượt trội hơn cho ứng dụng React.
  • Nghiên cứu phát triển tính năng tự động thuyết minh chương trình tour bằng giọng nói/video đa phương tiện và tích hợp hệ thống trí tuệ nhân tạo (Chatbot AI) để tự động tư vấn lịch trình theo ngân sách khách hàng.

Giá trị tham khảo

Báo cáo khóa luận là tài liệu tham khảo có giá trị học thuật và thực tiễn cho sinh viên chuyên ngành Công nghệ phần mềm, Kỹ thuật phần mềm và Hệ thống thông tin đang thực hiện đồ án tốt nghiệp hoặc các đề tài liên quan đến phát triển ứng dụng web Full-stack sử dụng hệ sinh thái JavaScript (Node.js/ExpressJS và ReactJS).

Các nội dung có giá trị tham khảo chuyên sâu bao gồm:

  • Tài liệu phân tích và thiết kế hệ thống theo chuẩn UML, đặc biệt là hệ thống 16 lược đồ tuần tự (Sequence Diagram) mô tả chi tiết luồng dữ liệu giữa giao diện SPA, tầng dịch vụ API và cơ sở dữ liệu quan hệ.
  • Bảng đặc tả nghiệp vụ phân cấp chi tiết cho bài toán thương mại điện tử dịch vụ lữ hành (với 22 nghiệp vụ người dùng và 26 nghiệp vụ quản trị viên).
  • Cấu trúc cơ sở dữ liệu quan hệ chuẩn hóa mô hình hóa nghiệp vụ tour du lịch đa ngày, lịch trình chi tiết và phân loại dịch vụ.
  • Quy trình triển khai ứng dụng thực tế trên hạ tầng đám mây AWS, kết nối cơ sở dữ liệu đám mây Heroku và thiết lập chứng chỉ bảo mật SSL.

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

Đề tài sử dụng những công nghệ và thư viện cốt lõi nào để phát triển hệ thống?

Hệ thống sử dụng ngăn xếp công nghệ Full-stack JavaScript: Back-end xây dựng trên nền tảng Node.js kết hợp khung làm việc ExpressJS để cung cấp hệ thống RESTful API; Front-end xây dựng dưới dạng ứng dụng đơn trang (SPA) bằng thư viện ReactJS, kết hợp thư viện quản lý trạng thái Redux, thư viện điều hướng React Router DOM và hệ thống thành phần giao diện Ant Design v3.x cùng Bootstrap UI v4; cơ sở dữ liệu quan hệ sử dụng hệ quản trị MySQL.

Nhóm tác giả đã tiến hành khảo sát và đánh giá những website du lịch thực tế nào?

Nhóm tác giả đã khảo sát chi tiết 5 website lữ hành tại Việt Nam: Tugo (tugo.vn), Saigontourist (saigontourist.net), iVIVU (ivivu.com), Mytour (mytour.vn) và Travel.com.vn (Vietravel). Các khía cạnh đánh giá bao gồm gam màu, bố cục, hiệu ứng, dữ liệu chi tiết tour, chức năng tìm kiếm, cơ chế đặt tour và các nhược điểm tồn tại trong trải nghiệm người dùng.

Các phân hệ nghiệp vụ chính của người dùng và quản trị viên được phân bổ như thế nào?

Phân hệ người dùng được chuẩn hóa thành 22 ca nghiệp vụ (mã hiệu từ U-XTC đến U-YCTV) bao gồm các nhóm: quản lý thông tin tài khoản, tra cứu và in lịch trình tour, đặt tour, thanh toán trực tuyến, đánh giá chất lượng, quản lý danh sách yêu thích, tương tác blog và gửi yêu cầu tư vấn. Phân hệ quản trị viên gồm 26 nghiệp vụ (mã hiệu từ A-DN đến A-STTCT) phục vụ quản lý toàn diện vòng đời tour, dòng thời gian (timeline), chính sách điều khoản, bài viết, thông báo, cấu hình doanh nghiệp và xem thống kê doanh thu theo biểu đồ.

Ứng dụng đã tích hợp giải pháp thanh toán điện tử nào và được triển khai trên hạ tầng nào?

Ứng dụng tích hợp cổng thanh toán trực tuyến Ngân Lượng (nganluong.vn) và cổng thanh toán MoMo để xử lý đơn hàng tự động; nhúng tiện ích Facebook Messenger phục vụ trao đổi trực tuyến. Về hạ tầng, hệ thống được triển khai trên nền tảng điện toán đám mây Amazon Web Services (AWS) cho cả Front-end và Back-end, sử dụng cơ sở dữ liệu MySQL qua Heroku Add-ons, quản trị tên miền qua Hostinger/AWS Route53 và cài đặt chứng chỉ bảo mật SSL mang tên miền ithoangtan.

Chiến lược kiểm thử phần mềm được tiến hành trên những màn hình và chức năng nào?

Chiến lược kiểm thử được thiết lập thông qua 18 bảng kịch bản kiểm thử bao gồm kiểm thử giao diện và kiểm thử chức năng cho 9 phân hệ: Trang chủ, Trang danh mục tour, Trang chi tiết tour, Trang đặt tour, Trang đăng ký tài khoản, Trang đăng nhập người dùng, Trang đăng nhập quản trị viên, Trang chủ bảng điều khiển quản trị và Trang chỉnh sửa tour, kết hợp công cụ Postman để kiểm tra tính toàn vẹn của các điểm cuối API.

Kết luận

Khóa luận tốt nghiệp của hai sinh viên Hoàng Trọng Tấn và Nguyễn Ngọc Hoàng Vy đã hoàn thành trọn vẹn mục tiêu thiết kế và xây dựng một website quản lý và kinh doanh dịch vụ lữ hành hoàn chỉnh. Công trình ứng dụng hiệu quả khung làm việc ExpressJS để xây dựng hệ thống API hiệu suất cao và thư viện ReactJS kết hợp Ant Design để kiến tạo trải nghiệm ứng dụng đơn trang mượt mà cho người dùng. Toàn bộ hệ thống đã được kiểm thử chức năng qua 18 kịch bản chi tiết, tích hợp thanh toán trực tuyến qua Ngân Lượng và triển khai vận hành thực tế trên nền tảng đám mây AWS với chứng chỉ SSL.