1. Trang chủ
  2. » Giáo Dục - Đào Tạo

Xây dựng hệ thống cộng Đồng chia sẻ lộ trình học ai journey sử dụng công nghệ reactjs flutter và nestjs

209 0 0
Tài liệu đã được kiểm tra trùng lặp

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Xây Dựng Hệ Thống Cộng Đồng Chia Sẻ Lộ Trình Học AI Journey Sử Dụng Công Nghệ Reactjs Flutter Và Nestjs
Tác giả Nguyễn Văn Ninh, Đinh Văn Toàn
Người hướng dẫn TS. Mai Anh Thơ, ThS. Nguyễn Thủy An
Trường học Trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh
Chuyên ngành Công Nghệ Thông Tin
Thể loại Khóa Luận Tốt Nghiệp
Năm xuất bản 2024
Thành phố Thành Phố Hồ Chí Minh
Định dạng
Số trang 209
Dung lượng 8,96 MB

Cấu trúc

  • 1. Tính cấp thiết của đề tài (8)
  • 2. Đối tượng nghiên cứu (8)
  • 3. Phạm vi nghiên cứu (8)
  • 5. Mục tiêu của đề tài (23)
  • CHƯƠNG 1. KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU (8)
    • 1.1. Khảo sát hiện trạng (24)
      • 1.1.1. Chat GPT (24)
      • 1.1.2. Microsoft's Bing ChatGPT (26)
      • 1.1.3. Claude-AI (27)
      • 1.1.4. Kết luận (27)
    • 1.2. Xác định yêu cầu (28)
      • 1.2.1. Yêu cầu chức năng hệ thống (28)
      • 1.2.2. Yêu cầu chức năng nghiệp vụ (30)
      • 1.2.3. Yêu cầu phi chức năng (33)
  • CHƯƠNG 2. CÔNG NGHỆ ÁP DỤNG TRONG DỰ ÁN (8)
    • 2.1. Kiến trúc chung của hệ thống (8)
    • 2.2. REACT JS (8)
      • 2.2.1. Giới thiệu React JS (35)
      • 2.2.2. Một số công nghệ áp dụng liên quan đến React JS (35)
    • 2.3. Nestjs (8)
      • 2.3.1. Giới thiệu Nestjs (37)
      • 2.3.2. Cài đặt NestJS trong dự án (38)
      • 2.3.3. Cấu trúc của NestJS áp dung xây dựng Backend (39)
    • 2.4. Websocket (8)
      • 2.4.1. Giới thiệu Websocket (40)
      • 2.4.2. Công dụng WebSocket (41)
      • 2.4.3. Thuộc tính của WebSocket được sử dụng trong dự án (41)
    • 2.5. Prisma (8)
      • 2.5.1. Giới thiệu Prisma (41)
      • 2.5.2. Tính năng của Prisma được sử dụng trong dự án (42)
      • 2.5.3. Cách xây dựng API REST với Prisma và PostgreSQL trong ứng dụng dư án 22 2.6. Postgresql (42)
      • 2.6.1. Giới thiệu Postgresql (43)
      • 2.6.2. Tính năng của Postgresql áp dụng trong dự án (43)
      • 2.6.3. Cài đặt PostgreSQL 12 và công cụ quản lý pgAdmin 4 (46)
    • 2.7. MongoDB (8)
      • 2.7.1. Giới thiệu (46)
      • 2.7.2. Cài đặt MongoDB và công cụ quản lý (46)
    • 2.8. Claude-AI (8)
      • 2.8.1. Giới thiệu Claude-AI (47)
      • 2.8.2. Chức năng Claude AI áp dụng dự án (47)
      • 2.8.3. Cách sử dụng Claude AI (47)
    • 2.9. OpenAI API (8)
      • 2.9.1. Giới thiệu OpenAI API (48)
      • 2.9.2. Chức năng OpenAI API áp dụng dự án (48)
      • 2.9.3. Cách sử dụng OpenAI API (49)
    • 2.10. Flutter (8)
      • 2.10.1. Giới thiệu Flutter (50)
      • 2.10.2. Một số công nghệ áp dụng liên quan đến Flutter (50)
      • 2.10.3. Cách sử dụng Flutter (50)
    • 2.11. Firebase (8)
      • 2.11.1. Giới thiệu Firebase (51)
      • 2.11.2. Các tính năng chính của Firebase áp dụng vào dự án (51)
      • 2.11.3. Cách sử dụng Firebase (51)
    • 2.12. AWS (8)
  • CHƯƠNG 3. MÔ HÌNH HÓA YÊU CẦU (9)
    • 3.1. Lược đồ Usecase (55)
    • 3.2. Mô hình hóa yêu cầu (57)
  • CHƯƠNG 4. THIẾT KẾ PHẦN MỀM (9)
    • 4.1. Lược đồ tuần tự (9)
      • 4.1.1. Lược đồ tuần tự phía khách và thành viên (99)
      • 4.1.2. LƯỢC ĐỒ TUẦN TỰ PHÍA ADMIN (120)
    • 4.2. Lược đồ lớp (130)
      • 4.2.1. Chi tiết bảng dữ liệu (130)
    • 4.3. Thiết kế giao diện (9)
      • 4.3.1. Giao diện chính phía khách và thành viên trên nền tảng web (142)
      • 4.3.2. Giao diện chính phía khách và thành viên trên nền tảng di động (165)
      • 4.3.3. Giao diện chính phía quản trị viên (191)
  • CHƯƠNG 5. CÀI ĐẶT VÀ KIỂM THỬ (9)
    • 5.1. Công cụ cài đặt (9)
    • 5.2. Cài đặt ứng dụng (9)
    • 5.3. Kiểm thử (197)
      • 5.3.1. Kế hoạch kiểm thử (197)
      • 5.3.2. Chiến lược kiểm thử (198)
      • 5.3.3. Quy trình thiết kế kiểm thử (199)
      • 5.3.4. Kết quả kiểm thử (200)
    • 1. Kết quả đạt được (9)
      • 1.1. Về kiến thức (206)
      • 1.2. Về thực tiễn (206)
    • 2. Ưu điểm (5)
    • 3. Nhược điểm (9)
    • 4. Hướng phát triển (9)
  • TÀI LIỆU THAM KHẢO (9)

Nội dung

BỘ GIÁO DỤC VÀ ĐÀO TẠOTRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH ĐỒ ÁN TỐT NGHIỆP NGÀNH CÔNG NGHỆ THÔNG TIN GVHD: MAI ANH THƠ NGUYỄN THỦY AN SVTH: NGUYỄN VĂN NINH ĐINH VĂN TOÀ

KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU

Khảo sát hiện trạng

- https://chat.openai.com/auth/login

Hình 1 Khảo sát Chat GPT

Hình 2 Khảo sát Chat GPT

Hình 3 Khảo sát Chat GPT Ưu điểm:

ChatGPT sử dụng mạng Neural Transformer để học hỏi và cung cấp câu trả lời nhanh chóng, chính xác, đáp ứng nhu cầu của người dùng.

ChatGPT sở hữu kiến thức sâu rộng nhờ vào việc áp dụng deep learning trên một lượng lớn dữ liệu từ nhiều lĩnh vực khác nhau Điều này giúp nó có khả năng cung cấp câu trả lời cho mọi câu hỏi mà người dùng đặt ra, bất kể lĩnh vực nào.

ChatGPT sở hữu khả năng tương tác tự nhiên, giúp dẫn dắt các cuộc hội thoại một cách giống như con người, mang lại cảm giác dễ chịu và thoải mái cho người dùng khi trò chuyện.

 Mở rộng kiến thức: Không chỉ được tiếp cận với nhiều nguồn dữ liệu,

