Xây dựng ứng dụng tìm kiếm điểm du lịch tại Việt Nam dựa trên MERN Stack

Xây dựng ứng dụng tìm kiếm điểm du lịch tại Việt Nam dựa trên công nghệ MERN stack, mang lại trải nghiệm du lịch tuyệt vời và tiện lợi.

• Tác giả: Nguyen Thi Minh Hoang
• Người hướng dẫn: Ph.D Le Vinh Thinh
• Trường học: Ho Chi Minh City University of Technology and Education
• Chuyên ngành: Information Technology
• Đề tài: Building An Application For Finding Tourist Attraction In Vietnam Based On MERN Stack
• Loại tài liệu: Graduation Thesis
• Năm xuất bản: 2022
• Địa điểm: Ho Chi Minh City

Mục lục chi tiết

• ACKNOWLEDGEMENT
• 1. CHƯƠNG 1: THEORETICAL BASIS
• 1.1. Overview MongoDB
• 1.2. Some main features
• 1.3. Advantages of React
• 1.4. The disadvantage of React
• 1.5. Overview React Native
• 1.6. Concept of redux toolkit
• 2. CHƯƠNG 2: STATUS SURVEY AND DETERMINATION OF REQUIREMENTS
• 2.1. Travel apps available
• 2.2. Non-functional requirements
• 2.3. Functional Decomposition Diagram
• 2.3.1. User functional decomposition diagram
• 2.3.2. Administrator functional decomposition diagram
• 2.4. Systems usecase diagrams
• 2.4.1. Usecase web module
• 2.4.2. Usecase app module
• 2.4.3. Usecase description for mobile application
• 2.4.3.1. Create a plan with a voice assistant (Alan)
• 2.4.3.2. View user’s announcements
• 2.4.3.3. Add new friend
• 2.4.4. Usecase description for web application
• 3. CHƯƠNG 3: SOFTWARE DESIGNATION
• 3.1. Sequence diagram in mobile application
• 3.1.1. Search place in map
• 3.1.2. Find the route
• 3.1.3. View detail information about place
• 3.1.4. View created plan
• 3.1.5. View detail plan
• 3.1.6. Create detail places for each day in plan
• 3.1.7. Delete detail place in each day of plan
• 3.1.8. Create place review
• 3.1.9. Create contribution for place
• 3.1.10. Report invalid report
• 3.1.11. Add favorite place
• 3.1.12. View all places
• 3.1.13. Create new plan
• 3.1.14. Log in with Google
• 3.2. Sequence diagram of Web app
• 3.2.1. Manage places: Add new place
• 3.2.2. Manage places: Edit place
• 3.2.3. Manage tags, categories, provinces: Create new
• 3.2.4. Manage tags, categories, provinces: Edit
• 3.2.5. Manage explores: Create new
• 3.2.6. Manage explores: Edit
• 3.2.7. Manage users: Lock/unlock account
• 3.2.8. Manage contributes: Mask as read/Hide
• 3.2.9. Manage contributes: View related information
• 3.2.10. Manage reported review: Mask as read/hide
• 3.2.11. Manage Reported review: View related information
• 3.3. User interface design
• 3.3.1. Mobile application interface
• 3.3.1.1. Application start interface
• 3.3.1.2. Login screen interface
• 3.3.1.3. Registration screen interface
• 3.3.1.4. Forgot password screen interface
• 3.3.1.5. Location details page
• 3.3.1.6. Location details screen (tab views reviews)
• 3.3.1.7. Report creation screen
• 3.3.1.8. User review creation screen
• 3.3.1.9. Location search screen
• 3.3.1.10. Plan view screen when not logged in
• 3.3.1.11. Plan view screen
• 3.3.1.12. Plan details screen
• 3.3.1.13. Plan creation screen
• 3.3.1.14. Day planner screen
• 3.3.1.15. User Collection Screen
• 3.3.1.16. Location search screen on map
• 3.3.1.17. User profile screen when not logged in
• 3.3.1.18. User profile screen
• 3.3.1.19. Language change screen
• 3.3.1.20. Favorite places screen
• 3.3.1.21. Password change screen
• 3.3.1.22. Friend search screen
• 3.3.2. User management page
• 3.3.3. Settings management page
• 3.3.4. Tag management page
• 3.3.5. Category management page
• 3.3.6. Location management screen
• 3.3.7. Place creation screen
• 3.3.8. Location information editing page
• 4. CHƯƠNG 4: INSTALL AND TEST
• 4.1. Environment and Software used
• 4.2. Test admin login function
• 4.3. Test admin’s new content creation features
• 4.4. Test the admin’s reporting and violation management functions
• 4.5. Test the user’s location search feature
• 4.6. Test the user’s review creation feature
• 4.7. Test the user’s plan creation feature
• LIST OF ACRONYMS
• LIST OF TABLES
• LIST OF FIGURES

Tóm tắt

I. Tổng quan về ứng dụng tìm kiếm điểm du lịch tại Việt Nam

Trong bối cảnh du lịch Việt Nam đang phát triển mạnh mẽ, việc xây dựng một ứng dụng tìm kiếm điểm du lịch trở nên cần thiết hơn bao giờ hết. Ứng dụng này không chỉ giúp người dùng dễ dàng tìm kiếm các địa điểm du lịch nổi tiếng mà còn cung cấp thông tin chi tiết về các hoạt động, dịch vụ và đánh giá từ người dùng khác. Sử dụng công nghệ MERN Stack, ứng dụng hứa hẹn mang lại trải nghiệm người dùng mượt mà và hiệu quả.

1.1. Lợi ích của ứng dụng tìm kiếm điểm du lịch

Ứng dụng giúp người dùng tiết kiệm thời gian và công sức trong việc tìm kiếm thông tin về các điểm du lịch. Ngoài ra, nó còn cung cấp các đánh giá và nhận xét từ những người đã trải nghiệm, giúp người dùng có cái nhìn tổng quan hơn về địa điểm mình muốn đến.

