BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜ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 XÂY DỰNG ỨNG DỤNG WEB TẠO ĐỀ THI VÀ BÀI TẬP HỖ TRỢ DẠY HỌC TRỰC TUYẾN BELLO QUIZ GVHD: ThS MAI ANH THƠ SVTH : LÊ VĂN CƯỜNG TRẦN BẢO DUY SKL011401 Tp Hồ Chí Minh, tháng 07/2023 TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TPHCM KHOA CÔNG NGHỆ THÔNG TIN BỘ MÔN CÔNG NGHỆ PHẦN MỀM 🙞🕮🙜 LÊ VĂN CƯỜNG – 19110332 TRẦN BẢO DUY – 19110339 Đề tài: XÂY DỰNG ỨNG DỤNG WEB TẠO ĐỀ THI VÀ BÀI TẬP HỖ TRỢ DẠY HỌC TRỰC TUYẾN BELLO QUIZ KHÓA LUẬN TỐT NGHIỆP KỸ SƯ CÔNG NGHỆ THÔNG TIN GIÁO VIÊN HƯỚNG DẪN ThS MAI ANH THƠ KHÓA 2019 – 2023 ĐH SƯ PHẠM KỸ THUẬT TP HCM KHOA CNTT ******* CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh Phúc ******* PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN Họ tên Sinh viên 1: Lê Văn Cường MSSV 1: 19110332 Họ tên Sinh viên 2: Trần Bảo Duy MSSV 2: 19110339 Ngành: Công nghệ Thông tin Tên đề tài: Xây dựng ứng dụng web tạo đề thi tập hỗ trợ dạy học trực tuyến – Bello Quizz Họ tên Giáo viên hướng dẫn: ThS Mai Anh Thơ NHẬN XÉT Về nội dung đề tài & khối lượng thực hiện: Ưu điểm: Khuyết điểm: Đề nghị cho bảo vệ hay không? Đánh giá loại: Điểm: Tp Hồ Chí Minh, ngày tháng Giáo viên hướng dẫn (Ký & ghi rõ họ tên) năm 2023 ĐH SƯ PHẠM KỸ THUẬT TP HCM KHOA CNTT ******* CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh Phúc ******* PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN Họ tên Sinh viên 1: Lê Văn Cường MSSV 1: 19110332 Họ tên Sinh viên 2: Trần Bảo Duy MSSV 2: 19110339 Ngành: Công nghệ Thông tin Tên đề tài: Xây dựng ứng dụng web tạo đề thi tập hỗ trợ dạy học trực tuyến – Bello Quizz Họ tên Giáo viên phản biện: TS Lê Văn Vinh NHẬN XÉT Về nội dung đề tài & khối lượng thực hiện: Ưu điểm: Khuyết điểm: Đề nghị cho bảo vệ hay không? Đánh giá loại: Điểm: Tp Hồ Chí Minh, ngày tháng Giáo viên phản biện (Ký & ghi rõ họ tên) năm 2023 LỜI CẢM ƠN Lời đầu tiên, cho phép nhóm thực đề tài gửi lời cảm ơn đến Khoa Công nghệ Thông tin – Trường Đại học Sư phạm Kỹ thuật Thành phố Hồ Chí Minh, tạo điều kiện cho sinh viên chúng em học tập, trau dồi tích lũy tảng kiến thức vững chắc, phục vụ cho q trình thực đề tài Bên cạnh đó, nhóm xin gửi lời cảm ơn chân thành sâu sắc đến ThS Mai Anh Thơ – giáo viên hướng dẫn nhóm thực Khóa luận tốt nghiệp Trong suốt q trình thực đề tài, tận tâm bảo nhiệt tình, kịp thời góp ý, sửa chữa để giúp nhóm hồn thiện Tuy nhiên, kiến thức vô tận Đồng thời với lý khách quan giới hạn mặt thời gian, số lượng công việc cần phải thực tương đối lớn nhóm người Chính vậy, việc xảy thiếu sót điều khó tránh khỏi Nhóm hi vọng nhận góp ý tận tình q thầy (cơ), để từ hồn thiện đề tài cách tốt Xin chân thành cảm ơn! Nhóm thực Lê Văn Cường – 19110332 Trần Bảo Duy – 19110339 i Trường ĐH Sư Phạm Kỹ Thuật TP.HCM Khoa Công nghệ Thơng tin ĐỀ CƯƠNG KHĨA LUẬN TỐT NGHIỆP Họ tên Sinh viên 1: Lê Văn Cường MSSV 1: 19110332 Họ tên Sinh viên 2: Trần Bảo Duy MSSV 2: 19110339 Thời gian làm khóa luận: Chuyên ngành: Cơng nghệ phần mềm Tên khóa luận tốt nghiệp: Xây dựng ứng dụng web tạo đề thi tập hỗ trợ dạy học trực tuyến – Bello Quizz Giáo viên hướng dẫn: ThS Mai Anh Thơ Nhiệm vụ khóa luận: Tìm hiểu cơng nghệ: MongoDB, ExpressJS, NodeJS, ReactJS, Restful API, Json Web Token Sử dụng Restful API, NodeJS, ExpressJS để xây dựng Backend, viết API cho module hệ thống Sử dụng ReactJS, Redux, Material UI để xây dựng xử lý giao diện Website cho người dùng Sử dụng MongoDB để lưu trữ liệu người dùng hệ thống Sử dụng Json Web Token để xác thực phân quyền cho hệ thống API, đảm bảo tính bảo mật cho hệ thống Tích hợp toán trực tuyến với VNPay, MoMo, đăng nhập tài khoản Google, Facebook Đề cương khóa luận: PHẦN MỞ ĐẦU Tính cấp thiết đề tài Mục đích đề tài Cách tiếp cận phương pháp nghiên cứu 3.1 Đối tượng nghiên cứu 3.2 Phạm vi nghiên cứu Ý nghĩa khoa học thực tiễn PHẦN NỘI DUNG CHƯƠNG KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 1.1 Khảo sát trạng 1.2 Xác định yêu cầu CHƯƠNG CƠ SỞ LÝ THUYẾT ii 2.1 Kiến trúc hệ thống 2.2 Các công nghệ áp dụng CHƯƠNG THIẾT KẾ PHẦN MỀM 3.1 Mơ hình hố u cầu 3.2 Lược đồ lớp 3.3 Thiết kế CSDL CHƯƠNG THIẾT KẾ GIAO DIỆN 4.1 Giao diện Người dùng 4.2 Giao diện Quản trị viên CHƯƠNG CÀI ĐẶT VÀ KIỂM THỬ 5.1 Cài đặt 5.2 Kiểm thử PHẦN KẾT LUẬN Kết đạt Ưu điểm Nhược điểm Hướng phát triển TÀI LIỆU THAM KHẢO iii KẾ HOẠCH THỰC HIỆN STT Thời gian Nhiệm vụ Sản phẩm Ghi - Khảo sát trạng trang web: TheExam, 13/03/2023 - Khảo sát trạng Exam24, TestCenter, Azota, 19/03/2023 - Xác định yêu cầu Utex - Phân tích yêu cầu chức cho hệ thống 20/03/2023 26/03/2023 - Thiết kế lược đồ Use case - Thiết kế use case - Viết đặc tả use case cho chức - Xây dựng lược đồ lớp - Thiết kế sở 27/03/2023 09/04/2023 liệu - Thiết kế lược đồ hệ thống - Xây dựng lược đồ cho use case dựa đặc tả - Thiết kế sở liệu - Phân tích lựa chọn cơng nghệ sử dụng để đáp ứng yêu cầu hệ thống - Tìm hiểu sở lý thuyết 10/04/2023 16/04/2023 - Tìm hiểu sở lý thuyết ReactJS, Redux Toolkit, MaterialUI để xây dựng Frontend cho hệ thống - Tìm hiểu sở lý thuyết MongoDB, ExpressJS, NodeJS, Restful API để xây dựng Backend cho hệ thống - Nghiên cứu cách xây dựng 17/04/2023 23/04/2023 - Tìm hiểu sở lý thuyết website hồn chỉnh cơng nghệ Mern stack - Tìm hiểu chức đăng nhập với Google, Facebook iv - Tìm hiểu cơng cụ toán online VNPay MoMo - Tiến hành triển - Xây dựng API xử lý chức theo use case đề khai code server 24/04/2023 - Tiến hành xây dựng 14/05/2023 giao diện code - Xây dựng trang giao xử lý phía front- diện đảm nhận hiển thị end chức hệ thống - Tích hợp xử lý giao diện với chức 15/05/2023 04/06/2023 - Các chức giao diện API - Điều chỉnh hoàn thiện chức gọi nhận kết xử lý từ API tương ứng hệ thống - Xây dựng kịch 05/06/2023 25/06/2023 kiểm thử - Tiến hành kiểm thử ứng dụng viết 26/06/2023 02/07/2023 - Hoàn thiện báo cáo Giáo viên hướng dẫn (Ký ghi rõ họ tên) toàn ứng dụng - Tiến hành sửa lỗi dựa kết kiểm thử báo cáo lỗi - Viết kịch kiểm thử cho - Viết hồn chỉnh báo cáo Tp Hồ Chí Minh, ngày tháng năm 2023 Người viết đề cương (Ký ghi rõ họ tên) v DANH MỤC TỪ VIẾT TẮT Từ viết tắt STT Từ đầy đủ CNTT Công nghệ Thông tin CSDL Cơ sở liệu vi