ChatGPT có khả năng ghi nhớ nội dung các cuộc trò chuyện trước đó, từ đó cung cấp những gợi ý thông minh và cá nhân hóa cho người dùng.

 ChatGPT hoạt động và làm việc 24/7, không ngừng nghỉ và khả năng xử lý lượng lớn câu hỏi và công việc

Mặc dù Chatbot GPT được đào tạo trên một lượng dữ liệu lớn, độ chính xác của thông tin mà nó cung cấp không phải lúc nào cũng tuyệt đối Do đó, vẫn có khả năng xảy ra một số sai sót trong việc cập nhật thông tin.

ChatGPT gặp hạn chế về ngôn ngữ, không thể đáp ứng những yêu cầu phức tạp và cụ thể do chưa xử lý được toàn bộ từ ngữ mà người dùng sử dụng.

 Dữ liệu bị hạn chế: Dữ liệu của AI bị giới hạn tới năm 2021

Truy cập trình duyệt Edge: https://www.bing.com/chat

Hình 4 Khảo sát BingChatbot Ưu điểm:

 BingGPT có thể phản hồi dựa trên những sự kiện mới nhất

 Cung cấp kết quả chi tiết và chuyên sâu

 BingGPT có xu hướng đề xuất hoặc chủ động ngăn chặn những câu trả lời có khả năng gây hại

 Độ chính xác thông tin không tuyệt đối

 Hạn chế về mặt ngôn ngữ

Claude AI là một chatbot AI tiên tiến do Anthropic phát triển, mang đến trải nghiệm mới mẻ với khả năng cung cấp thông tin giá trị, tin cậy và an toàn Với bộ dữ liệu khổng lồ, Claude AI có khả năng tạo nội dung chất lượng cao cho nhiều chủ đề, cũng như thực hiện dịch thuật và chuyển đổi ngôn ngữ hiệu quả.

Hình 5 Khảo sát Claude-AI Claude AI có tính năng:

 Trợ lý đa năng, mang lại hiệu quả vượt trội

 Hỗ trợ đa ngôn ngữ và khả năng đọc tài liệu ấn tượng

 Hai phiên bản tùy chọn đáp ứng mọi nhu cầu

ChatGPT, Claude-AI và BingGPT đều là những ứng dụng trí tuệ nhân tạo, cung cấp nội dung tham khảo với độ tin cậy cao, nhưng không hoàn toàn tuyệt đối.

Cả ba mô hình đã được huấn luyện trên một khối lượng dữ liệu khổng lồ, bao gồm văn bản từ internet và nhiều nguồn thông tin khác nhau, nhằm nâng cao khả năng hiểu biết về nhiều lĩnh vực và chủ đề khác nhau.

Các hệ thống AI như ChatGPT, Claude-AI và BingGPT có khả năng cập nhật và điều chỉnh dựa trên phản hồi của người dùng, giúp nâng cao hiệu suất và đảm bảo rằng chúng trả lời câu hỏi và yêu cầu của người dùng một cách hiệu quả.

Qua những khảo sát trên thì đề tài “Cộng đồng chia sẻ lộ trình học sử dụng

Reactjs, Flutter và Nestjs” của chúng em thực hiện sẽ đáp ứng được là một trang web tham khảo những chức năng nhiệm vụ chính như sau:

- Tạo ra nơi để mọi người trao đổi thảo luận một câu hỏi nào đó theo của từng thảo luận thắc mắc

- Tạo ra nơi để mọi người có thể tìm kiếm lộ trình học tham khảo giữa trên các công cụ như ChatGPT

- Phát triển các chức năng và giao diện thân thiện với người dùng, dễ sử dụng

- Phát triển các chức năng quản lý giúp tiện cho các quản trị viên và thống kê giúp dễ theo dõi, nắm sát tình hình.

CÔNG NGHỆ ÁP DỤNG TRONG DỰ ÁN

Prisma

MÔ HÌNH HÓA YÊU CẦU

Lược đồ Usecase

3.1.1 Phía khách và thành viên

Hình 7 Lược đồ Usecase phía khách và thành viên

Hình 8 Lược đồ Usecase phía quản trị viên

THIẾT KẾ PHẦN MỀM

Lược đồ tuần tự

CHƯƠNG 5 CÀI ĐẶT VÀ KIỂM THỬ

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

- Thiết kế cơ sở dữ liệu

- Tìm hiểu về Postgresql, MongoDB

- Tìm hiểu về cơ chế xác thực bằng Json Web Token

- Thiết kế giao diện trên Figma

- Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng Flutter đối với di động

- Hiện thực các giao diện trên Figma bằng React đối với web

- Kết nối backend, mobile, web, cơ sở dữ liệu

- Kiểm thử chương trình, sửa lỗi

- Viết và hoàn thiện báo cáo Ý kiến của giảng viên hướng dẫn Ngày tháng năm 2023

(Ký và ghi rõ họ tên) Người viết đề cương

(Ký và ghi rõ họ tên)

1 Tính cấp thiết của đề tài 1

5 Mục tiêu của đề tài 3

5.Ý nghĩa khoa học và thực tiễn 3

CHƯƠNG 1 KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 4

1.2.1 Yêu cầu chức năng hệ thống 8

1.2.2 Yêu cầu chức năng nghiệp vụ 10

1.2.3 Yêu cầu phi chức năng 13

CHƯƠNG 2 CÔNG NGHỆ ÁP DỤNG TRONG DỰ ÁN 14

2.1 Kiến trúc chung của hệ thống 14

2.2.2 Một số công nghệ áp dụng liên quan đến React JS 15

2.3.2 Cài đặt NestJS trong dự án 18

2.3.3 Cấu trúc của NestJS áp dung xây dựng Backend 19

2.4.3 Thuộc tính của WebSocket được sử dụng trong dự án 21

2.5.2 Tính năng của Prisma được sử dụng trong dự án 22

2.5.3 Cách xây dựng API REST với Prisma và PostgreSQL trong ứng dụng dư án 22 2.6 Postgresql 23

2.6.2 Tính năng của Postgresql áp dụng trong dự án 23

2.6.3 Cài đặt PostgreSQL 12 và công cụ quản lý pgAdmin 4 26

2.7.2 Cài đặt MongoDB và công cụ quản lý 26

2.8.2 Chức năng Claude AI áp dụng dự án 27

2.8.3 Cách sử dụng Claude AI 27

2.9.2 Chức năng OpenAI API áp dụng dự án 28

2.9.3 Cách sử dụng OpenAI API 29

2.10.2 Một số công nghệ áp dụng liên quan đến Flutter 30

2.11.2 Các tính năng chính của Firebase áp dụng vào dự án 31

CHƯƠNG 3 MÔ HÌNH HÓA YÊU CẦU 35

3.2 Mô hình hóa yêu cầu 37

CHƯƠNG 4 THIẾT KẾ PHẦN MỀM 79

4.1.1 Lược đồ tuần tự phía khách và thành viên 79

4.1.2 LƯỢC ĐỒ TUẦN TỰ PHÍA ADMIN 100

4.2.1 Chi tiết bảng dữ liệu 110

4.3.1 Giao diện chính phía khách và thành viên trên nền tảng web 122

4.3.2 Giao diện chính phía khách và thành viên trên nền tảng di động 145

4.3.3 Giao diện chính phía quản trị viên 171

CHƯƠNG 5 CÀI ĐẶT VÀ KIỂM THỬ 175

5.3.3 Quy trình thiết kế kiểm thử 179

Bảng 1 mô tả chức năng nghiệp vụ 12

Bảng 2 Bảng so sánh giữa Props và State 17