1.2. Công nghệ MERN Stack trong phát triển ứng dụng

MERN Stack bao gồm MongoDB, Express.js, React.js và Node.js, là một bộ công nghệ mạnh mẽ cho phép phát triển ứng dụng web nhanh chóng và hiệu quả. Sự kết hợp này giúp tối ưu hóa hiệu suất và khả năng mở rộng của ứng dụng.

II. Thách thức trong việc phát triển ứng dụng du lịch tại Việt Nam

Mặc dù có nhiều tiềm năng, việc phát triển ứng dụng tìm kiếm điểm du lịch tại Việt Nam cũng gặp không ít thách thức. Các vấn đề như thiếu dữ liệu chính xác, sự cạnh tranh từ các ứng dụng khác và nhu cầu thay đổi của người dùng là những yếu tố cần được xem xét kỹ lưỡng.

2.1. Thiếu dữ liệu chính xác và đáng tin cậy

Một trong những thách thức lớn nhất là việc thu thập và duy trì dữ liệu chính xác về các điểm du lịch. Nhiều thông tin có thể không được cập nhật thường xuyên, dẫn đến sự không hài lòng từ người dùng.

2.2. Cạnh tranh từ các ứng dụng khác

Thị trường ứng dụng du lịch đang ngày càng trở nên đông đúc với nhiều sản phẩm tương tự. Việc tạo ra sự khác biệt và thu hút người dùng là một thách thức không nhỏ.

III. Phương pháp phát triển ứng dụng tìm kiếm điểm du lịch hiệu quả

Để phát triển một ứng dụng tìm kiếm điểm du lịch hiệu quả, cần áp dụng các phương pháp và công nghệ hiện đại. Việc sử dụng MERN Stack không chỉ giúp tối ưu hóa quy trình phát triển mà còn đảm bảo tính linh hoạt và khả năng mở rộng của ứng dụng.

3.1. Thiết kế giao diện người dùng thân thiện

Giao diện người dùng cần được thiết kế đơn giản, dễ sử dụng và trực quan. Điều này giúp người dùng dễ dàng tìm kiếm và truy cập thông tin cần thiết mà không gặp khó khăn.

3.2. Tích hợp các tính năng thông minh

Các tính năng như gợi ý địa điểm dựa trên sở thích của người dùng, đánh giá từ cộng đồng và khả năng tạo kế hoạch du lịch cá nhân hóa sẽ làm tăng giá trị của ứng dụng.

IV. Ứng dụng thực tiễn và kết quả nghiên cứu

Kết quả nghiên cứu cho thấy ứng dụng tìm kiếm điểm du lịch đã thu hút được sự quan tâm lớn từ người dùng. Nhiều người đã sử dụng ứng dụng để tìm kiếm và lên kế hoạch cho chuyến đi của mình, từ đó tạo ra một cộng đồng chia sẻ kinh nghiệm du lịch phong phú.

4.1. Phản hồi từ người dùng

Người dùng đã có những phản hồi tích cực về tính năng và giao diện của ứng dụng. Họ đánh giá cao sự tiện lợi và thông tin phong phú mà ứng dụng cung cấp.

4.2. Tác động đến ngành du lịch

Ứng dụng không chỉ giúp người dùng tìm kiếm thông tin mà còn góp phần thúc đẩy ngành du lịch phát triển bền vững thông qua việc quảng bá các điểm đến nổi tiếng.

V. Kết luận và tương lai của ứng dụng tìm kiếm điểm du lịch

Ứng dụng tìm kiếm điểm du lịch tại Việt Nam sử dụng MERN Stack đã chứng minh được giá trị và tiềm năng của mình. Trong tương lai, việc cải tiến và mở rộng các tính năng sẽ giúp ứng dụng ngày càng hoàn thiện hơn, đáp ứng tốt hơn nhu cầu của người dùng.

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

Cần tiếp tục nghiên cứu và phát triển các tính năng mới, đồng thời cải thiện trải nghiệm người dùng để giữ chân khách hàng và thu hút người dùng mới.

5.2. Tích hợp công nghệ mới

Việc tích hợp các công nghệ mới như trí tuệ nhân tạo và học máy sẽ giúp ứng dụng trở nên thông minh hơn, từ đó nâng cao trải nghiệm người dùng.

Nội dung chính

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

Trong bối cảnh phục hồi và phát triển kinh tế giai đoạn "bình thường mới", việc củng cố và thúc đẩy ngành du lịch trở thành một trong những mục tiêu ưu tiên hàng đầu. Để đáp ứng yêu cầu này, các địa phương và điểm đến du lịch cần nhanh chóng số hóa các chiến dịch quảng bá, cung cấp thông tin chính xác, nhanh chóng và trực quan tới du khách. Thực tế cho thấy sự bùng nổ của các nội dung tiếp thị trên các nền tảng mạng xã hội và video ngắn (như TikTok) đôi khi thiếu tính xác thực, sai lệch so với thực tế, gây ảnh hưởng tiêu cực đến trải nghiệm của du khách cũng như uy tín của các đơn vị làm du lịch chân chính. Xuất phát từ thực trạng đó, đồ án tốt nghiệp tập trung phát triển ứng dụng tìm kiếm và giới thiệu địa điểm du lịch tại Việt Nam nhằm thống nhất dữ liệu và nâng cao độ tin cậy cho người dùng.

Nhiệm vụ và mục tiêu nghiên cứu của đồ án được xác định cụ thể theo văn bản:

1. Nghiên cứu lý thuyết: Tìm hiểu và làm chủ công nghệ MERN Stack (MongoDB, ExpressJS, React, Node.js), framework phát triển ứng dụng di động React Native, công cụ quản lý trạng thái Redux Toolkit, nền tảng gợi ý thông minh Recombee và trợ lý giọng nói Alan AI.
2. Triển khai ứng dụng thực tế:
   • Xây dựng hệ thống Web dành cho quản trị viên (Admin): Quản lý danh sách địa điểm, thông tin đóng góp từ người dùng, quản lý và kiểm duyệt đánh giá, quản lý tài khoản người dùng, danh mục thể loại, tỉnh thành và các báo cáo thống kê.
   • Xây dựng ứng dụng di động (Mobile App) cho người dùng: Tìm kiếm và xem thông tin chi tiết địa điểm du lịch; đánh giá, bình luận điểm đến; tích hợp trợ lý giọng nói ảo hỗ trợ tạo kế hoạch; lập kế hoạch và lịch trình chuyến đi; định vị và tìm kiếm tuyến đường trên bản đồ; quản lý hồ sơ cá nhân và kết nối bạn bè.

Đối tượng và phạm vi nghiên cứu của đề tài bao gồm:

• Đối tượng nghiên cứu:
  • Nhóm người dùng du lịch: Bao gồm những người đang chuẩn bị hoặc có nhu cầu đi du lịch cần tìm kiếm thông tin phù hợp, và những người đã trải nghiệm muốn chia sẻ đánh giá, đóng góp dữ liệu và kết nối cộng đồng.
  • Nhóm đơn vị cung cấp dịch vụ du lịch: Các tổ chức, cá nhân cần kênh quảng bá minh bạch, khách quan và có độ phủ thông tin địa lý chính xác.
• Phạm vi nghiên cứu: Hệ thống tập trung thu thập, chuẩn hóa và xử lý dữ liệu địa điểm du lịch chủ yếu tại khu vực Thành phố Hồ Chí Minh và tỉnh Bà Rịa – Vũng Tàu.

---

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

Đồ án xây dựng nền tảng lý thuyết vững chắc dựa trên mô hình kiến trúc phần mềm hiện đại và các giải pháp trí tuệ nhân tạo phục vụ cá nhân hóa trải nghiệm người dùng:

Thành phần / Công nghệ	Vai trò trong hệ thống	Đặc điểm kỹ thuật chính
MongoDB	Hệ quản trị cơ sở dữ liệu	CSDL phi quan hệ (NoSQL), hướng tài liệu (document-oriented), lưu trữ dưới định dạng BSON, hỗ trợ dữ liệu lồng nhau (nested data), không ràng buộc lược đồ cứng nhắc.
ExpressJS	Framework Backend	Xây dựng trên nền Node.js, cung cấp cơ chế Middleware xử lý HTTP request, định tuyến CRUD theo mô hình kiến trúc MVC.
ReactJS	Thư viện giao diện Web Admin	Thư viện UI hướng thành phần (Component-based), sử dụng Virtual DOM để so sánh trạng thái (diffing) và tối ưu hóa tốc độ cập nhật cây DOM thực tế.
React Native	Framework ứng dụng di động	Phát triển ứng dụng đa nền tảng (Android/iOS) bằng JavaScript, vận hành thông qua cơ chế giao tiếp giữa Main Thread (xử lý UI) và JS Thread (xử lý logic) qua Bridge.
Redux & Redux Toolkit	Quản lý trạng thái ứng dụng	Quản lý trạng thái tập trung (Store duy nhất), chuẩn hóa luồng Action - Reducer, tích hợp Redux Thunk cho các tác vụ bất đồng bộ và tạo slice logic tự động.
Recombee	Hệ thống gợi ý (Recommendation Engine)	Dịch vụ AI gợi ý kết hợp hai thuật toán: Lọc dựa trên nội dung (Content-based filtering) giải quyết bài toán khởi đầu lạnh (cold start) và Lọc cộng tác (Collaborative filtering) khi có đủ tương tác người dùng.
Alan AI	Trợ lý ảo giọng nói	Tích hợp xử lý ngôn ngữ tự nhiên, cho phép người dùng ra lệnh bằng giọng nói để tự động khởi tạo lịch trình du lịch trên thiết bị di động.

Phương pháp nghiên cứu và phát triển phần mềm được áp dụng xuyên suốt đồ án:

• Phương pháp khảo sát hiện trạng: Phân tích, so sánh các ứng dụng du lịch đang vận hành trên thị trường (Tripme, Tripadvisor, Airbnb) để rút ra ưu điểm về tính năng và khắc phục các nhược điểm về giao diện hoặc giới hạn tìm kiếm.
• Phương pháp phân tích và thiết kế hướng đối tượng: Sử dụng sơ đồ phân rã chức năng (Functional Decomposition Diagram - FDD), mô hình hóa hệ thống bằng biểu đồ ca sử dụng (Use Case Diagram), đặc tả chi tiết Use Case, biểu đồ tuần tự (Sequence Diagram) và sơ đồ thực thể dữ liệu (General Entity Schema).
• Phương pháp thực nghiệm và kiểm thử phần mềm: Thiết kế các ca kiểm thử chức năng (Test Cases) trên cả hai nền tảng Web Admin và Mobile App nhằm kiểm tra tính chính xác của các luồng xử lý nghiệp vụ.

---

Thiết kế và triển khai

Hệ thống được thiết kế theo mô hình phân tầng hoàn chỉnh, tách biệt rõ ràng giữa giao diện người dùng, lớp dịch vụ API trung gian và tầng dữ liệu lưu trữ.

+-----------------------------------------------------------------------+
|                            NGƯỜI DÙNG DU LỊCH                         |
+-----------------------------------+-----------------------------------+
                                    |
                                    v
