XÂY DỰNG hệ THỐNG hỗ TRỢ TƯƠNG tác lớp học

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM HỒ TRẦN THIỆN ĐẠT – 17520330 ĐÀO HỮU DUY QUÂN – 17520136 KHÓA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC Building an application supporting classroom interaction KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM TP HỒ CHÍ MINH, 2021 ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CƠNG NGHỆ THƠNG TIN KHOA CÔNG NGHỆ PHẦN MỀM HỒ TRẦN THIỆN ĐẠT – 17520330 ĐÀO HỮU DUY QUÂN - 17520136 KHÓA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC Building an application supporting classroom interaction KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM GIẢNG VIÊN HƯỚNG DẪN TS NGUYỄN LƯU THÙY NGÂN ThS LÊ THANH TRỌNG TP HỒ CHÍ MINH, 2021 THƠNG TIN HỘI ĐỒNG CHẤM KHĨA LUẬN TỐT NGHIỆP Hội đồng chấm khóa luận tốt nghiệp, thành lập theo Quyết định số …………………… ngày Hiệu trưởng Trường Đại học Công nghệ Thông tin Chủ tịch Thư ký Ủy viên Ủy viên ĐHQG TP HỒ CHÍ MINH CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc CÔNG NGHỆ THÔNG TIN TP HCM, ngày… tháng… năm 2021 NHẬN XÉT KHÓA LUẬN TỐT NGHIỆP (CỦA CÁN BỘ HƯỚNG DẪN) Tên khóa luận: XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC Nhóm SV thực hiện: Cán hướng dẫn: Hồ Trần Thiện Đạt 17520330 TS Nguyễn Lưu Thùy Ngân Đào Hữu Duy Quân 17520136 ThS Lê Thanh Trọng Đánh giá Khóa luận Về báo cáo: Số trang 98 Số bảng số liệu 23 Số chương Số hình vẽ phẩm Số tài liệu tham khảo 18 53 Sản Một số nhận xét hình thức báo cáo: Về nội dung nghiên cứu: Về chương trình ứng dụng: Về thái độ làm việc sinh viên: Đánh giá chung:Khóa luận đạt/khơng đạt u cầu khóa luận tốt nghiệp kỹ sư/ cử nhân, xếp loại Giỏi/ Khá/ Trung bình Điểm sinh viên: Hồ Trần Thiện Đạt /10 Đào Hữu Duy Quân /10 Người nhận xét (Ký tên ghi rõ họ tên) ĐHQG TP HỒ CHÍ MINH CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc CÔNG NGHỆ THÔNG TIN TP HCM, ngày… tháng… năm 2021 NHẬN XÉT KHÓA LUẬN TỐT NGHIỆP (CỦA CÁN BỘ HƯỚNG DẪN) Tên khóa luận: XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC Nhóm SV thực hiện: Cán phản biện: Hồ Trần Thiện Đạt 17520330 Đào Hữu Duy Quân 17520136 ThS Nguyễn Thị Thanh Trúc Đánh giá Khóa luận Về báo cáo: Số trang 98 Số bảng số liệu 23 Số tài liệu tham khảo 18 Số chương Số hình vẽ phẩm 53 Sản Một số nhận xét hình thức báo cáo: Về nội dung nghiên cứu: Về chương trình ứng dụng: Về thái độ làm việc sinh viên: Đánh giá chung:Khóa luận đạt/khơng đạt u cầu khóa luận tốt nghiệp kỹ sư/ cử nhân, xếp loại Giỏi/ Khá/ Trung bình Điểm sinh viên: Hồ Trần Thiện Đạt /10 Đào Hữu Duy Quân /10 Người nhận xét (Ký tên ghi rõ họ tên) LỜI CẢM ƠN Khoá luận tốt nghiệp với đề tài “XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC” minh chứng cho q trình cố gắng khơng ngừng việc tìm tịi, học hỏi suốt năm học tập trường Đại học Công nghệ Thông tin Thể khả thân việc áp dụng kiến thức chuyên môn vào giải tốn thực tế Trong q trình thực khố luận, em nhận hướng dẫn tận tình từ quý thầy cô, giúp đỡ hỗ trợ từ gia đình bạn bè Một cách đặc biệt, em xin gửi lời cảm ơn chân thành đến: • Các thầy trường Đại học Cơng nghệ Thơng Tin nói chung thầy Khoa Cơng nghệ Phần mềm nói riêng tận tình truyền đạt kiến thức tới em năm học tập trường Đó tài sản quý báu giúp em hồn thành khố luận hành trang cho đường nghiệp thân sau • Em xin gửi lời cảm ơn sâu sắc tới ThS Lê Thanh Trọng, người trực tiếp hướng dẫn, bảo, giúp đỡ em lúc khó khăn, đưa lời khun bổ ích để khố luận hoàn thành tiến độ đáp ứng yêu cầu đề ban đầu • Cảm ơn giảng viên phản biện thầy cô hội đồng chấm luận văn với lời khuyên, góp ý quý báu bổ ích Từ luận văn em trở nên hồn thiện • Lời cuối cùng, em xin dành lời cảm ơn gửi tới gia đình, anh chị, bạn bè ln bên cạnh để động viên đóng góp ý kiến q trình hồn thành khố luận Thành phố Hồ Chí Minh, tháng 07 năm 2021 Sinh viên Hồ Trần Thiện Đạt Sinh viên Đào Hữu Duy Quân ĐHQG TP HỒ CHÍ MINH CỘNG HỊA XÃ HỘI CHỦ NGHĨA VIỆT NAM TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc CÔNG NGHỆ THÔNG TIN ĐỀ CƯƠNG CHI TIẾT TÊN ĐỀ TÀI: XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC Cán hướng dẫn: TS Nguyễn Lưu Thùy Ngân ThS Lê Thanh Trọng Thời gian thực hiện: Từ ngày 01/03/2021 đến ngày 26/06/2021 Sinh viên thực hiện: Hồ Trần Thiện Đạt – 17520330 Đào Hữu Duy Quân – 17520136 Nội dung đề tài: Mục tiêu: - Sinh viên có nơi phù hợp để tự tin trao đổi với giảng viên, trao đổi kín - khơng biết, tiện lợi - Sinh viên theo dõi giảng trực tiếp thiết bị laptop, hay điện thoại cá nhân - Điểm danh hàng loạt hệ thống thông qua thiết bị laptop, hay điện thoại cá nhân thay đọc miệng truyền thống - Tìm hiểu ứng dụng cơng nghệ mới, nâng cao kỹ phát triển phần mềm Phạm vi: - Cho phép theo dõi tương tác sinh viên với giảng viên, giảng cách trực tuyến - Hỗ trợ điểm danh, thực kiểm tra, đánh giá cách nhanh chóng, tiện lợi - Quản lý đầy đủ thông tin cần thiết cho buổi học Đối tượng sử dụng: - Giảng viên giảng dạy trường Đại học Công nghệ Thông tin - Sinh viên từ năm đến năm cuối trường Đại học Công nghệ thông tin buổi học Giao diện khảo sát Giao diện để Giảng viên xem lại thống kế đánh giá, góp ý sau buổi học Giao diện danh sách kiểm tra Giao diện để Giảng viên xem danh sách kiểm tra 10 Giao diện tạo kiểm tra Giao diện để Giảng viên tạo kiểm tra 3.2.6.1.2 Danh sách giao diện Sinh viên Popup chat Giao diện chatbox giảng viên Danh sách lớp học Màn hình hiển thị tất lớp học sinh viên nút “Vào lớp” nhằm để sinh viên vào buổi học diễn Danh sách tài liệu Tại hình này, sinh viên tải tài liệu mà giảng viên upload Màn hình buổi học có sinh viên có Slide buổi học tab Trong tab dùng để xem slide mà giảng viên trình chiếu máy thông qua điện thoại hay laptop cá nhân Giao diện chatbox sinh viên Vùng thảo luận tab Giao diện làm kiểm tra Vùng kiểm tra sinh viên tab Popup để sinh viên điểm danh Popup điểm danh 40 Popup để sinh viên đánh giá sau Popup đánh giá buổi học 3.2.6.1.3 Danh sách giao diện Admin Đăng nhập Màn hình đăng nhập vào trang quản lý Quản lý Giảng viên Giao diện quản lý giảng viên với danh sách giảng viên hệ thống Modal tạo giảng viên Giao diện thêm giảng viên thao tác “Lưu” “Trở lại” Xem chỉnh sửa Giảng viên Giao diện chỉnh sửa giảng viên thao tác “Lưu” “Trở lại” Giao diện quản lý sinh viên với Quản lý sinh viên danh sách sinh viên hệ thống Giao diện thêm sinh viên Tạo sinh viên thao tác “Lưu” “Trở lại” Giao diện chỉnh sửa sinh viên Xem chỉnh sửa sinh viên thao tác “Lưu” “Trở lại” Giao diện lớp học hệ Quản lý lớp học thống 41 Giao diện thêm lớp học Tạo lớp học thao tác “Lưu” “Trở lại” 10 Giao diện chỉnh sửa lớp học Xem chỉnh sửa lớp học thao tác “Lưu” “Trở lại” 11 Giao diện thêm giảng viên / sinh Thêm thành viên vào lớp viên vào danh sách lớp 3.2.6.2 Giao diện số hình ứng dụng 3.2.6.2.1 Giao diện số hình Giảng viên Hình 5-1 Trang chủ 42 Hình 5-2 Giao diện buổi học Hình 5-3 Giao diện chuyên cần 43 Hình 5-4 Giao diện khảo sát Hình 5-5 Giao diện kiểm tra 44 3.2.6.2.2 Giao diện số hình Sinh viên 45 Hình 5-7 Giao diện buổi học Hình 5-6 Trang chủ 46 Hình 5-9 Giao diện kiểm tra Hình 5-8 Giao diện chat 47 Hình 5-10 Giao diện làm kiểm tra Hình 5-11 Giao diện điểm danh 48 Hình 5-12 Giao diện đánh giá 3.2.6.2.3 Giao diện số hình Admin Hình 5-13 Quản lý lớp học 49 Hình 5-14 Quản lý Giảng viên Hình 5-15 Quản lý Sinh viên 50 Chương 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 4.1 Kết đạt Thơng qua việc nghiên cứu tìm hiểu công nghệ, đặc biệt công nghệ mới, em phát triển ứng dụng chia sẻ trao đổi sách hoàn chỉnh Do giới hạn kinh phí đăng ký tài khoản nhà phát triển, ứng dụng dừng lại giai đoạn chạy thử, chưa thể đẩy lên chợ ứng dụng App Store Tuy nhiên kết chạy thử cho thấy hệ thống hoạt động tốt, mở rộng, phát triển thêm tương lai Về mặt kỹ thuật, nhóm em đạt kết sau: - Tìm hiểu, áp dụng framework NestJS database mã nguồn mở PostgreSQL việc thao tác CRUD với liệu, upload file PostgreSQL tuân theo tiêu chuẩn SQL không mâu thuẫn với tính truyền thống hay dẫn đến định kiến trúc gây hại NestJS kết hợp ExpressJS Fastify Một hệ thống ổn định, nhanh chóng hiệu suất cao - Tìm hiểu ReacJs, cơng nghệ lập trình giao diện web Ngồi ra, cịn áp dụng thư viện UI phổ biến Ant Design để tạo giao diện web đơn giản, dễ nhìn - Học nhiều kiến thức, có thêm kinh nghiệm việc sử dụng Firebase triển khai ứng dụng Web - Tìm hiểu dịch vụ lưu trữ liệu Microft Azure Microsoft cung cấp, Firebase Hosting Google - Tìm hiểu biết cách triển khai máy chủ lên tảng đám mây để sử dụng không mạng cục 51 Về mặt thực tiễn em đạt được: - Rèn luyện kĩ nhận dạng toán, nghiên cứu khảo sát thực tế, phân tích chức thực tài liệu mô tả - Nâng cao khả tìm hiểu nghiên cứu cơng nghệ, đặc biệt công nghệ - Kinh nghiệm áp dụng thực tế quy trình phát triển phần mềm gồm Waterfall Scrum - Phát triển kỹ mềm cá nhân lên kế hoạch, trình bày văn bản, dự trù thời gian, kỹ làm việc nhóm khả tranh luận, thuyết phục hỗ trợ lẫn - Hiểu sản phẩm thực có tác động đến thực tế UIT qua góp ý thầy cơ, bạn bè khoa 4.2 Thuận lợi khó khăn 4.2.1 Thuận lợi - Cả có kinh nghiệm dự án làm product thực tế từ công ty thực tập GEEK Up - Giảng viên hướng dẫn có tâm huyết nhóm tâm thực từ ý tưởng thành phẩm (MVP) có khả áp dụng vào thực tế Giảng viên có nhiều góc nhìn thực tế kinh nghiệm dày dặn dẫn dắt nhóm hướng từ đầu - Được giảng viên hướng dẫn quan tâm, cho lời khuyên để cải thiện tiến độ lúc nhóm bị “trơi” - Nhận giúp đỡ nhiệt tình giảng viên, sinh viên khoa Công nghệ Phần mềm thực khảo sát trạng 4.2.2 Khó khăn - Tự đặt thử thách với chức yêu cầu real-time khiến nhóm nhiều thời gian tìm giải pháp từ internet, mentor cũ giảng viên hướng dẫn - Dự án thực giai đoạn mà thành viên làm, nên 52 địi hỏi khả xếp cơng việc, họp online trao đổi ý tưởng để hiểu thời gian ngắn quan trọng - Ý tưởng sản phẩm loại thị trường hiếm, nên việc tham khảo giao diện chức trở nên hạn chế Nhóm chia tham khảo loại chức nhóm sản phẩm khác để có giải pháp giao diện hợp lý 4.3 Hướng phát triển Đề tài cịn mở rộng phát triển thêm nhiều tính tích hợp với sỡ liệu trường học tối ưu hóa giá trị liệu như: - Tích hợp tài khoản giảng, viên sinh viên hệ thống nhà trường để tiện lợi đăng nhập, nhận dạng, theo dõi, đánh giá,… - Tích hợp liệu tính điểm kiểm tra, điểm danh sinh viên độ hài lòng buổi học giảng viên Trình bày liệu thu nhập thành biểu đồ nhằm giúp giảng viên, nhà trường - hiểu rõ tình trạng sinh viên: • Độ hài lịng mơn học • Phổ điểm sinh viên kiểm tra • Phổ điểm danh ngày tuần • Tỉ lệ sinh viên tương tác buổi học - Hệ thống hướng dẫn cách đặt câu hỏi, cách nêu thắc mắc với chủ đề từ xuất sinh viên sử dụng Vùng thảo luận #thắcmắckiếnthứccũ, #thắcmắcvềbàiđanghọc, #câuhỏibênngoài,… template trình bày Ví dụ: Chào thầy, em …, em muốn đặt câu hỏi phần … sau … - Hình thức kiểm tra đa dạng, gây hứng thú ý tưởng từ Kahoot, Sau golive, chức tiếp tục nghiên cứu, khảo sát sửa đổi cho phù hợp với nhu cầu giảng viên, sinh viên trường Kế hoạch nhân rộng mơ hình sang trường tiềm thực sau sản phẩm chạy ổn định khoảng năm 53 CHƯƠNG 5: TÀI LIỆU THAM KHẢO [1] Theo báo Thanh niên: https://thanhnien.vn/gioi-tre/ky-nang-memva-thuong-hieu-ca-nhan-108706.html [2] Số liệu giảng viên, sinh viên UIT: https://www.uit.edu.vn/tong-quanve-truong-dh-cong-nghe-thong-tin [3] NestJS: https://docs.nestjs.com/ [4] What is NestJS: https://briswell-vn.com/news/what-is-nestjs/ [5] PostgreSQL: https://bizflycloud.vn/tin-tuc/postgresql-la-gi-timhieu-ve-co-so-du-lieu-ma-nguon-mo-tien-tien-nhat-the-gioi20180919175924611.htm [6] ReactJS: https://wikihoidap.org/reactjs-la-gi [7] Firebase App chat: https://css-tricks.com/building-a-real-time-chat-app-with-react-andfirebase/ [8] Antd: https://ant.design/docs/react/introduce [9] UmiJS: https://umijs.org/docs [10] DvaJS: https://dvajs.com/guide/ 54 ... - Hệ thống hỗ trợ tương tác lớp học hệ thống nhằm giúp giảng viên sinh viên sinh viên lớp, nhóm tương tác trực tiếp với lớp học Hệ thống gồm nhiều lớp học khác (tính theo học kỳ) Trong lớp học. .. tốt nghiệp với đề tài “XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC” minh chứng cho trình cố gắng khơng ngừng việc tìm tịi, học hỏi suốt năm học tập trường Đại học Công nghệ Thông tin Thể khả thân... XÃ HỘI CHỦ NGHĨA VIỆT NAM TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc CÔNG NGHỆ THÔNG TIN ĐỀ CƯƠNG CHI TIẾT TÊN ĐỀ TÀI: XÂY DỰNG HỆ THỐNG HỖ TRỢ TƯƠNG TÁC LỚP HỌC Cán hướng dẫn: TS Nguyễn Lưu Thùy