TRƯỜNG ĐẠI HỌC KINH TẾ QUỐC DÂN
TRƯỜNG CÔNG NGHỆ
----------------
KHÓA LUẬN TỐT NGHIỆP
Website học tập đa môn học thông qua các trò
chơi
Tên sinh viên : Phạm Sỹ Nguyên
Giảng viên hướng dẫn : Nguyễn Trung Tuấn
Hà Nội, 8/2024
2024.1 CÔNG NGHỆ THÔNG TIN PHẠM SỸ NGUYÊN 11214470
TRƯỜNG ĐẠI HỌC KINH TẾ QUỐC DÂN
TRƯỜNG CÔNG NGHỆ
----------------
KHÓA LUẬN TỐT NGHIỆP
Website học tập đa môn học thông qua các trò chơi
Tên sinh viên : Phạm Sỹ Nguyên
Mã sinh viên : 11214470
Lớp : Công nghệ thông tin K63
Ngành : Công nghệ thông tin
Khoa : Công nghệ thông tin
Giảng viên hướng dẫn : Nguyễn Trung Tuấn
(Chữ ký GVHD)
Hà Nội, 8/2024
1
MỤC LỤC
MỤC LỤC .....................................................................................................................................1
LỜI CAM ĐOAN .........................................................................................................................4
LỜI CẢM ƠN ...............................................................................................................................5
DANH MỤC CÁC TỪ VIẾT TẮT .............................................................................................6
DANH MỤC BẢNG, BIỂU ĐỒ ..................................................................................................7
DANH MỤC HÌNH ......................................................................................................................8
MỞ ĐẦU .......................................................................................................................................1
Chương I: Tổng quát về đề tài ....................................................................................................3
1.1. Lý do chọn đề tài .............................................................................................................3
1.1.1.Thực trạng mô hình học tập trực tuyến nói chung ...................................................3
1.1.2. Nhu cầu đối với mô hình học tập sử dụng nội dung ngắn .......................................4
1.2. Mục đích ..........................................................................................................................4
1.3. Đối tượng và phạm vi nghiên cứu ................................................................................5
1.4. Ý nghĩa khoa học và tính thực tiễn ...............................................................................5
1.4.1. Ý nghĩa khoa học ....................................................................................................5
1.4.2. Ý nghĩa thực tiễn .....................................................................................................6
1.5. Yêu cầu nghiệp vụ...........................................................................................................6
CHƯƠNG 2. CƠ SỞ LÝ THUYẾT ............................................................................................8
2.1. Ngôn ngữ triển khai ........................................................................................................8
2.1.1. FrontEnd .................................................................................................................8
2.1.1.1 ReactJs ............................................................................................................8
2.1.1.2 NextJs .............................................................................................................9
2.1.1.3 CSS và SCSS ................................................................................................10
2.1.2. BackEnd ................................................................................................................12
2.1.2.1. NodeJs .........................................................................................................12
2.1.2.2. NotionAPI ....................................................................................................12
2.1.2.3. Kết hợp Node.js và Notion API trong dự án ...............................................13
2.1.2.4.FireBase ........................................................................................................13
2.1.3. Các công nghệ hỗ trợ khác ....................................................................................15
2.1.3.1. Bootstrap ......................................................................................................15
2.1.3.2. Axios............................................................................................................15
2.1.3.3. DomPurify ..........................................................................................................15
2.1.3.4. i18n, i18next ................................................................................................15
2.2. Các giải pháp trước đây ...............................................................................................16
CHƯƠNG 3. PHÂN TÍCH THIẾT KẾ HỆ THỐNG .............................................................18
3.1. Mô tả bài toán ...............................................................................................................18
3.2. Đặc tả chức năng ...........................................................................................................19
3.2.1.Đăng kí .........................................................................................................................19
3.2.2.Đăng nhập ..............................................................................................................19
3.2.3. Đăng xuất ..............................................................................................................20
3.2.4.Xem nội dung bài học ............................................................................................20
2
3.2.5.Tìm kiếm nội dung bài học ....................................................................................21
3.2.6.Sử dụng Flashcard ..................................................................................................22
3.2.7.Làm trắc nghiệm ....................................................................................................22
3.2.8.Làm bài Kéo Thả ....................................................................................................23
3.2.9.Làm bài xếp câu .....................................................................................................23
3.2.10.Làm bài điền vào ô trống .....................................................................................24
3.2.11.Cập nhật thông tin người dùng .............................................................................24
3.2.12.Làm Thử Thách ....................................................................................................25
3.2.13.Quản lý thông tin cá nhân ....................................................................................25
3.2.14.Xem lịch sử làm bài .............................................................................................26
3.2.15.Xem Bảng xếp hạng .............................................................................................26
3.2.16.Theo dõi chuỗi học ...............................................................................................27
3.2.17.Quản lý người dùng..............................................................................................27
3.2.18. Danh sách yêu thích ............................................................................ 28
3.3. Biểu đồ phân tích thiết kế hệ thống .............................................................................29
3.3.1. UseCase tổng quát .................................................................................................29
3.3.2.Biểu đồ UseCase Phân Rã ......................................................................................29
3.4.Phân tích cấu trúc ..........................................................................................................32
3.4.1 Biểu đồ lớp chi tiết của hệ thống............................................................................32
3.4.2.Phân tích hành vi ....................................................................................................33
3.4.2.1. Biểu đồ trình tự chức năng đăng ký tài khoản của người dùng ...................33
3.4.2.2. Biểu đồ trình tự chức năng cập nhật thông tin cá nhân của user .................34
3.4.2.3. Biểu đồ trình tự chức năng báo cáo vi phạm của user .................................34
3.4.2.4. Biểu đồ trình tự chức năng xử lý báo cáo của admin ..................................35
3.4.2.5. Biểu đồ trình tự chức năng xử lý đúng sai của trò chơi ................. 35
3.5.Biểu đồ hoạt động ........................................................................................... 36
3.6.Thiết kế cơ sở dữ liệu ....................................................................................................38
CHƯƠNG 4 : CÀI ĐẶT, THỬ NGHIỆM VÀ ĐÁNH GIÁ ...................................................45
4.1 Cài đặt, triển khai sản phẩm ........................................................................................45
4.2. Sử dụng thử nghiệm sản phẩm ...................................................................... 45
4.2.1. Một số giao diện chung: ........................................................................................45
4.2.1.2 Trang chủ ......................................................................................................45
4.2.1.3. Trang môn học .............................................................................................46
4.2.1.4. Trang Flashcard ...........................................................................................46
4.2.1.5. Trang điền vào ô trống ................................................................................47
4.2.1.6. Trang trắc nghiệm ........................................................................................47
4.2.1.7. Trang kéo thả ...............................................................................................48
4.2.1.8. Bảng đăng nhập ...........................................................................................49
4.2.1.9. Bảng đăng ký ...............................................................................................49
4.2.2. Giao diện dành cho người dùng vãng lai ( Guest ) ...............................................50
4.2.2.1. Thanh điều hướng trên .................................................................................50
4.2.3. Giao diện dành cho người dùng ( User ) ...............................................................50
4.2.3.1. Trang Challenge ..........................................................................................50
4.2.3.2. Trang Profile ................................................................................................50
3
4.2.3.3. Trang Leaderboard ......................................................................................51
4.2.3.4. Trang Chuỗi ( Streak ) .................................................................................51
4.2.3.5. Trang Cài đặt ( Setting ) ..............................................................................52
4.2.3.6. Trang Lịch sử ( History ) .............................................................................52
4.2.3.7. Điều hướng cho người dùng ........................................................................53
4.2.3.8. Trang yêu thích ( Favorite ) .........................................................................53
4.2.4. Một số trang giao diện môn học khác biệt tùy theo phân loại...............................54
4.2.4.1. Trang môn học theo chủ đề .........................................................................54
4.2.4.2. Trang môn học theo các môn nhỏ hơn ........................................................54
4.2.4.3. Trang lựa chọn luyện tập của môn học theo các môn nhỏ hơn ...................55
4.2.4.3. Trang lựa chọn luyện tập của môn học theo các chủ đề ..............................55
KẾT LUẬN .................................................................................................................................57
TÀI LIỆU THAM KHẢO .........................................................................................................58