Bảng 3 Mô hình hóa Usecase “Đăng nhập” 37

Bảng 4 Mô hình hóa Usecase “Đăng ký” 38

Bảng 5 Mô hình hóa Usecase “Xem lộ trình học cá nhân” 39

Bảng 6 Mô hình hóa Usecase “Xem chủ đề khóa học” 40

Bảng 7 Mô hình hóa Usecase “Xem thảo luận” 41

Bảng 8: Mô hình hóa Usecase “Tìm kiếm thành viên” 42

Bảng 9: Mô hình hóa Usecase “Tìm kiếm câu hỏi thảo luận” 43

Bảng 10: Mô hình hóa Usecase “Lấy lại tài khoản” 43

Bảng 11: Mô hình hóa Usecase “Đổi mật khẩu” 44

Bảng 12 Mô hình hóa Usecase “Cập nhật thông tin cá nhân” 45

Bảng 13 Mô hình hóa Usecase “Xóa bài đăng lộ trình học” 46

Bảng 14 Mô hình hóa Usecase “Thêm bài đăng lộ trình học” 47

Bảng 15 Mô hình hóa Usecase “Chỉnh sửa bài đăng lộ trình học” 48

Bảng 16 Mô hình hóa Usecase “Bình luận bài đăng lộ trình học” 49

Bảng 17 Mô hình hóa Usecase “Báo cáo bài viết vi phạm” 50

Bảng 18 Mô hình hóa Usecase “Tạo lộ trình học” 51

Bảng 19 Mô hình hóa Usecase “Sửa lộ trình học” 52

Bảng 20 Mô hình hóa Usecase “Xóa lộ trình học” 53

Bảng 21 Mô hình hóa Usecase “Đánh giá lộ trình học” 54

Bảng 22 Mô hình hóa Usecase “Xem tin nhắn” 56

Bảng 23: Mô hình hóa Usecase “Tìm kiếm thành viên” 57

Bảng 24 Mô hình hóa Usecase “Thêm bài đăng cá nhân” 59

Bảng 25 Mô hình hóa Usecase “Báo cáo bài viết vi phạm” 62

Bảng 26 Mô hình hóa Usecase “Thêm tài khoản” 63

Bảng 27 Mô hình hóa Usecase “Xử lý tài khoản” 64

Bảng 28 Mô hình hóa Usecase “Sửa thông tin tài khoản” 65

Bảng 29 Mô hình hóa Usecase “Thêm chủ đề lộ trình học” 66

Bảng 30 Mô hình hóa Usecase “Sửa chủ đề lộ trình học” 67

Bảng 31 Mô hình hóa Usecase “Xóa chủ đề lộ trình học” 68

Bảng 32 Mô hình hóa Usecase “Thêm lộ trình học” 69

Bảng 33 Mô hình hóa Usecase “Sửa lộ trình học” 70

Bảng 34 Mô hình hóa Usecase “Xóa lộ trình học” 71

Bảng 35 Mô hình hóa Usecase “Xử lý câu hỏi vi phạm” 72

Bảng 36 Mô hình hóa Usecase “Xử lý câu trả lời vi phạm” 73

Bảng 37 Mô hình hóa Usecase “Thống kê danh sách chủ đề” 74

Bảng 38 Mô hình hóa Usecase “Thống kê danh sách thành viên” 75

Bảng 39 Mô hình hóa Usecase “Thống kê danh sách thành viên” 76

Bảng 40 Mô hình hóa Usecase “Thống kê danh sách cảnh báo vi phạm” 77

Bảng 41 Mô hình hóa Usecase “Thống kê danh sách lộ trình học” 77

Bảng 42 Chi tiết dữ liệu bảng User 111

Bảng 43 Chi tiết dữ liệu bảng UserInfo 112

Bảng 44 Chi tiết dữ liệu bảng Token 113

Bảng 45 Chi tiết dữ liệu bảng Follow 113

Bảng 46 Chi tiết dữ liệu bảng Question 114

Bảng 47 Chi tiết dữ liệu bảng Question 115

Bảng 48 Chi tiết dữ liệu bảng QuestionComment 116

Bảng 49 Chi tiết dữ liệu bảng QuestionReply 116

Bảng 50 Chi tiết dữ liệu bảng Privilege 117

Bảng 51 Chi tiết dữ liệu bảng Note 117

Bảng 52 Chi tiết dữ liệu bảng Category 118

Bảng 53 Chi tiết dữ liệu bảng Goal 118

Bảng 54 Chi tiết dữ liệu bảng GoalBranch 119

Bảng 55 Chi tiết dữ liệu bảng Roadmap 119

Bảng 56 Chi tiết dữ liệu bảng RoadmapDetails 120

Bảng 57 Chi tiết dữ liệu bảng Reprort 121

Bảng 58 Mô tả tính năng trang chủ 123

Bảng 59 Mô tả tính năng Trang đăng ký 124

Bảng 60 Mô tả tính năng Trang đăng nhập 125

Bảng 61 Mô tả tính năng trang quên mật khẩu 126

Bảng 62 Mô tả tính năng Trang cá nhân 128

Bảng 63 Mô tả tính năng Trang Note 129

Bảng 64 Mô tả tính năng Trang thư viện 131

Bảng 65 Mô tả tính năng drop down danh sách chọn cá nhân 132

Bảng 66 Mô tả tính năng Trang thay đổi mật khẩu 132

Bảng 67 Mô tả tính năng Trang chi tiết Lộ trình học 136

Bảng 68 Mô tả tính năng trang chi tiết đánh giá lộ trình học 137

Bảng 69 Mô tả tính năng trang thảo luận 140

Bảng 70 Mô tả tính năng trang đặt câu hỏi thảo luận 141

Bảng 71 Mô tả tính năng trang tạo lộ trình học bằng AI 144

Bảng 72 Bảng chiến lược kiểm thử 179

Bảng 73 Kết quả kiểm thử các chức năng chính 180

Hình 1 Khảo sát Chat GPT 4

Hình 2 Khảo sát Chat GPT 4

Hình 3 Khảo sát Chat GPT 5

Hình 5 Khảo sát Claude-AI 7

Hình 6 Kiến trúc hệ thống 14

Hình 7 Lược đồ Usecase phía khách và thành viên 36

Hình 8 Lược đồ Usecase phía quản trị viên 36

Hình 9 Lược đồ tuần tự chức năng “Đăng nhập” 79

Hình 10 Lược đồ tuần tự chức năng “Đăng ký” 80

Hình 11 Xem lộ trình học cá nhân 81

Hình 12 Xem trang cá nhân 82

Hình 14 Tìm kiếm thành viên 84

Hình 15 Lược đồ tuần tự chức năng tìm kiếm câu hỏi thảo luận 85

Hình 16 Lược đồ tuần tự chức năng lấy lại tài khoản 86

Hình 17 Lược đồ tuần tự chức năng đổi mật khẩu 87

Hình 18 Lược đồ tuần tự chức năng cập nhật thông tin cá nhân 88

Hình 19 Lược đồ tuần tự chức năng xóa câu hỏi thảo luận 89

Hình 20 Lược đồ tuần tự chức năng thêm câu hỏi thảo luận 90

Hình 21 Lược đồ tuần tự chức năng cập nhật câu hỏi thảo luận 91

Hình 22 Lược đồ tuần tự chức năng bình luận câu hỏi thảo luận 92

Hình 23 Lược đồ tuần tự chức năng chỉnh sửa bình luận bài đăng câu hỏi thảo luận 93

Hình 24 Lược đồ tuần tự chức năng xóa bình luận bài đăng câu hỏi thảo luận 94