+-----------------------------------------------------------------------+
|                    MOBILE CLIENT (React Native)                       |
|   - Tìm kiếm & Chỉ đường bản đồ  - Đánh giá & Báo cáo vi phạm         |
|   - Lập kế hoạch chuyến đi       - Trợ lý giọng nói Alan AI           |
|   - Quản lý thông tin cá nhân    - Kết nối bạn bè & Thông báo         |
+-----------------------------------+-----------------------------------+
                                    |
                                    v
+-----------------------------------------------------------------------+
|                    BACKEND API ENGINE (Node.js & Express)             |
|   - Middleware & Xác thực JWT    - Định tuyến CRUD RESTful            |
|   - Tích hợp Recombee AI Engine  - Xử lý tương tác logic              |
+------------------+--------------------------------+-------------------+
                   |                                |
                   v                                v
+-----------------------------------+  +--------------------------------+
|      DATABASE (MongoDB - BSON)    |  |    WEB ADMIN (ReactJS/Netlify) |
|   - Lưu trữ địa điểm, danh mục    |  |   - Quản lý địa điểm & danh mục|
|   - Lưu trữ người dùng, kế hoạch  |  |   - Duyệt báo cáo & đóng góp   |
|   - Lưu trữ đánh giá & tương tác  |  |   - Thống kê & Quản lý tài khoản|
+-----------------------------------+  +--------------------------------+

Kiến trúc phân hệ và luồng xử lý

1. Phân hệ Ứng dụng Di động (Mobile App Client):
   • Xác thực và Hồ sơ: Hỗ trợ đăng ký tài khoản thường, đăng nhập bằng tài khoản hệ thống hoặc thông qua Google OAuth, đổi mật khẩu, quên mật khẩu và chỉnh sửa thông tin cá nhân.
   • Khám phá và Tương tác: Tìm kiếm địa điểm theo từ khóa, lọc theo danh mục, tỉnh thành hoặc định vị trực tiếp trên bản đồ; xem thông tin chi tiết, hình ảnh, bài đánh giá và tìm đường đi giữa hai vị trí.
   • Lập kế hoạch du lịch: Cho phép khởi tạo lịch trình tổng quan, thêm/sửa/xóa danh sách các địa điểm chi tiết cho từng ngày của chuyến đi, hoặc ra lệnh trực tiếp thông qua trợ lý ảo Alan AI.
   • Đóng góp và Cộng đồng: Gửi thông tin đóng góp địa điểm mới, viết nhận xét/chấm điểm, gửi báo cáo vi phạm đối với các đánh giá không phù hợp, lưu địa điểm yêu thích, tìm kiếm và gửi lời mời kết bạn.
2. Phân hệ Quản trị Web (Web Admin):
   • Quản lý nội dung: Thêm mới và cập nhật thông tin địa điểm du lịch, tọa độ bản đồ, quản lý thẻ (tags), phân loại điểm đến (categories), thông tin tỉnh thành (provinces), quản lý bộ sưu tập khám phá (explores) và banner quảng bá.
   • Kiểm duyệt và Vận hành: Tiếp nhận và xử lý các báo cáo vi phạm từ người dùng (đánh dấu đã xem hoặc ẩn nội dung vi phạm), kiểm duyệt các đóng góp địa điểm mới, quản lý trạng thái tài khoản người dùng (khóa/mở khóa) và theo dõi biểu đồ thống kê hệ thống.

Hạ tầng triển khai và Môi trường vận hành

• Backend API: Xây dựng trên nền tảng Node.js/Express, cấu hình các endpoint RESTful và triển khai trên máy chủ đám mây Heroku.
• Web Admin: Xây dựng bằng ReactJS, tối ưu hóa giao diện quản trị và triển khai trên dịch vụ lưu trữ Netlify.
• Mobile Client: Phát triển bằng React Native, đóng gói và chạy thực nghiệm trên hệ điều hành Android.

---

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

Chương 1: Cơ sở lý thuyết (Theoretical Basis)

Chương 1 trình bày chi tiết nền tảng công nghệ sử dụng trong đề tài:

• Khái quát về hệ quản trị cơ sở dữ liệu MongoDB: Cấu trúc lưu trữ BSON, cơ chế xử lý dữ liệu phi cấu trúc, khả năng lồng ghép tài liệu giúp tăng tốc độ truy vấn so với các phép JOIN phức tạp trong CSDL quan hệ.
• Tổng quan framework ExpressJS: Khả năng tổ chức mã nguồn theo mô hình MVC gọn nhẹ, cơ chế xử lý Middleware và định tuyến RESTful API.
• Phân tích thư viện ReactJS: Cơ chế Virtual DOM, phương pháp so sánh cây DOM để tối ưu hóa hiệu năng render giao diện, phân tích ưu điểm về tốc độ và nhược điểm khi chỉ đóng vai trò tầng View.
• Nền tảng React Native: Kiến trúc hai luồng Main Thread và JS Thread giao tiếp thông qua Bridge, phân tích lợi ích tái sử dụng mã nguồn đa nền tảng và các giới hạn về xử lý đồ họa phức tạp.
• Công cụ Redux và Redux Toolkit: Giải pháp quản lý trạng thái tập trung cho ứng dụng SPA, vai trò của Store, Action, Reducer, Slices và Redux Thunk trong việc chuẩn hóa cấu trúc dự án.
• Hệ thống gợi ý Recombee: Nguyên lý hoạt động kết hợp giữa Content-based filtering và Collaborative filtering nhằm cung cấp dịch vụ gợi ý thông minh dựa trên hành vi tương tác của người dùng.

Chương 2: Khảo sát hiện trạng và xác định yêu cầu (Status Survey and Determination of Requirements)

Chương 2 tập trung vào việc nghiên cứu thực tế và xác lập các yêu cầu hệ thống:

• Đánh giá hiện trạng ba ứng dụng du lịch tiêu biểu: Phân tích ưu/nhược điểm của Tripme (kho dữ liệu khách sạn lớn nhưng giao diện đơn giản, thiếu chi tiết điểm đến), Tripadvisor (mạnh về đặt phòng, vé máy bay và đánh giá nhưng phức tạp) và Airbnb (tối ưu cho lưu trú và trải nghiệm địa phương).
• Xây dựng bảng yêu cầu chức năng (Functional Requirements) chi tiết cho hai đối tượng: Người dùng di động (tiềm năng và đã đăng ký) và Quản trị viên hệ thống.
• Xác định các yêu cầu phi chức năng (Non-functional Requirements):
  • Hiệu năng: Thời gian phản hồi hiển thị thông tin không vượt quá 5 giây.
  • An toàn và bảo mật: Phân quyền chặt chẽ giữa các nhóm người dùng, cơ sở dữ liệu đáp ứng tiêu chuẩn an toàn thông tin.
  • Giao diện và xử lý sự cố: Giao diện thân thiện, có hiệu ứng chuyển cảnh mượt mà; hệ thống có cơ chế bắt lỗi để ngăn ngừa mất mát dữ liệu và giảm thiểu thời gian gián đoạn.
• Xây dựng sơ đồ phân rã chức năng (FDD) và hệ thống biểu đồ Ca sử dụng (Use Case Diagrams) cho cả hai phân hệ Web Admin và Mobile App.

Chương 3: Thiết kế phần mềm (Software Designation)

Chương 3 mô tả toàn bộ quá trình thiết kế kỹ thuật của hệ thống:

• Thiết kế biểu đồ tuần tự (Sequence Diagrams) cho các tính năng cốt lõi trên Mobile App: Đăng ký, đăng nhập, tìm kiếm địa điểm, xem chi tiết, tìm đường trên bản đồ, tạo/sửa/xóa lịch trình chuyến đi, tạo kế hoạch qua trợ lý ảo Alan AI, đánh giá điểm đến, báo cáo vi phạm, đóng góp thông tin, thêm địa điểm yêu thích và quản lý bạn bè.
• Thiết kế biểu đồ tuần tự cho Web Admin: Thêm/sửa địa điểm, quản lý thẻ, danh mục, tỉnh thành, quản lý bộ sưu tập khám phá, khóa/mở tài khoản người dùng, xử lý bài đóng góp và duyệt báo cáo vi phạm.
• Thiết kế sơ đồ lược đồ thực thể cơ sở dữ liệu (General Entity Schema).
• Thiết kế chi tiết giao diện người dùng (UI Design): Bản vẽ màn hình cho toàn bộ các luồng tương tác trên ứng dụng di động (màn hình khởi động, đăng nhập, chi tiết địa điểm, tạo lịch trình, bản đồ chỉ đường, danh sách yêu thích) và giao diện trang quản trị web (trang thống kê, quản lý người dùng, quản lý điểm đến, quản lý banner).

Chương 4: Cài đặt và kiểm thử (Install and Test)

Chương 4 ghi nhận môi trường triển khai thực tế và kết quả kiểm thử hệ thống:

• Thiết lập môi trường phần mềm: Cấu hình cơ sở dữ liệu MongoDB, triển khai Backend API trên Heroku, triển khai Web Admin trên Netlify và cài đặt ứng dụng Android trên thiết bị di động.
• Tiến hành thực thi các kịch bản kiểm thử chức năng:
  • Kiểm thử chức năng đăng nhập và quản lý nội dung của Admin.
  • Kiểm thử các luồng xử lý báo cáo vi phạm và duyệt thông tin đóng góp của Admin.
  • Kiểm thử tính năng tìm kiếm địa điểm, lọc dữ liệu của người dùng.
  • Kiểm thử quy trình gửi đánh giá và nhận xét địa điểm.
  • Kiểm thử chức năng lập lịch trình du lịch từng ngày của người dùng.

---

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

Đồ án đã hoàn thành đầy đủ các mục tiêu đề ra theo đúng tiến độ nghiên cứu và phát triển:

• Kết quả thực nghiệm:
  • Xây dựng hoàn chỉnh hệ thống ứng dụng di động chạy ổn định trên nền tảng Android, cung cấp đầy đủ các tính năng tìm kiếm, định vị bản đồ, xem thông tin chi tiết và đánh giá địa điểm.
  • Triển khai thành công trang Web quản trị trên nền tảng Netlify và hệ thống Backend RESTful API trên Heroku kết nối cơ sở dữ liệu đám mây MongoDB.
  • Tích hợp thành công trợ lý ảo Alan AI vào ứng dụng di động, cho phép người dùng tương tác bằng giọng nói để tự động khởi tạo kế hoạch du lịch.
  • Tích hợp công cụ Recombee để hiện thực hóa tính năng gợi ý thông minh dựa trên đặc điểm nội dung và tương tác của người dùng.
• Đóng góp khoa học và thực tiễn:
  • Về mặt khoa học: Đồ án chứng minh khả năng làm chủ và kết hợp hiệu quả các công nghệ trong ngăn xếp MERN Stack và React Native; đồng thời ứng dụng thành công các giải pháp công nghệ lấy con người làm trung tâm (Human-centered technologies) như trợ lý giọng nói và hệ thống khuyến nghị cá nhân hóa.
  • Về mặt thực tiễn: Đóng góp một giải pháp cụ thể cho quá trình số hóa thông tin và dịch vụ du lịch tại Việt Nam; cung cấp kênh thông tin có độ tin cậy cao cho du khách và tạo nền tảng tham khảo trực quan cho các nhà phát triển du lịch trong việc thiết kế các chiến dịch quảng bá điểm đến.

---

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

Dựa trên nội dung báo cáo và phạm vi thực hiện của đồ án, các hạn chế cùng định hướng phát triển tiếp theo được xác định như sau:

• Hạn chế:
  • Phạm vi dữ liệu địa điểm du lịch mới chỉ tập trung chủ yếu tại khu vực Thành phố Hồ Chí Minh và tỉnh Bà Rịa – Vũng Tàu, chưa bao phủ toàn bộ các tỉnh thành trên cả nước.
  • Quá trình thử nghiệm và kiểm thử ứng dụng di động chủ yếu tập trung thực hiện trên hệ điều hành Android.
• Hướng nghiên cứu tiếp:
  • Mở rộng kho dữ liệu địa điểm, danh lam thắng cảnh và dịch vụ du lịch ra quy mô toàn quốc.
  • Nghiên cứu sâu hơn về hành vi người dùng nhằm tối ưu hóa các giải pháp gợi ý mang tính cá nhân hóa cao cho từng đối tượng du khách cụ thể.
  • Hoàn thiện và mở rộng các tính năng kết nối mạng xã hội, nâng cao cơ chế tích điểm, thông báo tương tác và chia sẻ chuyến đi trong cộng đồng.

---

Giá trị tham khảo

Tài liệu khóa luận tốt nghiệp này mang lại giá trị học thuật và ứng dụng thực tiễn cao cho nhiều đối tượng:

• Sinh viên ngành Công nghệ thông tin và Kỹ thuật phần mềm: Là tài liệu tham khảo hoàn chỉnh về quy trình xây dựng đồ án tốt nghiệp, từ khảo sát hiện trạng, phân tích yêu cầu, thiết kế kiến trúc hệ thống bằng sơ đồ chuẩn (FDD, Use Case, Sequence Diagram) đến cài đặt và viết kịch bản kiểm thử.
• Người phát triển ứng dụng Web & Mobile: Cung cấp mô hình triển khai thực tế của ngăn xếp MERN Stack kết hợp React Native và Redux Toolkit, cách tổ chức State tập trung và phương thức đóng gói triển khai ứng dụng lên Heroku/Netlify.
• Nhà nghiên cứu tích hợp AI vào ứng dụng: Đáng tham khảo ở phần tích hợp trợ lý giọng nói Alan AI vào ứng dụng di động và cơ chế kết hợp thuật toán Content-based cùng Collaborative filtering thông qua nền tảng Recombee.

---

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

1. Đồ án giải quyết vấn đề thực tiễn nào trong ngành du lịch Việt Nam?
Đồ án giải quyết nhu cầu số hóa thông tin du lịch chính xác trong giai đoạn phục hồi kinh tế "bình thường mới", đồng thời khắc phục tình trạng thông tin quảng bá tràn lan, sai lệch thực tế trên các nền tảng video ngắn (như TikTok) bằng cách xây dựng một ứng dụng tập trung, có độ tin cậy cao và kiểm duyệt minh bạch.

2. Ngăn xếp công nghệ (Tech Stack) hoàn chỉnh của hệ thống bao gồm những gì?
Hệ thống sử dụng ngăn xếp MERN Stack kết hợp: MongoDB (cơ sở dữ liệu NoSQL lưu trữ BSON), ExpressJS (framework backend), Node.js (môi trường máy chủ API trên Heroku), ReactJS (frontend Web Admin trên Netlify), React Native (ứng dụng di động đa nền tảng chạy trên Android), Redux Toolkit (quản lý trạng thái), Recombee (hệ thống gợi ý AI) và Alan AI (trợ lý giọng nói).

3. Cơ chế hoạt động của hệ thống gợi ý Recombee trong ứng dụng là gì?
Recombee kết hợp hai thuật toán: Thuật toán lọc dựa trên nội dung (Content-based filtering) được sử dụng khi dữ liệu tương tác của người dùng còn hạn chế (bài toán Cold Start), và Thuật toán lọc cộng tác (Collaborative filtering) được kích hoạt khi có đủ dữ liệu hành vi để đưa ra gợi ý điểm đến chính xác nhất theo sở thích tương đồng giữa các người dùng.

4. Trợ lý ảo Alan AI đảm nhận nhiệm vụ gì trong ứng dụng di động?
Trợ lý ảo Alan AI được tích hợp trực tiếp vào ứng dụng di động để hỗ trợ người dùng tạo kế hoạch chuyến đi (trip plan) thông qua khẩu lệnh giọng nói, giúp đơn giản hóa các thao tác thủ công khi lập lịch trình du lịch.

5. Phạm vi thu thập dữ liệu không gian của đồ án tập trung tại khu vực nào?
Theo phạm vi nghiên cứu được xác định trong văn bản, đồ án tập trung thu thập và chuẩn hóa dữ liệu địa điểm du lịch chủ yếu tại Thành phố Hồ Chí Minh và tỉnh Bà Rịa – Vũng Tàu.

---

Kết luận

Khóa luận tốt nghiệp "Building an application for finding tourist attraction in Vietnam based on MERN Stack" của nhóm sinh viên Nguyễn Thị Minh Hoàng và Lê Thị Phương Thảo (Đại học Sư phạm Kỹ thuật TP.HCM) đã hoàn thành xuất sắc mục tiêu xây dựng hệ sinh thái ứng dụng hỗ trợ du lịch toàn diện. Hệ thống kết hợp nhuần nhuyễn giữa ngăn xếp MERN Stack, React Native, Redux Toolkit cùng các giải pháp trí tuệ nhân tạo như Recombee và Alan AI. Kết quả nghiên cứu không chỉ đáp ứng đầy đủ các yêu cầu kỹ thuật và nghiệp vụ thực tế mà còn đóng góp một mô hình số hóa dữ liệu du lịch tin cậy, làm tiền đề vững chắc cho việc mở rộng phạm vi ứng dụng trên toàn quốc.

Trích đoạn nội dung tài liệu

