Xây dựng phần mềm học và thi toeic đồ án tốt nghiệp

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC CÔNG NGHỆ ĐÔNG Á - ĐỒ ÁN TỐT NGHIỆP TÊN ĐỀ TÀI: XÂY DỰNG PHẦN MỀM HỌC VÀ THI TOEIC Sinh viên thực Ngày sinh Lớp Khoa Mã sinh viên Giảng viên hướng dẫn : : : : : : Phạm Kim Anh 15/04/2000 IT2 Công nghệ thông tin 187480201220 ThS Nguyễn Viết Hùng Bắc Ninh, 2022 BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC CÔNG NGHỆ ĐÔNG Á - PHẠM KIM ANH TÊN ĐỀ TÀI: XÂY DỰNG PHẦN MỀM HỌC VÀ THI TOEIC Giảng viên hướng dẫn: ThS Nguyễn Viết Hùng Bắc Ninh, 2022 LỜI CAM ĐOAN Những nội dung đồ án tốt nghiệp thành từ nghiên cứu thực trực tiếp hướng dẫn giảng viên hướng dẫn ThS Nguyễn Viết Hùng Đồ án thực hoàn toàn mới, thành riêng em, không chép theo đồ án tương tự Mọi tham khảo sử dụng đồ án trích dẫn nguồn tài liệu báo cáo danh mục tài liệu tham khảo Mọi chép không hợp lệ, vi phạm quy chế nhà trường, em xin hoàn toàn chịu trách nhiệm Bắc Ninh, tháng năm 2022 Sinh viên thực đề tài (Ký ghi rõ họ tên) i LỜI CẢM ƠN Để hoàn thành đề tài đồ án tốt nghiệp này, trước hết em xin gửi lời cảm ơn chân thành đến Cán Giảng viên Khoa Công nghệ Thông tin, cán giảng viên Trường Đại học Cơng nghệ Đơng Á tận tình giảng dạy truyền đạt kiến thức cho em Đồng thời em xin gửi lời cảm ơn đặc biệt dạy, hướng dẫn tận tình ThS Nguyễn Viết Hùng ln tận tình hướng dẫn, giúp đỡ em suốt thời gian thực đồ án Em xin gửi lời cảm ơn tới Khoa Công nghệ Thông tin – Trường Đại học Công nghệ Đông Á quan tâm tạo điều kiện giúp em hoàn thành đề tài đồ án tốt nghiệp Ngoài ra, em xin cảm ơn người bạn giúp đỡ trao đổi thêm nhiều thông tin đề tài trình thực đề tài Cuối em vơ biết ơn gia đình bạn bè, người luôn bên cạnh em, động viên, chia sẻ với em suốt thời gian thực đề tài đồ án tốt nghiệp “Xây dựng phần mềm học và thi Toeic” Do kiến thức hạn chế, báo cáo em không tránh khỏi sai sót Rất mong nhận lời góp ý từ quý Thầy cô để đồ án tốt nghiệp em hồn thiện giúp em có thêm kinh nghiệm quý báu Cuối cùng, em xin kính chúc thầy cô giảng viên trường Đại học Công nghệ Đơng Á nói chung, thầy khoa Cơng nghệ thơng tin nói riêng dồi sức khỏe thành công nghiệp cao quý Em xin chân thành cảm ơn! Bắc Ninh, tháng năm 2022 Sinh viên thực Phạm Kim Anh ii MỤC LỤC LỜI CAM ĐOAN .i LỜI CẢM ƠN ii MỤC LỤC iii DANH MỤC HÌNH ẢNH vi DANH MỤC CÁC BẢNG x DANH MỤC TỪ VIẾT TẮT xi LỜI NÓI ĐẦU CHƯƠNG 1: MỞ ĐẦU 1.1 Lý chọn đề tài 1.2 Mục đích nghiên cứu 1.3 Nhiệm vụ nghiên cứu 1.4 Đối tượng phạm vi nghiên cứu 1.4.1 Đối tượng nghiên cứu 1.4.2 Phạm vi nghiên cứu .3 1.5 Phương pháp nghiên cứu 1.6 Cấu trúc đồ án .4 CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ HỆ THỐNG .5 2.1 Khảo sát đặc tả yêu cầu 2.1.1 Phần quản lý admin 2.1.2 Giao diện người dùng 2.2 Các yêu cầu phi chức 2.3 Phân tích thiết kế hệ thống 2.3.1 Các chức hệ thống 2.3.2 Các tác nhân hệ thống .6 2.4 Biểu đồ Use Case 2.4.1 Biểu đồ Use case tổng quát iii 2.4.2 Phân rã chức với vai trò người quản trị 2.4.3 Phân rã chức với vai trò người dùng 2.5 Biểu đồ Sequence Diagram 2.5.1 Biểu đồ chức đăng nhập Admin .9 2.5.2 Biểu đồ chức quản lý hướng dẫn ngữ pháp 10 2.5.3 Biểu đồ chức quản lý hướng dẫn từ vựng 13 2.5.4 Biểu đồ chức quản lý tập đọc 16 2.5.5 Biểu đồ chức quản lý tập nghe 18 2.5.6 Biểu đồ chức quản lý đề thi 21 2.5.7 Biểu đồ chức đăng ký User 22 2.5.8 Biểu đồ chức đăng nhập User 23 2.5.9 Biểu đồ chức học hướng dẫn ngữ pháp 23 2.5.10 Biểu đồ chức làm tập đọc .27 2.5.11 Biểu đồ chức làm tập nghe .28 2.5.12 Biểu đồ chức làm đề thi thử 29 2.6 Biểu đồ Activity Diagram 30 2.6.1 Biểu đồ hoạt động chức đăng nhập 30 2.6.2 Biểu đồ hoạt động chức quản lý hướng dẫn ngữ pháp 31 2.6.3 Biểu đồ hoạt động chức quản lý hướng dẫn từ vựng 34 2.6.4 Biểu đồ hoạt động chức quản lý tập đọc .37 2.6.5 Biểu đồ hoạt động chức quản lý tập nghe 39 2.6.6 Biểu đồ hoạt động chức quản lý thi thử 41 2.6.7 Biểu đồ hoạt động chức đăng ký User 42 2.6.8 Biểu đồ hoạt động chức học hướng dẫn ngữ pháp .43 2.6.9 Biểu đồ hoạt động chức làm tập đọc 45 iv 2.6.10 Biểu đồ hoạt động chức làm tập nghe 46 2.6.11 Biểu đồ hoạt động chức làm thi thử 47 2.7 Thiết kế sở liệu 48 CHƯƠNG 3: XÂY DỰNG PHẦN MỀM HỌC TOEIC 49 3.1 Công nghệ thực 49 3.1.1 Ngôn ngữ lập trình Java 49 3.1.2 Mơ hình MVC .53 3.1.3 Cơ sở liệu MySQL 54 3.1.4 Phần mềm viết code Eclipse 55 3.2 Giao diện hiển thị .56 3.2.1 Giao diện trang chủ .56 3.2.2 Giao diện trang đăng ký tài khoản .57 3.2.3 Giao diện đăng nhập 59 3.2.4 Giao diện trang quản lý người quản trị (admin) 60 3.2.5 Giao diện trang người dùng 68 3.3 Kết luận .80 3.3.1 Kết đạt đề tài 80 3.3.2 Hướng phát triển 81 DANH MỤC CÁC TÀI LIỆU THAM KHẢO .82 v DANH MỤC HÌNH ẢNH Hình 2.1: Các tác nhân hệ thống .7 Hình 2.2: Biểu đồ Use case tổng quát .7 Hình 2.3: Phân rã chức với vai trò người quản trị Hình 2.4: Phân rã chức với vai trò người dùng Hình 2.5: Các bước xây dựng Sequence Diagram Hình 2.6: Biểu đồ chức đăng nhập Admin Hình 2.7: Biểu đồ chức xem danh sách quản lý HDNP .10 Hình 2.8: Biểu đồ chức xóa HDNP 10 Hình 2.9: Biểu đồ chức thêm HDNP 11 Hình 2.10: Biểu đồ chức cập nhật nội dung cho HDNP 12 Hình 2.11: Biểu đồ chức thêm HDTV 13 Hình 2.12: Biểu đồ chức cập nhật nội dung HDTV 15 Hình 2.13: Biểu đồ chức cập nhật audio hình ảnh HDTV 15 Hình 2.14: Biểu đồ chức thêm tập đọc .16 Hình 2.15: Biểu đồ chức cập nhật nội dung tập đọc 17 Hình 2.16: Biểu đồ chức thêm tập nghe .18 Hình 2.17: Biểu đồ chức cập nhật nội dung tập nghe 19 Hình 2.18: Biểu đồ chức cập nhật audio hình ảnh tập nghe 20 Hình 2.19: Biểu đồ chức thêm đề thi 21 Hình 2.20: Biểu đồ chức đăng ký User 22 Hình 2.21: Biểu đồ chức đăng nhập User 23 Hình 2.22: Biểu đồ chức xem danh sách hướng dẫn ngữ pháp 23 Hình 2.23: Biểu đồ chức xem chi tiết hướng dẫn ngữ pháp .24 Hình 2.24: Biểu đồ chức tìm kiếm hướng dẫn ngữ pháp 25 Hình 2.25: Biểu đồ chức bình luận hướng dẫn ngữ pháp 26 Hình 2.26: Biểu đồ chức làm tập đọc 27 Hình 2.27: Biểu đồ chức làm tập nghe .28 Hình 2.28: Biểu đồ chức làm thi thử 29 Hình 2.29: Các bước xây dựng Activity Diagram .30 Hình 2.30: Biểu đồ hoạt động chức đăng nhập 30 vi Hình 2.31: Biểu đồ hoạt động chức xem danh sách quản lý HDNP 31 Hình 2.32: Biểu đồ hoạt động chức thêm HDNP 32 Hình 2.33: Biểu đồ hoạt động chức thêm HDTV 34 Hình 2.34: Biểu đồ hoạt động chức cập nhật nội dung HDTV 36 Hình 2.35: Biểu đồ hoạt động chức cập nhật audio hình ảnh cho HDTV 36 Hình 2.36: Biểu đồ hoạt động chức thêm tập đọc 37 Hình 2.37: Biểu đồ hoạt động chức cập nhật nội dung tập đọc 38 Hình 2.38: Biểu đồ hoạt động chức xóa tập đọc .38 Hình 2.39: Biểu đồ hoạt động chức thêm tập nghe .39 Hình 2.40: Biểu đồ hoạt động chức cập nhật nội dung tập nghe 40 Hình 2.41: Biểu đồ hoạt động chức cập nhật audio hình ảnh cho tập nghe .40 Hình 2.42: Biểu đồ hoạt động chức thêm thi thử 41 Hình 2.43: Biểu đồ hoạt động chức đăng ký User 42 Hình 2.44: Biểu đồ hoạt động chức xem danh sách HDNP 43 Hình 2.45: Biểu đồ hoạt động chức xem chi tiết HDNP 44 Hình 2.46: Biểu đồ hoạt động chức tìm kiếm HDNP .44 Hình 2.47: Biểu đồ hoạt động chức bình luận HDNP 45 Hình 2.48: Biểu đồ hoạt động chức làm tập đọc 45 Hình 2.49: Biểu đồ hoạt động chức làm tập nghe 46 Hình 2.50: Biểu đồ hoạt động chức làm thi thử 47 Hình 2.51: Sơ đồ ERD 48 Hình 3.1: Giao diện trang chủ .57 Hình 3.2: Giao diện trang đăng ký tài khoản 57 Hình 3.3: Giao diện đăng ký lỗi chưa nhập đủ thông 58 Hình 3.4: Giao diện đăng ký lỗi mật yếu 58 Hình 3.5: Giao diện đăng ký lỗi trùng tên đăng nhập .59 Hình 3.6: Giao diện đăng ký thành công .59 Hình 3.7: Giao diện đăng nhập 59 Hình 3.8: Giao diện trang quản lý người quản trị 60 Hình 3.9: Giao diện quản lý danh sách hướng dẫn ngữ pháp 60 Hình 3.10: Thêm tên cho hướng dẫn ngữ pháp .61 vii Hình 3.11: Thêm ảnh đại diện cho hướng dẫn ngữ pháp 61 Hình 3.12: Thêm nội dung cho hướng dẫn ngữ pháp 61 Hình 3.13: Giao diện quản lý danh sách hướng dẫn từ vựng 62 Hình 3.14: Thêm tên chủ đề từ vựng .62 Hình 3.15: Thêm ảnh đại diện cho chủ đề .62 Hình 3.16: Thêm nội dung cho chủ đề từ vựng .63 Hình 3.17: Thêm audio hình ảnh cho nội dung chủ đề từ vựng .63 Hình 3.18: Giao diện quản lý danh sách tập đọc .63 Hình 3.19: Thêm tên tập đọc 64 Hình 3.20: Thêm ảnh đại diện cho tập đọc 64 Hình 3.21: Thêm nội dung cho tập đọc 64 Hình 3.22: Giao diện quản lý danh sách tập đọc nghe 65 Hình 3.23: Thêm tên tập nghe 65 Hình 3.24: Thêm ảnh đại diện tập nghe 65 Hình 3.25: Thêm nội dung tập nghe 66 Hình 3.26: Thêm audio hình ảnh cho nội dung tập nghe 66 Hình 3.27: Giao diện quản lý danh sách đề thi thử .66 Hình 3.28: Thêm tên đề thi 67 Hình 3.29: Thêm ảnh đại diện đề thi .67 Hình 3.30: Thêm nội dung đề thi 67 Hình 3.31: Thêm audio hình ảnh đề thi 67 Hình 3.32: Giao diện danh sách hướng dẫn ngữ pháp 68 Hình 3.33: Giao diện xem chi tiết hướng dẫn ngữ pháp 69 Hình 3.34: Giao diện bình luận hướng dẫn ngữ pháp .69 Hình 3.35: Giao diện tìm kiếm hướng dẫn ngữ pháp 70 Hình 3.36: Giao diện tìm kiếm hướng dẫn ngữ pháp 70 Hình 3.37: Giao diện xem chi tiết hướng dẫn từ vựng 71 Hình 3.38: Giao diện bình luận hướng dẫn từ vựng 71 Hình 3.39: Giao diện tìm kiếm hướng dẫn từ vựng 71 Hình 3.40: Giao diện danh sách tập đọc 72 Hình 3.41: Giao diện làm đọc 72 Hình 3.42: Giao diện đáp án 73 viii 3.2.5 Giao diện trang người dùng a Giao diện học hướng dẫn ngữ pháp ❖ Giao diện danh sách hướng dẫn ngữ pháp Hình 3.32: Giao diện danh sách các hướng dẫn ngữ pháp Dựa vào hình ảnh bên trên, em giải thích yếu tố giao diện danh sách hướng dẫn ngữ pháp Bảng III.4 sau: STT Bảng 3.4: Các yếu tố hình danh sách các hướng dẫn Loại Tên control Mô tả ràng buộc khác control Logo Image Click vào để trang chủ Tìm kiếm TextBox Nhập từ muốn tìm danh sách Ảnh HDNP Link Hiển thị ảnh HDNP Tên HDNP Button Hiển thị tên HDNP Xem hướng dẫn Link Click vào để xem chi tiết HDNP Prev Button Click vào để trang trước Next Button Click vào để xem trang sau Thoát Button Click vào để thoát khỏi tài khoản 68 ❖ Giao diện xem chi tiết hướng dẫn ngữ pháp Hình 3.33: Giao diện xem chi tiết hướng dẫn ngữ pháp ❖ Giao diện bình luận hướng dẫn ngữ pháp Hình 3.34: Giao diện bình luận hướng dẫn ngữ pháp 69 ❖ Giao diện tìm kiếm hướng dẫn ngữ pháp Hình 3.35: Giao diện tìm kiếm hướng dẫn ngữ pháp b Giao diện học hướng dẫn từ vựng ❖ Giao diện danh sách hướng dẫn từ vựng Hình 3.36: Giao diện tìm kiếm hướng dẫn ngữ pháp 70 ❖ Giao diện xem chi tiết hướng dẫn từ vựng Hình 3.37: Giao diện xem chi tiết hướng dẫn từ vựng ❖ Giao diện bình luận hướng dẫn từ vựng Hình 3.38: Giao diện bình luận hướng dẫn từ vựng ❖ Giao diện tìm kiếm hướng dẫn từ vựng Hình 3.39: Giao diện tìm kiếm hướng dẫn từ vựng 71 c Giao diện làm tập đọc ❖ Giao diện danh sách tập đọc Hình 3.40: Giao diện danh sách tập đọc ❖ Giao diện làm tập đọc ➢ Giao diện làm bài đọc Hình 3.41: Giao diện làm đọc 72 ➢ Giao diện đáp án đúng Hình 3.42: Giao diện đáp án ➢ Giao diện đáp án sai Hình 3.43: Giao diện đáp án sai ➢ Giao diện yêu cầu trả lời câu hỏi Hình 3.44: Giao diện yêu cầu trả lời câu hỏi 73 ❖ Giao diện tìm kiếm tập đọc Hình 3.45: Giao diện tìm kiếm tập đọc d Giao diện làm tập nghe ❖ Giao diện danh sách tập nghe Hình 3.46: Giao diện danh sách tập nghe 74 ❖ Giao diện làm tập nghe ➢ Giao diện làm tập nghe có hình ảnh Hình 3.47: Giao diện làm tập nghe có hình ảnh ➢ Giao diện làm tập nghe khơng có hình ảnh Hình 3.48: Giao diện làm tập nghe khơng có hình ảnh 75 ➢ Giao diện đáp án câu có hình ảnh Hình 3.49: Giao diện đáp án câu có hình ảnh ➢ Giao diện đáp án câu khơng có hình ảnh Hình 3.50: Giao diện đáp án câu khơng có hình ảnh 76 ➢ Giao diện u cầu trả lời câu hỏi Hình 3.51: Giao diện yêu cầu trả lời câu hỏi ❖ Giao diện tìm kiếm tập nghe Hình 3.52: Giao diện tìm kiếm tập nghe 77 e Giao diện làm đề thi thử ❖ Giao diện danh sách đề thi thử Hình 3.53: Giao diện danh sách các đề thi thử ❖ Giao diện làm thi thử ➢ Giao diện làm thi thử Hình 3.54: Giao diện làm thi thử ➢ Giao diện nộp 78 Hình 3.55: Giao diện nộp ➢ Giao diện xem kết thi Hình 3.56: Giao diện xem kết thi 79 ➢ Giao diện yêu cầu đăng nhập trước làm thi Hình 3.57: Giao diện yêu cầu đăng nhập trước làm thi ❖ Giao diện tìm kiếm đề thi thử Hình 3.58: Giao diện tìm kiếm đề thi thử 3.3 Kết luận 3.3.1 Kết đạt được của đề tài Sau thời gian tập trung triển khai đề tài, em hoàn thành “Phần mềm học thi Toeic”, với giao diện đơn giản, dễ dàng sử dụng, thân thiện với người dùng Sau hoàn thành xong “Phần mềm học thi Toeic” em có thêm 80 kỹ tảng để xây dựng website ngôn ngữ Java sử dụng cơng nghệ Servlet – JSP theo mơ hình MVC, áp dụng kiến thức HTML, CSS, JavaScript, Bootstrap, Jquery học vào việc phát triển ứng dụng web Bên cạnh đó, em mở rộng thêm kiến thức chuyên ngành nhờ việc tìm hiểu số kiến thức lập trình để áp dụng vào việc phát triển phần mềm Nhờ vậy, kỹ tự học vận dụng kỹ em nâng cao Mặc dù hệ thống phần mềm hoàn thành, cịn nhiều mặt hạn chế vấn đề thiếu sót Phần mềm học thi Toeic có giao diện bắt mắt, thân thiện, dễ sử dụng có nhiều chức năng: - Xem danh sách hướng dẫn ngữ pháp, hướng dẫn từ vựng, tập đọc, tập nghe, đề thi thử - Tìm kiếm hướng dẫn ngữ pháp, hướng dẫn từ vựng, tập đọc, tập nghe, đề thi thử - Xem chi tiết hướng dẫn ngữ pháp, hướng dẫn từ vựng - Bình luận hướng dẫn ngữ pháp, hướng dẫn từ vựng - Làm tập đọc, tập nghe, làm đề thi thử - Quản lý hướng dẫn ngữ pháp, hướng dẫn từ vựng, tập đọc, tập nghe, đề thi thử 3.3.2 Hướng phát triển Do thời gian có hạn nên phần mềm em xây dựng cịn số hạn chế: - Chưa xây dựng chức quản lý tài khoản người dùng - Chưa xây dựng chức nhiều tác giả đăng Trong thời gian tới, em cố gắng khắc phục mặt hạn chế cải tiến hệ thống cho phù hợp với nhà trường Nghiên cứu phát triển thêm đa ngôn ngữ, quản lý tài khoản, phân quyền cho phép người dùng đăng bài, quản lý điểm người dùng để đáp ứng nhu cầu bạn sinh viên nhà trường 81 DANH MỤC CÁC TÀI LIỆU THAM KHẢO [1] https://hostingviet.vn/servlet-la-gi [2] https://viettuts.vn/jsp [3] https://monamedia.co/mvc-la-gi-ung-dung-cua-mo-hinh-mvc-trong-lap-trinh/ [4] https://vi.m.wikipedia.org/wiki/MySQL [5] https://safedownload.net/tai-phan-mem/eclipse [6] Kathy Sierra, Bert Bates, “Head First Java”, February 2005 [7] Kathy Sierra, “Head First Servlets and JSP”, March 2008 [8] Herbert Schidt, “Java: A Beginner’s Guide”, 2002 [9] Kendal, “Object Oriented Programming using Java”, 2009 82