Hình 25 Lược đồ tuần tự chức năng báo cáo bài viết vi phạm 95

Hình 26 Lược đồ tuần tự chức năng tạo lộ trình học 96

Hình 27 Lược đồ tuần tự chức năng Chỉnh sửa lộ trình học 97

Hình 28 Lược đồ tuần tự chức năng xóa lộ trình học 99

Hình 29 Tìm kiếm thành viên 99

Hình 30 Lược đồ tuần tự chức năng “thêm tài khoản” 100

Hình 31 Lược đồ tuần tự chức năng “sửa tài khoản” 101

Hình 32 Lược đồ tuần tự chức năng “Xử lý tài khoản” 102

Hình 33 Lược đồ tuần tự chức năng “Thêm loại vi phạm câu hỏi thảo luận” 103

Hình 34 Lược đồ tuần tự chức năng “Thêm loại vi phạm câu hỏi thảo luận” 104

Hình 35 Lược đồ tuần tự chức năng “Xóa loại vi phạm câu hỏi thảo luận” 105

Hình 36 Lược đồ tuần tự chức năng “Thêm loại vi phạm bình luận” 106

Hình 37 Lược đồ tuần tự chức năng “Chỉnh sửa loại vi phạm bình luận” 107

Hình 38 Lược đồ tuần tự chức năng “Xóa loại vi phạm bình luận” 108

Hình 39 Lược đồ tuần tự chức năng “Thống kê danh sách lộ trình học” 109

Hình 40 Lược đồ tuần tự chức năng “Thống kê tài khoản đăng ký mới” 109

Hình 42 Giao diện trang chủ 122

Hình 43 Giao diện Trang đăng ký 123

Hình 44 Giao diện Trang đăng nhập 125

Hình 45 Giao diện Trang quên mật khẩu 126

Hình 46 Giao diện Trang cá nhân 127

Hình 47 Giao diện Trang Note 129

Hình 48 Giao diện Trang thư viện 130

Hình 49 Giao diện drop down danh sách chọn cá nhân 131

Hình 50 Giao diện Trang thay đổi mật khẩu 132

Hình 51 Giao diện Trang Features 133

Hình 53 Giao diện Trang chi tiết Lộ trình học 135

Hình 54 Giao diện chi tiết đánh giá lộ trình học 137

Hình 55 Giao diện Trang chương trình lộ trình 138

Hình 56 Giao diện Trang Roadmap (chi tiết thông tin nội dung lộ trình học) 139

Hình 57 Giao diện Trang thảo luận 139

Hình 58 Giao diện Đặt câu hỏi thảo luận 140

Hình 59 Giao diện Trang chi tiết thảo luận 141

Hình 60 Giao diện bình luận câu hỏi thảo luận 142

Hình 61 Giao diện Trang tạo lộ trình học bằng AI 143

Hình 62 Giao diện trang Xếp hạng 144

Hình 64 Giao diện đăng nhập 146

Hình 65 Giao diện Sign Up 147

Hình 66 Giao diện quên mật khẩu 148

Hình 67 Đặt lại mật khẩu với email 149

Hình 68 Giao diện đặt lại mật khẩu với số điện thoại 150

Hình 69 Giao diện nhập mã Code xác thực 151

Hình 70 Giao diện trang chủ 152

Hình 71 Giao diện Trang cá nhân 153

Hình 72 Giao diện cài đặt 154

Hình 73 Cài đăt tài khoản 155

Hình 74 Giao diện cài đặt hỗ trợ 156

Hình 75 Giao diện cài đặt báo cáo ứng dụng 158

Hình 76 Giao diện trang thông báo 159

Hình 77 Giao diện trang tìm kiếm 160

Hình 78 Giao diện hiển thị tìm kiếm 161

Hình 79 Giao diện trang chia sẻ khoảnh khắc 162

Hình 80 Giao diện hiển thị story 163

Hình 81 Giao diện Pop up Bình luận 164

Hình 82 Giao diện trang đăng bài 165

Hình 83 Giao diện trang Chat với AI 1 166

Hình 84 Giao diện trang Chat với AI 2 167

Hình 85 Giao diện Trang Chat 168

Hình 86 Giao diện nhắn tin bạn bè 169

Hình 87 Giao diện Pop up nhắn tin 170

Hình 88 Giao diện admin chính 171

Hình 89 Giao diện quảng lý lộ trình học 171

Hình 90 Giao diện Quản lý câu hỏi 172

Hình 91 Quản lý người dùng 173

Hình 92 Giao diện admin login 174

1 Tính cấp thiết của đề tài

Xây dựng một trang cộng đồng chia sẻ lộ trình học là cần thiết trong thời đại số, khi thông tin và kiến thức được truyền tải qua mạng ngày càng phổ biến Trang web này cung cấp nguồn tài liệu đa dạng và dễ tiếp cận cho người học, giúp họ tìm kiếm thông tin và hướng dẫn trong các lĩnh vực cụ thể Điều này không chỉ nâng cao kiến thức và kỹ năng cá nhân mà còn thúc đẩy sự phát triển và sáng tạo Ứng dụng di động hỗ trợ trang web, cho phép người dùng chia sẻ nội dung, đặt câu hỏi và kết nối với nhau.

Đề tài cộng đồng chia sẻ lộ trình học AI Journey không chỉ kết nối người dùng mà còn tạo ra một môi trường học tập xã hội Tại đây, người dùng có thể tương tác, trao đổi ý kiến và học hỏi lẫn nhau, giúp kiến thức được truyền đạt một cách chủ động thông qua thảo luận và hợp tác.

Việc xây dựng cộng đồng học tập giúp tăng cường tính linh hoạt và cá nhân hóa trong quá trình học Người học có thể tùy chỉnh lộ trình học phù hợp với nhu cầu và mục tiêu cá nhân, từ đó tạo ra sự kiểm soát và tự quyết định trong việc học Điều này không chỉ khuyến khích đam mê mà còn tăng cường khả năng ứng dụng kiến thức vào thực tiễn.

Xây dựng một cộng đồng chia sẻ lộ trình học là cầu nối mạng xã hội hiệu quả giữa những người có chung mục đích Giáo viên và chuyên gia có thể tận dụng cộng đồng này để chia sẻ kiến thức, phát triển khóa học và tương tác tốt hơn với học sinh Điều này không chỉ cải thiện quá trình giảng dạy mà còn nâng cao trải nghiệm học tập cho người học.

Xây dựng một cộng đồng chia sẻ lộ trình học là yếu tố then chốt để nâng cao chất lượng giáo dục, đồng thời tạo ra môi trường học tập phong phú và hiệu quả.

Sự linh hoạt và kết nối đóng vai trò quan trọng trong việc thúc đẩy phát triển cá nhân, hỗ trợ học tập xã hội và tạo cơ hội cho mọi người học hỏi, chia sẻ kiến thức một cách toàn diện.

2 Đối tượng nghiên cứu Đối với đề tài “Cộng đồng chia sẻ lộ trình học sử dụng Reactjs, Flutter và

NestJS là một nền tảng nghiên cứu tập trung vào nhu cầu tìm kiếm của người dùng về giải pháp cho các câu hỏi cụ thể trong lộ trình học tập của một lĩnh vực nhất định Nền tảng này tạo ra môi trường lành mạnh cho việc thảo luận, đóng góp ý kiến và tìm kiếm câu trả lời cho những vấn đề mà người dùng gặp phải Các công nghệ được áp dụng để phát triển sản phẩm bao gồm:

Giao diện website được phát triển bằng React JS cùng với các thư viện hỗ trợ nhằm tối ưu hóa trải nghiệm người dùng và quản lý hệ thống hiệu quả.

- Về giao diện di động,