MINISTRY OF EDUCATION AND TRAINING HO CHI MINH CITY UNIVERSITY OF TECHNOLOGY AND EDUCATION GRADUATION THESIS INFORMATION TECHNOLOGY BUILDING AN APPLICATION FOR FINDING TOURIST ATTRACTION IN VIETNAM BASED ON MERN STACK LECTURER: Ph.D LE VINH THINH STUDENT: NGUYEN THI MINH HOANG LE THI PHUONG THAO SKL 009859 Ho Chi Minh City, Jan 2022 HO CHI MINH UNIVERSITY OF TECHNOLOGY AND EDUCATION FACULTY OF INFORMATION TECHNOLOGY SOFTWARE TECHNOLOGY SUBJECT □🕮□ GRADUATION THESIS BUILDING AN APPLICATION FOR FINDING TOURIST ATTRACTION IN VIETNAM BASED ON MERN STACK STUDENT NAME STUDENT ID NGUYEN THI MINH HOANG 18110285 LE THI PHUONG THAO 18110366 ADVISOR Ph.D LE VINH THINH HO CHI MINH – 1/1/2022 HO CHI MINH UNIVERSITY OF TECHNOLOGY AND EDUCATION FACULTY OF INFORMATION TECHNOLOGY □🕮□ GRADUATION THESIS BUILDING AN APPLICATION FOR FINDING TOURIST ATTRACTION IN VIETNAM BASED ON MERN STACK STUDENT NAME STUDENT ID NGUYEN THI MINH HOANG 18110285 LE THI PHUONG THAO 18110366 ADVISOR Ph.D LE VINH THINH HO CHI MINH – 1/1/2 HCMC University of Technology and Education SOCIALIST REPUBLIC VIETNAM Faculty of Information Technology Independence – Liberty – Happiness ******* ******* INSTRUCTOR COMMENT SHEET Full name of the first student: Nguyen Thi Minh Hoang………….ID: 18110285 Full name of the second student: Le Thi Phuong Thao …….ID: 18110366 Majors: Information technology. Subject: Building an application for finding tourist attraction in Vietnam based on MERN Stack.D Le Vinh Thinh COMMENT 1.Regarding the content of the topic and the volume of implementation: ………………………………………………………………………………………… 2. Approval for oral defense? (Approved or denied)………………………………………. Ho Chi Minh city, ………………….

2022 Instructor teacher (Sign & write fullname) HCMC University of Technology and Education SOCIALIST REPUBLIC Faculty of Information Technology VIETNAM ******* Independence – Liberty – Happiness ******* REVIEWER TEACHER 'S SCORECARD Full name of the first student: Nguyen Thi Minh Hoang. ID: 18110285 Full name of the second student: Le Thi Phuong Thao………….ID: 18110366 Majors: Information technology. Subject: Building an application for finding tourist attraction in Vietnam based on MERN Stack. Reviewer teacher: Huynh Xuan Phung COMMENTS: 1.

Regarding the content of the topic and the volume of implementation: ………………………………………………………………………………………… ………………………………………………………………………………………… 2. Approval for oral defense? (Approved or denied). Ho Chi Minh city, …………………. 2022 Reviewer teacher (Sign & write fullname) ACKNOWLEDGEMENT First, our group would like to send our sincere and most profound thanks to the Faculty of Information Technology – Ho Chi Minh City University of Technology and Education for creating conditions for our group to study, develop a deep knowledge base and carry out this topic.

Besides, our team would like to thank M. Le Vinh Thinh, who has supported us a lot. The teacher gave us ideas to help us improve the product better and more realistic; Besides, he also shared valuable tips to enhance the group’s presentation. Thanks to his enthusiastic support, we could complete this essay well.

However, the amount of knowledge is endless, and with the limited capacity, we have tried very hard to complete it the best way. Therefore, the occurrence of errors is inevitable. We hope to receive your enthusiastic comments so we can learn from experience, improve and upgrade our products in the best way possible. We sincerely thank you! Implement group Nguyen Thi Minh Hoang – 18110285 Le Thi Phuong Thao – 18110366 HCMC University of Technology and Education Faculty of Information Technology GRADUATE THESE SUBJECTS Full name of the first student: Nguyen Thi Minh Hoang……………ID: 18110285 Full name of the second student: Le Thi Phuong Thao ………….ID: 18110366 Dissertation time: Specialized: Software technology.

Project name: Building an application for finding tourist attraction in Vietnam based on MERN Stack.D Le Vinh Thinh Thesis task: 1. Theory: Learn about technologies: MERN Stack 2. Implementation: Build a travel app with features: - Web admin: + Manage locations, contributors, user reviews and related information. + Manage users, statistics.

- Mobile application with basic feature: + View information and search for tourist attractions. + Rate places, virtual voice guides. + Create plan for trip. + Manage user profile.

+ Search for places and routes on the map. + Connect with friends. Date Tasks Product Note - Search, research and Functional diagram of 16- brainstorm ideas for topics. 1 24/8/2021 -Learn about MERN Stack technology ● Make a plan to implement the 2 25/8-30/8 topic.

● Interface design for web and Mockup 3 1/9-10/9 app mobile, ● Building APIs using nodejs. The APIs have been 4 11/9-20/9 deployed to heroku Website for admin 5 21/9- 20/10 ● Build a website for admins. deployed to netlify Apps running on 6 21/10-20/12 ● Build mobile apps for users. android Applications run 7 20/12-26/12 ● Testing and debugging.

smoothly on devices 27/12- 8 ● Complete report Essay report 5/1/2022 14/02- 9 ● Complete Alan function. 20/2/2022 21/02 – ● Research and development 10 27/02/2022 direction 28/02 – ● Add friend and notification 11 27/3/2022 features. ● Research user behavior and 28/03 – individualized application 12 17/04/2022 solutions based on each specific user. 13 08/05/2022 ● Write Power point.

09/05 – Essay report and 14 ● Test the app and debug. 09/07/2022 powerpoint ● Write a report. Ho Chi Minh, ……………. 2022 Instructor Reporter (Sign and fullname) (Sign and fullname) TABLE OF CONTENT TABLE OF CONTENT.