3 Phạm vi nghiên cứu Đề tài “Cộng đồng chia sẻ lộ trình học” chủ yếu tập trung khai thác vào việc đặt câu hỏi, tham gia thảo luận những vấn đề thắc mắc về các chủ đề trong cuộc sống và là nơi để tìm kiếm các lộ trình trong công việc cho mọi người Cộng đồng được tạo bởi 2 lên tảng web và di động

Cộng đồng được chia thành 2 phần là phần Quản trị và phần Người dùng Trong phần Quản trị bao gồm các nghiệp vụ chính như:

- Quản lý câu hỏi, câu trả lời

- Quản lý loại vi phạm

- Quản lý khoảnh khắc cá nhân

Trong phần Người dùng bao gồm các nghiệp vụ chính như:

- Đăng ký/ Đăng nhập/ Quên mật khẩu/ Đổi mật khẩu

- Tạo / Chỉnh sửa / Xóa/ Bình luận câu hỏi thảo luận

- Tạo / Chỉnh sửa / Xóa/ Bình luận bài đăng

- Tạo / Xóa khoảnh khắc cá nhân

- Tạo / Chỉnh sửa / Xóa lộ trình học cá nhân

- Tham gia thảo luận, theo dõi câu hỏi, bình chọn câu trả lời, phản hồi câu trả lời

- Tìm kiếm người dùng, câu hỏi, lộ trình, chủ đề liên quan

Về phần cốt lõi xử lý, xây dựng đầy đủ các APIs phục vụ cho phần hiển thị cuối cùng

5 Mục tiêu của đề tài

Người dùng có thể xây dựng một cộng đồng mạng xã hội để chia sẻ lộ trình, với các tính năng cơ bản như đặt câu hỏi, tham gia thảo luận, tìm kiếm lộ trình và câu hỏi, cũng như bình luận và chia sẻ nội dung cá nhân lên mạng xã hội.

Quản trị xây dựng là quá trình quản lý và theo dõi các tài nguyên, dữ liệu của hệ thống, bao gồm thống kê, quản lý tài khoản, quản lý vi phạm, quản lý chủ đề, quản lý lộ trình và quản lý bài đăng của người dùng.

5.Ý nghĩa khoa học và thực tiễn

Dự án này nhằm xây dựng một môi trường học tập trực tuyến, tạo điều kiện thuận lợi cho việc trao đổi thông tin, tìm kiếm tài liệu và nâng cao kiến thức cá nhân Đồng thời, nó cũng thúc đẩy khả năng tự học, giúp người dùng phát triển kỹ năng tự quản lý và tự rèn luyện, kết nối mọi người qua mạng xã hội.

PHẦN NỘI DUNG CHƯƠNG 1 KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU

- https://chat.openai.com/auth/login

Hình 1 Khảo sát Chat GPT

Hình 2 Khảo sát Chat GPT

Hình 3 Khảo sát Chat GPT Ưu điểm:

ChatGPT sử dụng mạng Neural Transformer để học hỏi và trả lời câu hỏi, giúp đáp ứng nhanh chóng và chính xác các yêu cầu của người dùng.

ChatGPT sở hữu kiến thức sâu rộng nhờ vào việc áp dụng deep learning trên một khối lượng lớn dữ liệu từ nhiều lĩnh vực khác nhau Điều này cho phép nó cung cấp câu trả lời chính xác và đầy đủ cho mọi câu hỏi mà người dùng đặt ra, bất kể chủ đề nào.

ChatGPT có khả năng tương tác tự nhiên, giúp dẫn dắt các cuộc hội thoại một cách giống người thật Điều này mang lại cảm giác dễ chịu và thoải mái cho người dùng khi trò chuyện.

 Mở rộng kiến thức: Không chỉ được tiếp cận với nhiều nguồn dữ liệu,

CÀI ĐẶT VÀ KIỂM THỬ

Cài đặt ứng dụng

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

- Thiết kế cơ sở dữ liệu

- Tìm hiểu về Postgresql, MongoDB

- Tìm hiểu về cơ chế xác thực bằng Json Web Token

- Thiết kế giao diện trên Figma

- Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng Flutter đối với di động

- Hiện thực các giao diện trên Figma bằng React đối với web

- Kết nối backend, mobile, web, cơ sở dữ liệu

- Kiểm thử chương trình, sửa lỗi

- Viết và hoàn thiện báo cáo Ý kiến của giảng viên hướng dẫn Ngày tháng năm 2023

(Ký và ghi rõ họ tên) Người viết đề cương

(Ký và ghi rõ họ tên)

1 Tính cấp thiết của đề tài 1

5 Mục tiêu của đề tài 3

5.Ý nghĩa khoa học và thực tiễn 3

CHƯƠNG 1 KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 4

1.2.1 Yêu cầu chức năng hệ thống 8

1.2.2 Yêu cầu chức năng nghiệp vụ 10

1.2.3 Yêu cầu phi chức năng 13

CHƯƠNG 2 CÔNG NGHỆ ÁP DỤNG TRONG DỰ ÁN 14

2.1 Kiến trúc chung của hệ thống 14

2.2.2 Một số công nghệ áp dụng liên quan đến React JS 15

2.3.2 Cài đặt NestJS trong dự án 18

2.3.3 Cấu trúc của NestJS áp dung xây dựng Backend 19

2.4.3 Thuộc tính của WebSocket được sử dụng trong dự án 21

2.5.2 Tính năng của Prisma được sử dụng trong dự án 22

2.5.3 Cách xây dựng API REST với Prisma và PostgreSQL trong ứng dụng dư án 22 2.6 Postgresql 23

2.6.2 Tính năng của Postgresql áp dụng trong dự án 23

2.6.3 Cài đặt PostgreSQL 12 và công cụ quản lý pgAdmin 4 26

2.7.2 Cài đặt MongoDB và công cụ quản lý 26

2.8.2 Chức năng Claude AI áp dụng dự án 27

2.8.3 Cách sử dụng Claude AI 27

2.9.2 Chức năng OpenAI API áp dụng dự án 28

2.9.3 Cách sử dụng OpenAI API 29

2.10.2 Một số công nghệ áp dụng liên quan đến Flutter 30

2.11.2 Các tính năng chính của Firebase áp dụng vào dự án 31

CHƯƠNG 3 MÔ HÌNH HÓA YÊU CẦU 35

3.2 Mô hình hóa yêu cầu 37

CHƯƠNG 4 THIẾT KẾ PHẦN MỀM 79

4.1.1 Lược đồ tuần tự phía khách và thành viên 79

4.1.2 LƯỢC ĐỒ TUẦN TỰ PHÍA ADMIN 100

4.2.1 Chi tiết bảng dữ liệu 110

4.3.1 Giao diện chính phía khách và thành viên trên nền tảng web 122

4.3.2 Giao diện chính phía khách và thành viên trên nền tảng di động 145

4.3.3 Giao diện chính phía quản trị viên 171

CHƯƠNG 5 CÀI ĐẶT VÀ KIỂM THỬ 175

5.3.3 Quy trình thiết kế kiểm thử 179

Bảng 1 mô tả chức năng nghiệp vụ 12

Bảng 2 Bảng so sánh giữa Props và State 17

Bảng 3 Mô hình hóa Usecase “Đăng nhập” 37

Bảng 4 Mô hình hóa Usecase “Đăng ký” 38

Bảng 5 Mô hình hóa Usecase “Xem lộ trình học cá nhân” 39

Bảng 6 Mô hình hóa Usecase “Xem chủ đề khóa học” 40

Bảng 7 Mô hình hóa Usecase “Xem thảo luận” 41

Bảng 8: Mô hình hóa Usecase “Tìm kiếm thành viên” 42

Bảng 9: Mô hình hóa Usecase “Tìm kiếm câu hỏi thảo luận” 43

Bảng 10: Mô hình hóa Usecase “Lấy lại tài khoản” 43

Bảng 11: Mô hình hóa Usecase “Đổi mật khẩu” 44

Bảng 12 Mô hình hóa Usecase “Cập nhật thông tin cá nhân” 45

Bảng 13 Mô hình hóa Usecase “Xóa bài đăng lộ trình học” 46

Bảng 14 Mô hình hóa Usecase “Thêm bài đăng lộ trình học” 47

Bảng 15 Mô hình hóa Usecase “Chỉnh sửa bài đăng lộ trình học” 48

Bảng 16 Mô hình hóa Usecase “Bình luận bài đăng lộ trình học” 49

Bảng 17 Mô hình hóa Usecase “Báo cáo bài viết vi phạm” 50

Bảng 18 Mô hình hóa Usecase “Tạo lộ trình học” 51

Bảng 19 Mô hình hóa Usecase “Sửa lộ trình học” 52

Bảng 20 Mô hình hóa Usecase “Xóa lộ trình học” 53

Bảng 21 Mô hình hóa Usecase “Đánh giá lộ trình học” 54

Bảng 22 Mô hình hóa Usecase “Xem tin nhắn” 56

Bảng 23: Mô hình hóa Usecase “Tìm kiếm thành viên” 57

Bảng 24 Mô hình hóa Usecase “Thêm bài đăng cá nhân” 59

Bảng 25 Mô hình hóa Usecase “Báo cáo bài viết vi phạm” 62

Bảng 26 Mô hình hóa Usecase “Thêm tài khoản” 63

Bảng 27 Mô hình hóa Usecase “Xử lý tài khoản” 64

Bảng 28 Mô hình hóa Usecase “Sửa thông tin tài khoản” 65

Bảng 29 Mô hình hóa Usecase “Thêm chủ đề lộ trình học” 66

Bảng 30 Mô hình hóa Usecase “Sửa chủ đề lộ trình học” 67

Bảng 31 Mô hình hóa Usecase “Xóa chủ đề lộ trình học” 68

Bảng 32 Mô hình hóa Usecase “Thêm lộ trình học” 69

Bảng 33 Mô hình hóa Usecase “Sửa lộ trình học” 70

Bảng 34 Mô hình hóa Usecase “Xóa lộ trình học” 71

Bảng 35 Mô hình hóa Usecase “Xử lý câu hỏi vi phạm” 72

Bảng 36 Mô hình hóa Usecase “Xử lý câu trả lời vi phạm” 73

Bảng 37 Mô hình hóa Usecase “Thống kê danh sách chủ đề” 74

Bảng 38 Mô hình hóa Usecase “Thống kê danh sách thành viên” 75

Bảng 39 Mô hình hóa Usecase “Thống kê danh sách thành viên” 76

Bảng 40 Mô hình hóa Usecase “Thống kê danh sách cảnh báo vi phạm” 77

Bảng 41 Mô hình hóa Usecase “Thống kê danh sách lộ trình học” 77

Bảng 42 Chi tiết dữ liệu bảng User 111

Bảng 43 Chi tiết dữ liệu bảng UserInfo 112

Bảng 44 Chi tiết dữ liệu bảng Token 113

Bảng 45 Chi tiết dữ liệu bảng Follow 113

Bảng 46 Chi tiết dữ liệu bảng Question 114

Bảng 47 Chi tiết dữ liệu bảng Question 115

Bảng 48 Chi tiết dữ liệu bảng QuestionComment 116

Bảng 49 Chi tiết dữ liệu bảng QuestionReply 116

Bảng 50 Chi tiết dữ liệu bảng Privilege 117

Bảng 51 Chi tiết dữ liệu bảng Note 117

Bảng 52 Chi tiết dữ liệu bảng Category 118

Bảng 53 Chi tiết dữ liệu bảng Goal 118

Bảng 54 Chi tiết dữ liệu bảng GoalBranch 119

Bảng 55 Chi tiết dữ liệu bảng Roadmap 119

Bảng 56 Chi tiết dữ liệu bảng RoadmapDetails 120

Bảng 57 Chi tiết dữ liệu bảng Reprort 121

Bảng 58 Mô tả tính năng trang chủ 123

Bảng 59 Mô tả tính năng Trang đăng ký 124

Bảng 60 Mô tả tính năng Trang đăng nhập 125

Bảng 61 Mô tả tính năng trang quên mật khẩu 126

Bảng 62 Mô tả tính năng Trang cá nhân 128

Bảng 63 Mô tả tính năng Trang Note 129

Bảng 64 Mô tả tính năng Trang thư viện 131

Bảng 65 Mô tả tính năng drop down danh sách chọn cá nhân 132

Bảng 66 Mô tả tính năng Trang thay đổi mật khẩu 132

Bảng 67 Mô tả tính năng Trang chi tiết Lộ trình học 136

Bảng 68 Mô tả tính năng trang chi tiết đánh giá lộ trình học 137

Bảng 69 Mô tả tính năng trang thảo luận 140

Bảng 70 Mô tả tính năng trang đặt câu hỏi thảo luận 141

Bảng 71 Mô tả tính năng trang tạo lộ trình học bằng AI 144

Bảng 72 Bảng chiến lược kiểm thử 179

Bảng 73 Kết quả kiểm thử các chức năng chính 180

Hình 1 Khảo sát Chat GPT 4

Hình 2 Khảo sát Chat GPT 4

Hình 3 Khảo sát Chat GPT 5

Hình 5 Khảo sát Claude-AI 7

Hình 6 Kiến trúc hệ thống 14

Hình 7 Lược đồ Usecase phía khách và thành viên 36

Hình 8 Lược đồ Usecase phía quản trị viên 36

Hình 9 Lược đồ tuần tự chức năng “Đăng nhập” 79

Hình 10 Lược đồ tuần tự chức năng “Đăng ký” 80

Hình 11 Xem lộ trình học cá nhân 81

Hình 12 Xem trang cá nhân 82

Hình 14 Tìm kiếm thành viên 84

Hình 15 Lược đồ tuần tự chức năng tìm kiếm câu hỏi thảo luận 85

Hình 16 Lược đồ tuần tự chức năng lấy lại tài khoản 86

Hình 17 Lược đồ tuần tự chức năng đổi mật khẩu 87

Hình 18 Lược đồ tuần tự chức năng cập nhật thông tin cá nhân 88

Hình 19 Lược đồ tuần tự chức năng xóa câu hỏi thảo luận 89

Hình 20 Lược đồ tuần tự chức năng thêm câu hỏi thảo luận 90

Hình 21 Lược đồ tuần tự chức năng cập nhật câu hỏi thảo luận 91

Hình 22 Lược đồ tuần tự chức năng bình luận câu hỏi thảo luận 92

Hình 23 Lược đồ tuần tự chức năng chỉnh sửa bình luận bài đăng câu hỏi thảo luận 93

Hình 24 Lược đồ tuần tự chức năng xóa bình luận bài đăng câu hỏi thảo luận 94

Hình 25 Lược đồ tuần tự chức năng báo cáo bài viết vi phạm 95

Hình 26 Lược đồ tuần tự chức năng tạo lộ trình học 96

Hình 27 Lược đồ tuần tự chức năng Chỉnh sửa lộ trình học 97

Hình 28 Lược đồ tuần tự chức năng xóa lộ trình học 99

Hình 29 Tìm kiếm thành viên 99

Hình 30 Lược đồ tuần tự chức năng “thêm tài khoản” 100