10 LIST OF ACRONYMS. 17 LIST OF TABLES. 18 LIST OF FIGURES. The urgency of the topic.

Scientific and practical significance. 4 CHAPTER 1: THEORETICAL BASIS. Some main features. Advantages of React.

The disadvantage of React. Overview React Native. Concept of redux toolkit. 10 CHAPTER 2: STATUS SURVEY AND DETERMINATION OF REQUIREMENTS.

Travel apps available. Non-functional requirements. Functional Decomposition Diagram. User functional decomposition diagram.

Administrator functional decomposition diagram. Systems usecase diagrams. Usecase web module. Usecase app module.

Usecase description for mobile application. 23 Create a plan with a voice assistant (Alan). 52 View user’s announcements. 53 Add new friend.

Usecase description for web application. 55 CHAPTER 3: SOFTWARE DESIGNATION. Sequence diagram in mobile application. 75 6) Search place in map.

76 7) Find the route. 77 8) View detail information about place. 78 9) View created plan. 80 11) View detail plan.

83 14) Create detail places for each day in plan. 84 15) Delete detail place in each day of plan. 85 16) Create place review. 86 17) Create contribution for place.

87 18) Report invalid report. 88 19) Add favorite place. 89 20)View all places. 90 21) Create new plan.

94 26) Log in with Google. Sequence diagram of Web app. 98 1) Manage places: Add new place. 98 2) Manage places: Edit place.

99 3) Manage tags, categories, provinces: Create new. 100 4) Manage tags, categories, provinces: Edit. 101 5) Manage explores: Create new. 102 6) Manage explores: Edit.

103 7) Manage users: Lock/unlock account. 103 8) Manage contributes: Mask as read/Hide. 104 9) Manage contributes: View related infomation. 104 10) Manage reported review: Mask as read/hide.

105 11) Manage Reported review: View related information. User interface design. Mobile application interface. Application start interface.

Login screen interface. Registration screen interface. Forgot password screen interface. Location details page.

Location details screen ( tab views reviews). Report creation screen. User review creation screen. Location search screen.

Plan view screen when not logged in. Plan view screen. Plan details screen. Plan creation screen.

Day planner screen. User Collection Screen. Location search screen on map. User profile screen when not logged in.

User profile screen. Language change screen. Favorite places screen. Password change screen.

Friend search screen. User management page. Settings management page. Tag management page.

Category management page. Location management screen. Place creation screen. Location information editing page.

173 CHAPTER 4: INSTALL AND TEST .1 Environment and Software used:. Test admin login function. Test admin’s new content creation features. Test the admin’s reporting and violation management functions.

Test the user’s location search feature. Test the user’s review creation feature. Test the user’s plan creation feature. 191 LIST OF ACRONYMS LIST OF TABLES Table 1.

Normal account registration usecase. See user reviews usecase. View places usecase. Search for places usecase.

Search the place on the map usecase. Find the route between two places usecase. View details of place usecase. View created trip planner.

Create a trip plan usecase.View plan details usecase. Edit plan information usecase. Delete trip plan usecase. Create a plan for each day usecase.

Clear plans for each day usecase. Create a place review usecase. Make suggestions for the place usecase. Report rating inappropriate usecase.

Add places to favorites usecase. Remove places from favorites usecase. Sign out the app usecase. Password change usecase.

Forgot password usecase. Edit personal information usecase. Change language usecase. Sign in with Google usecase.

Create a plan with a voice assistant usecase. View user’s announcements. Add location usecase. Edit information usecase.

Manage cards; types; districts: Create usecase. Manage cards; types; districts: Update. Manage explore – create usecase. Manage explore – update usecase.

Lock/unlock the user's account - usecase. Manage Contributes: Mark viewed, hidden usecase. Manage Contributes: View related information usecase. Manage reported view: mark viewed, hidden usecase.

Manage reported review: view related information. Description of login screen. Description of the registration screen interface. Description of the forgot password screen.

Description of the navigation bar. Description of the home screen. Description of the location detail screen. Description of the location tab screen interface.

Description of the review tab screen interface. Description of the evaluation report creation screen interface. Description of the review screen. Description of the review creation screen.

Description of the location search screen. Description of the plan screen when not logged in. Description of plan view screen. Description of the plan overview screen.

Description of plan creation screen. Description of the day plan screen. Description of the screen of the processing buttons. Screen description of the collection of favorite places.

Description of location search screen on map. Description of the location selection screen on the map. Description of the route screen on the map. Description of user profile screen when not logged in.

Description of the user profile screen. Description of the user information change screen. Description of the language switching screen. Description of the password change screen.

Description of the notification screen. Description of Friend search screen. Description of the admin login page screen. Description of home page.

Description of the statistics page. Description of the user management page. Description of the provincial management and setting page. Description of the provincial information editing page.

Description of the tag management page. Description of the site type management page. Description of banner management page. Description of the site management page.

Description of the site creation page. Describe of the page to find the location of the place on the map. Description of the location information editing page. Test admin login function.

Test admin’s new content creation features. Test the admin's reporting and violation management functions. Test the user’s location search feature. Test the user’s review creation feature.

Test the user’s plan creation feature. 190 LIST OF FIGURES Figure 1. Organize storage in MongoDB. User functional decomposition diagram.

Administrator functional decomposition diagram. Usecase web module. Usecase app module. Sequence diagram of feature Sign up.

Sequence diagram of feature Login. Sequence diagram of feature View review. Sequence diagram of feature Search places. Sequence diagram of feature View places.

Sequence diagram of feature Search places in map. Sequence diagram of feature Find the route. Sequence diagram of feature View detail information about place. Sequence diagram of feature View created plan.

Sequence diagram of feature Log out.