Hình 31 Lược đồ tuần tự chức năng “sửa tài khoản” 101

Hình 32 Lược đồ tuần tự chức năng “Xử lý tài khoản” 102

Hình 33 Lược đồ tuần tự chức năng “Thêm loại vi phạm câu hỏi thảo luận” 103

Hình 34 Lược đồ tuần tự chức năng “Thêm loại vi phạm câu hỏi thảo luận” 104

Hình 35 Lược đồ tuần tự chức năng “Xóa loại vi phạm câu hỏi thảo luận” 105

Hình 36 Lược đồ tuần tự chức năng “Thêm loại vi phạm bình luận” 106

Hình 37 Lược đồ tuần tự chức năng “Chỉnh sửa loại vi phạm bình luận” 107

Hình 38 Lược đồ tuần tự chức năng “Xóa loại vi phạm bình luận” 108

Hình 39 Lược đồ tuần tự chức năng “Thống kê danh sách lộ trình học” 109

Hình 40 Lược đồ tuần tự chức năng “Thống kê tài khoản đăng ký mới” 109

Hình 42 Giao diện trang chủ 122

Hình 43 Giao diện Trang đăng ký 123

Hình 44 Giao diện Trang đăng nhập 125

Hình 45 Giao diện Trang quên mật khẩu 126

Hình 46 Giao diện Trang cá nhân 127

Hình 47 Giao diện Trang Note 129

Hình 48 Giao diện Trang thư viện 130

Hình 49 Giao diện drop down danh sách chọn cá nhân 131

Hình 50 Giao diện Trang thay đổi mật khẩu 132

Hình 51 Giao diện Trang Features 133

Hình 53 Giao diện Trang chi tiết Lộ trình học 135

Hình 54 Giao diện chi tiết đánh giá lộ trình học 137

Hình 55 Giao diện Trang chương trình lộ trình 138

Hình 56 Giao diện Trang Roadmap (chi tiết thông tin nội dung lộ trình học) 139

Hình 57 Giao diện Trang thảo luận 139

Hình 58 Giao diện Đặt câu hỏi thảo luận 140

Hình 59 Giao diện Trang chi tiết thảo luận 141

Hình 60 Giao diện bình luận câu hỏi thảo luận 142

Hình 61 Giao diện Trang tạo lộ trình học bằng AI 143

Hình 62 Giao diện trang Xếp hạng 144

Hình 64 Giao diện đăng nhập 146

Hình 65 Giao diện Sign Up 147

Hình 66 Giao diện quên mật khẩu 148

Hình 67 Đặt lại mật khẩu với email 149

Hình 68 Giao diện đặt lại mật khẩu với số điện thoại 150

Hình 69 Giao diện nhập mã Code xác thực 151

Hình 70 Giao diện trang chủ 152

Hình 71 Giao diện Trang cá nhân 153

Hình 72 Giao diện cài đặt 154

Hình 73 Cài đăt tài khoản 155

Hình 74 Giao diện cài đặt hỗ trợ 156

Hình 75 Giao diện cài đặt báo cáo ứng dụng 158

Hình 76 Giao diện trang thông báo 159

Hình 77 Giao diện trang tìm kiếm 160

Hình 78 Giao diện hiển thị tìm kiếm 161

Hình 79 Giao diện trang chia sẻ khoảnh khắc 162

Hình 80 Giao diện hiển thị story 163

Hình 81 Giao diện Pop up Bình luận 164

Hình 82 Giao diện trang đăng bài 165

Hình 83 Giao diện trang Chat với AI 1 166

Hình 84 Giao diện trang Chat với AI 2 167

Hình 85 Giao diện Trang Chat 168

Hình 86 Giao diện nhắn tin bạn bè 169

Hình 87 Giao diện Pop up nhắn tin 170

Hình 88 Giao diện admin chính 171

Hình 89 Giao diện quảng lý lộ trình học 171

Hình 90 Giao diện Quản lý câu hỏi 172

Hình 91 Quản lý người dùng 173

Hình 92 Giao diện admin login 174

1 Tính cấp thiết của đề tài

Xây dựng một trang cộng đồng chia sẻ lộ trình học là cần thiết trong thời đại số, khi thông tin và kiến thức được truyền tải qua mạng ngày càng phổ biến Trang web này cung cấp nguồn tài liệu đa dạng, dễ dàng truy cập cho người học, giúp họ tìm hiểu các lĩnh vực cụ thể và nâng cao kỹ năng Điều này không chỉ gia tăng kiến thức cá nhân mà còn thúc đẩy sự phát triển và sáng tạo Ứng dụng di động hỗ trợ trang web, cho phép người dùng chia sẻ nội dung, đặt câu hỏi và kết nối với nhau.

Đề tài cộng đồng chia sẻ lộ trình học AI Journey không chỉ kết nối người dùng mà còn xây dựng một cộng đồng học tập mạnh mẽ Người dùng có cơ hội tương tác, trao đổi ý kiến và học hỏi lẫn nhau, tạo ra một môi trường học tập xã hội năng động Kiến thức được truyền đạt không chỉ qua hình thức thụ động mà còn thông qua thảo luận và hợp tác, thúc đẩy sự phát triển cá nhân và tập thể.

Việc xây dựng cộng đồng học tập giúp nâng cao tính linh hoạt và cá nhân hóa trong quá trình học Người học có thể điều chỉnh lộ trình học tập theo nhu cầu và mục tiêu riêng, từ đó tạo ra sự kiểm soát và tự quyết định Điều này không chỉ khuyến khích đam mê mà còn thúc đẩy ứng dụng thực tế trong việc học.

Xây dựng một cộng đồng chia sẻ lộ trình học không chỉ kết nối mọi người có chung mục đích mà còn tạo cơ hội cho giáo viên và chuyên gia chia sẻ kiến thức, phát triển khóa học và tương tác hiệu quả với học sinh Điều này góp phần cải thiện quá trình giảng dạy và học tập.

Việc xây dựng một cộng đồng chia sẻ lộ trình học là rất quan trọng để nâng cao chất lượng giáo dục và tạo ra một môi trường học tập phong phú.

Sự linh hoạt và kết nối đóng vai trò quan trọng trong việc thúc đẩy phát triển cá nhân và hỗ trợ học tập xã hội, đồng thời tạo cơ hội cho mọi người học hỏi và chia sẻ kiến thức một cách toàn diện.

2 Đối tượng nghiên cứu Đối với đề tài “Cộng đồng chia sẻ lộ trình học sử dụng Reactjs, Flutter và

NestJS là một nền tảng nghiên cứu dựa trên nhu cầu tìm kiếm của người dùng về giải pháp cho các câu hỏi cụ thể trong lộ trình học tập của một lĩnh vực nhất định Nó tạo ra một môi trường tích cực cho việc thảo luận, góp ý, và tìm kiếm câu trả lời cho những vấn đề mà người dùng gặp phải Các công nghệ được áp dụng để phát triển sản phẩm bao gồm:

Giao diện website được phát triển bằng React JS cùng với các thư viện hỗ trợ, nhằm tối ưu hóa việc xây dựng và xử lý giao diện người dùng cũng như hệ thống quản trị.

- Về giao diện di động,

3 Phạm vi nghiên cứu Đề tài “Cộng đồng chia sẻ lộ trình học” chủ yếu tập trung khai thác vào việc đặt câu hỏi, tham gia thảo luận những vấn đề thắc mắc về các chủ đề trong cuộc sống và là nơi để tìm kiếm các lộ trình trong công việc cho mọi người Cộng đồng được tạo bởi 2 lên tảng web và di động

Cộng đồng được chia thành 2 phần là phần Quản trị và phần Người dùng Trong phần Quản trị bao gồm các nghiệp vụ chính như:

- Quản lý câu hỏi, câu trả lời

- Quản lý loại vi phạm

- Quản lý khoảnh khắc cá nhân

Trong phần Người dùng bao gồm các nghiệp vụ chính như:

- Đăng ký/ Đăng nhập/ Quên mật khẩu/ Đổi mật khẩu

- Tạo / Chỉnh sửa / Xóa/ Bình luận câu hỏi thảo luận

- Tạo / Chỉnh sửa / Xóa/ Bình luận bài đăng

- Tạo / Xóa khoảnh khắc cá nhân

- Tạo / Chỉnh sửa / Xóa lộ trình học cá nhân

- Tham gia thảo luận, theo dõi câu hỏi, bình chọn câu trả lời, phản hồi câu trả lời

- Tìm kiếm người dùng, câu hỏi, lộ trình, chủ đề liên quan

Về phần cốt lõi xử lý, xây dựng đầy đủ các APIs phục vụ cho phần hiển thị cuối cùng

5 Mục tiêu của đề tài

Người dùng có thể xây dựng một cộng đồng mạng xã hội để chia sẻ lộ trình, với các tính năng cơ bản như đặt câu hỏi, tham gia thảo luận, tìm kiếm lộ trình và câu hỏi, cũng như bình luận và chia sẻ nội dung cá nhân lên nền tảng xã hội.

Quản trị xây dựng đóng vai trò quan trọng trong việc quản lý và theo dõi các tài nguyên cùng dữ liệu của hệ thống, bao gồm thống kê, quản lý tài khoản, xử lý vi phạm, quản lý chủ đề, lộ trình và bài đăng của người dùng.

5.Ý nghĩa khoa học và thực tiễn

Dự án này nhằm xây dựng một môi trường học tập trực tuyến thuận lợi cho việc trao đổi thông tin, tìm kiếm tài liệu và nâng cao kiến thức cá nhân Ngoài ra, nó còn thúc đẩy khả năng tự học, giúp người dùng phát triển kỹ năng tự quản lý và tự rèn luyện, đồng thời kết nối mọi người qua mạng xã hội.

PHẦN NỘI DUNG CHƯƠNG 1 KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU

- https://chat.openai.com/auth/login

Hình 1 Khảo sát Chat GPT

Hình 2 Khảo sát Chat GPT

Hình 3 Khảo sát Chat GPT Ưu điểm:

ChatGPT sử dụng mạng Neural Transformer để học hỏi và trả lời câu hỏi, giúp đáp ứng nhanh chóng và chính xác các yêu cầu của người dùng.

ChatGPT sở hữu kiến thức sâu rộng nhờ vào việc áp dụng deep learning trên một khối lượng lớn dữ liệu từ nhiều lĩnh vực khác nhau Điều này giúp nó có khả năng cung cấp câu trả lời chính xác cho mọi câu hỏi mà người dùng đặt ra, bất kể chủ đề nào.

ChatGPT có khả năng tương tác tự nhiên, dẫn dắt các cuộc hội thoại một cách giống như con người, mang lại cảm giác dễ chịu và thoải mái cho người dùng khi trò chuyện.

 Mở rộng kiến thức: Không chỉ được tiếp cận với nhiều nguồn dữ liệu,

Ưu điểm

4.Đề nghị cho bảo vệ hay không?

Tp Hồ Chí Minh, ngày tháng năm 2024

(Ký & ghi rõ họ tên)

Chúng em xin gửi lời cảm ơn chân thành và sâu sắc tới các thầy cô trong khoa Công Nghệ Thông Tin của Trường Đại Học Sư Phạm.

Kỹ Thuật Thành Phố Hồ Chí Minh, đã tận tình truyền đạt kiến thức trong học tập, để chúng em có thể hoàn thành tốt đề tài này

Chúng em xin chân thành cảm ơn cô Mai Anh Thơ, giảng viên đã tận tâm hướng dẫn và hỗ trợ nhóm trong suốt quá trình học tập và thực hiện đề tài Sự chỉ bảo nhiệt tình của cô từ những ngày đầu cho đến khi hoàn thành đã giúp chúng em vượt qua nhiều khó khăn.

Nhờ nền tảng kiến thức chuyên ngành vững chắc và kinh nghiệm thực tế từ thực tập, chúng em đã tích lũy được khối lượng kiến thức và kinh nghiệm lớn trong lĩnh vực công nghệ phần mềm Sự hỗ trợ tận tình từ cô Mai Anh Thơ cùng các thầy cô trong khoa Công Nghệ Thông Tin đã giúp chúng em hoàn thành đề tài này Đây sẽ là hành trang quý báu mà thầy cô dành tặng nhóm trước khi chúng em bước vào giai đoạn mới của cuộc đời.

Mặc dù nhóm thực hiện đã nỗ lực hết mình để hoàn thành sản phẩm, nhưng do lượng kiến thức vô tận và khả năng hạn chế, việc xảy ra thiếu sót là điều khó tránh khỏi Chúng em rất mong nhận được những góp ý quý báu từ các thầy cô để rút ra bài học kinh nghiệm và cải thiện sản phẩm Đặc biệt, chúng em xin gửi lời cảm ơn chân thành đến cô – giảng viên - TS Mai Anh Thơ, nhờ sự hỗ trợ của cô, chúng em hy vọng sẽ hoàn thành báo cáo và triển khai sản phẩm một cách tốt nhất.

Chúng em xin chân thành cảm ơn!

Nhóm sinh viên thực hiện Đinh Văn Toàn Nguyễn Văn Ninh ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP

Họ và Tên SV thực hiện 1: Nguyễn Văn Ninh Mã Số SV: 20110172

Họ và Tên SV thực hiện 2: Đinh Văn Toàn Mã Số SV: 20110738

Thời gian làm luận văn: Từ 12/02/2024 đến 20/06/2024

Chuyên ngành: Công nghệ phần mềm

Tên luận văn: Xây dựng hệ thống cộng đồng chia sẻ lộ trình học AI JOURNEY Giảng viên hướng dẫn: TS Mai Anh Thơ

Nhiệm vụ của luận văn:

- Tìm hiểu về các công nghệ: ReactJS, Flutter, Dart, Nestjs, Websocket, Prisma, Postgresql, AI Api, Swagger, Figma, Firebase Storage, JSON Web Token…

- Sử dụng thư viện React để thiết kế và xử lý giao diện web cho người dùng thao tác

- Sử dụng thư viện Flutter để thiết kế và xử lý giao diện di động cho người dùng thao tác

- Sử dụng Postgresql, MongoDB để lưu trữ dữ liệu người dùng của hệ thống

- Sử dụng framewwork NestJS để phát triển backend

- Sử dụng JSON Web Token để xác thực, phân quyền

- Sử dụng Figma để thiết kế giao diện cho ứng dụng

- Sử dụng Firebase để thông báo hoạt động trên ứng dụng di động Đề cương viết luận văn:

1.Tính cấp thiết của đề tài

4.Mục tiêu của đề tài

5.Ý nghĩa khoa học và thực tiễn

CHƯƠNG 1 KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU

CHƯƠNG 2 CÔNG NGHỆ ÁP DỤNG TRONG DỰ ÁN

2.1.Kiến trúc chung của hệ thống

CHƯƠNG 3 MÔ HÌNH HÓA YÊU CẦU

3.2 Mô hình hóa yêu cầu

CHƯƠNG 4 THIẾT KẾ PHẦN MỀM

CHƯƠNG 5 CÀI ĐẶT VÀ KIỂM THỬ

Ngày đăng: 19/12/2024, 14:37

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

w