(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online

(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online(Đồ án tốt nghiệp) Xây dựng web học tiếng Anh online

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƯỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG TRANG WEB HỌC TIẾNG ANH ONLINE SVTH : NGUYỄN TRỌNG ĐẠT MSSV : 16110049 SVTH : NGUYỄN DUY LÂM MSSV : 16110134 KHOÁ : 2016 - 2020 NGÀNH : CÔNG NGHỆ THÔNG TIN GVHD : ThS.NGUYỄN TRẦN THI VĂN Tp Hồ Chí Minh, tháng năm 2020 TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƯỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG TRANG WEB HỌC TIẾNG ANH ONLINE SVTH : NGUYỄN TRỌNG ĐẠT MSSV : 16110049 SVTH : NGUYỄN DUY LÂM MSSV : 16110134 KHOÁ : 2016 - 2020 NGÀNH : CÔNG NGHỆ THÔNG TIN GVHD : ThS.NGUYỄN TRẦN THI VĂN Tp Hồ Chí Minh, tháng năm 2020 LỜI CẢM ƠN Chúng em xin chân thành cảm ơn khoa Đào tạo Chất lượng cao, Ngành Công nghệ thông tin, chuyên ngành Công nghệ phầm mềm, trường Đại học Sư Phạm Kỹ Thuật Tp.HCM tạo điều kiện thuận lợi cho nhóm em thực đề tài Chúng em xin gửi lời cảm ơn chân thành đến thầy Nguyễn Trần Thi Văn, người tận tình bảo, định hướng hướng dẫn nhóm em thực đề tài Bên cạnh đó, nhóm em xin gửi lời cảm ơn đến thầy cô, người giảng dạy, tạo điều kiện cho em tích lũy kiến thức quý báu năm học qua Dù cố gắng hoàn thành đề tài khóa luận yêu cầu, thời gian hạn hẹp khả hạn chế nên chắn có thiếu sót khơng tránh khỏi Nhóm em mong nhận sự thơng cảm tận tình bảo thầy TP Hồ Chí Minh, tháng năm 2020 Nhóm sinh viên thực Nguyễn Trọng Đạt Nguyễn Duy Lâm iv TÓM TẮT ĐỒ ÁN TỐT NGHIỆP TIẾNG VIỆT Lý xây dựng đề tài: - Ngày nay, với sự phát triển mạnh mẽ kỷ nguyên công nghệ đem đến nhiều lợi ích đặc biệt cho việc học hỏi tiếp thu kiến thức Trong đó, hình thức học tiếng Anh nhà phương pháp nhiều người lựa chọn Phương pháp đặc biệt thích hợp dành cho người bận rộn, khơng có nhiều thời gian cho việc học tiếng Anh - Tiết kiệm nhiều thời gian cho người từ người có thời gian bận rộn khơng có thời gian học tập - Tận dụng thời gian để học tập ví dụ như: Trên xe bus … - Tiết kiệm chi phí: Học online tiết kiệm nhiều so với học trung tâm Mục tiêu đề tài: - Tìm hiểu ASP NETCORE Angular CLi - Vận dụng kiến thức tìm hiểu để vận dụng để xây dựng website học tiếng Anh Tiếp cận nghiên cứu: - Đối tượng nghiên cứu  Back-End: Net Core  Front-End: Angular CLI, Ant-Design(Ng-Zoro), Typescript - Phạm vi nghiên cứu: Với khoá luận tốt nghiệp này, nhóm em tập trung tìm hiểu thực nội dung sau:  Giới thiệu sơ lược trình bày nội dung bản, điểm mạnh, điểm yếu hay lợi ích mang lại cho nhà phát triển phần mềm NET Core  Tìm hiểu nội dung, kiến thức Angular CLI, Ant-Design(NgZoro), Typescript  Kết đạt được: Hiểu rõ kiến thức NET Core - Hiểu rõ kiến thức Angular CLI, Ant-Design(Ng-Zoro), Typescript - Xây dựng thành cơng website học tiếng Anh với tính năng:  Admin: CRUD câu hỏi, đề thi, vật phẩm, người dùng Quản lý thành tích Duyệt hố đơn  Client: Thực thi Mua vật phẩm cửa hàng Tích luỹ thành tích v TĨM TẮT ĐỒ ÁN TỐT NGHIỆP TIẾNH ANH Reason for constructing topic: - Today, the strong development of the technological age has brought many special benefits for learning and acquiring new knowledge In particular, the form of learning English at home is also the method that many people choose This method is especially suitable for busy people who not have much time for learning English - This learning method saves a lot of time for everyone from those who have busy time and not have time to study - Take advantage of all the time to study eg: On the bus - Cost savings: Learning online will save more than studying at the center Thesis objectives: - Build an English learning environment for everyone - Apply the knowledge learned to apply to build a website to learn English Approach and research: - Research subjects  Back-End: Net Core  Front-End: Angular CLI, Ant-Design(Ng-Zoro), Typescript - Research scope: With this graduation thesis, my team will focus on understanding and implementing the following:  Outline and present the basic content, strengths, weaknesses, or benefits for software developers of NET Core  Learn content and knowledge about Angular CLI, Ant-Design (NgZoro), Typescript Achievements: Understand the knowledge about NET Core - Understand the knowledge about Angular CLI, Ant-Design(Ng-Zoro), Typescript - Building a successful English learning website with the following features:  Admin: CRUD questions, exam, items, and users Achievement Management Browse the bill  Client: Take exams Buy items in the store Accumulated achievements vi MỤC LỤC NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP i PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN ii PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN iii LỜI CẢM ƠN iv TÓM TẮT ĐỒ ÁN TỐT NGHIỆP TIẾNG VIỆT v TÓM TẮT ĐỒ ÁN TỐT NGHIỆP TIẾNH ANH vi MỤC LỤC vii DANH MỤC CÁC TỪ VIẾT TẮT ix DANH SÁCH CÁC BIỂU ĐỒ VÀ HÌNH ẢNH x DANH SÁCH CÁC BẢNG xi MỞ ĐẦU 1 LÝ DO CHỌN ĐỀ TÀI MỤC TIÊU CỦA ĐỀ TÀI CÁCH TIẾP CẬN VÀ NGIÊN CỨU KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC PHẦN NỘI DUNG CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1.1 1.2 1.3 ANGULAR CLI ANT-DESIGN(NG-ZORRO) TYPESCRIPT 10 CHƯƠNG 2: XÁC ĐỊNH MƠ HÌNH VÀ HĨA YÊU CẦU 16 2.1 XÁC ĐỊNH YÊU CẦU 16 2.2 THIẾT KẾ USECASE DIAGRAM 26 2.3 ĐẶC TẢ USECASE 30 CHƯƠNG 3: THIẾT KẾ CƠ SỞ DỮ LIỆU 54 3.1 THIẾT KẾ DỮ LIỆU 54 3.2 MÔ TẢ CHI TIẾT CÁC BẢNG 56 CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 66 4.1 4.2 4.3 4.4 4.5 4.6 4.7 4.8 4.9 4.10 4.11 4.12 MÀN HÌNH QUẢN LÝ ĐỀ THI 66 MÀN HÌNH QUẢN LÝ CÂU HỎI 67 MÀN HÌNH QUẢN LÝ METADATA TYPE 68 MÀN HÌNH QUẢN LÝ METADATA VALUE 69 MÀN HÌNH QUẢN LÝ SẢN PHẨM 70 MÀN HÌNH QUẢN LÝ TẠO ĐỀ THI 71 MÀN HÌNH THÀNH TÍCH 72 MÀN HÌNH TRANG CHỦ 74 MÀN HÌNH CỬA HÀNG 75 MÀN HÌNH QUY TRÌNH ĐẶT HÀNG BƯỚC 76 MÀN HÌNH HIỂN THỊ QUY TRÌNH ĐẶT HÀNG BƯỚC 77 MÀN HÌNH QUẢN LÝ GIAO HÀNG THÀNH CƠNG 78 vii 4.13 4.14 4.15 4.16 4.17 4.18 4.19 4.20 4.21 MÀN HÌNH QUẢN LÝ HÓA ĐƠN 79 MÀN HÌNH LÀM BÀI THI 80 MÀN HÌNH LUYỆN TẬP 81 MÀN HÌNH XEM LẠI BÀI THI 82 MÀN HÌNH NGỮ PHÁP 83 MÀN HÌNH NGỮ PHÁP LÝ THUYẾT 83 MÀN HÌNH NGỮ PHÁP LUYỆN TẬP 84 MÀN HÌNH NGỮ PHÁP KIỂM TRA 85 MÀN HÌNH CẬP NHẬT MẬT KHẨU 86 CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ 88 5.1 CÀI ĐẶT MÔI TRƯỜNG LẬP TRÌNH 88 5.2 KIỂM THỬ 88 KẾT LUẬN 92 NHỮNG KẾT QUẢ ĐẠT ĐƯỢC 92 ƯU ĐIỂM 92 NHƯỢC ĐIỂM 92 HƯỚNG PHÁT TRIỂN 92 TÀI LIỆU THAM KHẢO 93 viii DANH MỤC CÁC TỪ VIẾT TẮT API: pplication Programming Interface PK: Primary key UC: Use case FE: FrontEnd BE: BackEnd TS: Typescript CRUD: Create , Read, Update, Delete ix DANH SÁCH CÁC BIỂU ĐỒ VÀ HÌNH ẢNH Hình 1.1: Kích thước Bundle ứng dụng Hello World với Angular Ivy khơng có Ivy Hình 1.2: Vị trí NET Core mơ hình phát triển NET Hình 2.1: Use case diagram Hình 2.2: Mơ hình sở liệu_a Hình 2.3: Mơ hình sở liệu_b -Hình 3.1: Mơ hình sở liệu Hình 3.2: Mơ hình sở liệu -Hình 4.1: Màn hình quản lý đề thi Hình 4.2: Màn hình quản lý câu hỏi Hình 4.3: Màn hình quản lý loại MetaDataType Hình 4.4: Màn hình quản lý MetaDataValue Hình 4.5: Màn hình quản lý sản phẩm Hình 4.6: Màn hình quản lý tạo đề thi Hình 4.7: Màn hình quản lý thành tích Hình 4.8: Màn hình trang chủ Hình 4.9: Màn hình cửa hàng Hình 4.10: Màn hình hiển thị quy trình giao hàng bước Hình 4.11: Màn hình hiển thị quy trình giao hàng bước Hình 4.12: Màn hình hiển thị quy trình giao hàng thành cơng Hình 4.13: Màn hình quản lý hóa đơn Hình 4.14: Màn hình làm thi Hình 4.15: Màn hình luyện tập Hình 4.16: Màn hình xem lại thi Hình 4.17: Màn hình ngữ pháp Hình 4.18: Màn hình ngữ pháp lý thuyết x DANH SÁCH CÁC BẢNG Bảng 2.1: Nhận diện tác nhân chức sơ đồ use case Bảng 2.2: Mô tả Actor Bảng 2.3: Mô tả Use case diagram Bảng 2.4: Đặt tả use case đăng kí Bảng 2.5: Đặt tả use case đăng nhập Bảng 2.6: Đặt tả use case leanr gramar Bảng 2.7: Đặt tả use case tournament Bảng 2.8: Đặt tả use case Buyproducts Bảng 2.9: Đặt tả use case toán Bảng 2.10: Đặt tả use case Achivement Bảng 2.11: Đặt tả use case Practice Bảng 2.12: Đặt tả use case Practice synthetic Bảng 2.13: Đặt tả use case Practice words Bảng 2.14: Đặt tả use case thêm tài khoản người dùng Bảng 2.15: Đặt tả use case xem tài khoản người dùng Bảng 2.16: Đặt tả use case xoá tài khoản người dùng Bảng 2.17: Đặt tả use case sửa tài khoản người dùng Bảng 2.18: Đặt tả use case tìm kiếm tài khoản người dùng Bảng 2.19: Đặt tả use case thêm câu hỏi Bảng 2.20: Đặt tả use case xem câu hỏi Bảng 2.21: Đặt tả use case xoá câu hỏi Bảng 2.22: Đặt tả use case sửa câu hỏi Bảng 2.23: Đặt tả use case tìm kiếm câu hỏi Bảng 2.24: Đặt tả use case thêm sản phẩm Bảng 2.25: Đặt tả use case xem sản phẩm Bảng 2.26: Đặt tả use case xoá sản phẩm Bảng 2.27: Đặt tả use case sửa sản phẩm Bảng 2.28: Đặt tả use case tìm kiếm sản phẩm Bảng 2.29: Đặt tả use case thêm đề thi Bảng 2.30: Đặt tả use case xem đề thi Bảng 2.31: Đặt tả use case xoá đề thi Bảng 2.32: Đặt tả use case sửa đề thi Bảng 2.33: Đặt tả use case tìm kiếm đề thi -Bảng 3.1: Bảng Users Bảng 3.2: Bảng Products Bảng 3.3: Bảng Bills Bảng 3.4: Bảng Tournament Bảng 3.5: Bảng UserTournametsMapping xi 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 4.14 MÀN HÌNH LÀM BÀI THI Hình 4.14: Màn hình làm thi Bảng 4.27: Bảng thơng tin đối tượng hình làm thi STT Tên đối tượng giao diện Thao tác thoát Đề thi Radio check đáp án Đồng hồ countdown Thao tác chọn câu hỏi Thao tác nộp Loại đối tượng mã Thẻ Thẻ < a> Thẻ Thẻ Thẻ Thẻ Ghi - Thiết kế xử lý Bảng 4.28: Bảng thiết kế xử lý hình làm thi STT Tên xử lý Thốt Chọn đáp án Chuyển câu hỏi Nộp Điều kiện thực Khi click vào button rời khỏi phần làm thi Click vào chọn radio box để chọn đáp án Click vào chuyển tới câu hỏi Kết thúc thi Ghi 80 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 4.15 MÀN HÌNH LUYỆN TẬP Hình 4.15: Màn hình luyện tập Bảng 4.29: Bảng thơng tin đối tượng hình làm thi STT Tên đối tượng giao diện Thao tác bắt đầu Người dùng xếp hạng Tên luyện tập Bảng xếp hạng Loại đối tượng mã Thẻ Thẻ < div> Thẻ Thẻ Ghi - Thiết kế xử lý Bảng 4.30: Bảng thiết kế xử lý hình làm thi STT Tên xử lý Bắt đầu Xếp hạng Điều kiện thực Khi click vào button bắt đầu thi Khi hoàn thành thi xếp hạng Ghi 81 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 4.16 MÀN HÌNH XEM LẠI BÀI THI Hình 4.16: Màn hình xem lại thi Bảng 4.31: Bảng thông tin đối tượng hình xem lại thi STT Tên đối tượng giao diện Thao tác thoát Đề thi Radio check đáp án Đồng hồ countdown Thao tác chọn câu hỏi Thao tác nộp Loại đối tượng mã Thẻ Thẻ < a> Thẻ Thẻ Thẻ Thẻ Ghi - Thiết kế xử lý Bảng 4.32: Bảng thiết kế xử lý hình xem lại thi STT Tên xử lý Thoát Chọn đáp án Xem lại đáp án Nộp Điều kiện thực Khi click vào button rời khỏi phần làm thi Click vào chọn radio box để chọn đáp án Nếu đáp án chuyển thành màu “green” sai chuyển thành “red” Kết thúc thi Ghi 82 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 4.17 MÀN HÌNH NGỮ PHÁP Hình 4.17: Màn hình ngữ pháp Bảng 4.33: Bảng thơng tin đối tượng hình ngữ pháp STT Tên đối tượng giao diện Hình tượng trưng ngữ pháp Tên ngữ pháp Bắt đầu Loại đối tượng mã Thẻ Thẻ < span> Thẻ Ghi - Thiết kế xử lý Bảng 4.34: Bảng thiết kế xử lý hình ngữ pháp STT 4.18 Tên xử lý Bắt đầu Điều kiện thực Khi click vào button bắt đầu thi Ghi MÀN HÌNH NGỮ PHÁP LÝ THUYẾT Hình 4.18: Màn hình ngữ pháp lý thuyết 83 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ Bảng 4.35: Bảng thông tin đối tượng hình ngữ pháp lý thuyết STT Tên đối tượng giao diện Thao tác thoát Thao tác Step lý thuyết Step Luyện tập Step Kiểm tra Tên ngữ pháp Công thức Dạng câu Công thức Loại đối tượng mã Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Ghi - Thiết kế xử lý Bảng 4.36: Bảng thiết kế xử lý hình ngữ pháp lý thuyết STT Tên xử lý Thoát Tiếp theo Step lý thuyết Step luyện tập Step Kiểm tra 4.19 Điều kiện thực Khi click vào button rời khỏi phần làm thi Click vào chuyển đến luyện tập Đến page lý thuyết Disable Disable Ghi MÀN HÌNH NGỮ PHÁP LUYỆN TẬP Hình 4.19: Màn hình ngữ pháp luyện tập Bảng 4.37: Bảng thông tin đối tượng hình ngữ pháp luyện tập STT Tên đối tượng giao diện Thao tác quay lại Loại đối tượng mã Thẻ Ghi 84 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ Thao tác Step lý thuyết Step Luyện tập Step Kiểm tra Ảnh tượng trưng Số câu Thao tác bắt đầu Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ - Thiết kế xử lý Bảng 4.38: Bảng thiết kế xử lý hình ngữ pháp luyện tập STT Tên xử lý Quay lại Tiếp theo Step lý thuyết Step luyện tập Step Kiểm tra Bắt đầu 4.20 Điều kiện thực Khi click vào button quay lại phần lý thuyết Click vào chuyển đến luyện tập Disable Đến page luyện tập Disable Bắt đầu luyện tập Ghi MÀN HÌNH NGỮ PHÁP KIỂM TRA Hình 4.20: Màn hình ngữ pháp kiểm tra Bảng 4.39: Bảng thơng tin đối tượng hình ngữ pháp kiểm tra STT Tên đối tượng giao diện Thao tác quay lại Loại đối tượng mã Thẻ Ghi 85 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ Thao tác Step lý thuyết Step Luyện tập Step Kiểm tra Ảnh tượng trưng Số câu Thao tác bắt đầu Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ - Thiết kế xử lý Bảng 4.40: Bảng thiết kế xử lý hình ngữ pháp kiểm tra STT Tên xử lý Quay lại Tiếp theo Step lý thuyết Step luyện tập Step Kiểm tra Bắt đầu 4.21 Điều kiện thực Khi click vào button quay lại phần lý thuyết Click vào chuyển đến luyện tập Disable Đến page luyện tập Disable Bắt đầu luyện tập Ghi MÀN HÌNH CẬP NHẬT MẬT KHẨU Hình 4.21: Màn hình cập nhật mật Bảng 4.41: Bảng thơng tin đối tượng hình cập nhật mật STT Tên đối tượng giao diện Thao tác lưu thay đổi Nhập mật Nhập mật Navigate Hồ sơ Navigate Thành tích Navigate Ngữ pháp Navigate Mật Loại đối tượng mã Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Thẻ Ghi 86 4.CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ - Thiết kế xử lý Bảng 4.42: Bảng thiết kế xử lý hình cập nhật mật STT Tên xử lý Quay lại Tiếp theo Step lý thuyết Step luyện tập Step Kiểm tra Bắt đầu Điều kiện thực Khi click vào button quay lại phần lý thuyết Click vào chuyển đến luyện tập Disable Đến page luyện tập Disable Bắt đầu luyện tập Ghi 87 CHƯƠNG 5: CÀI ĐẶT KIỂM THỬ CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ 5.1 CÀI ĐẶT MƠI TRƯỜNG LẬP TRÌNH - Hệ điều hành: Window 10 - Visual studio 2015 ++ - Visual code - Sql Server Login with : • Admin : username: admin, password: admin • Client: username: datnguyen, password: datnguyen 5.2 KIỂM THỬ - Nhóm lên kế hoạch kiểm thử (lập Test Plan, Test Case chi tiết) website Vì số lượng có hai thành viên nên nhóm tổ chức kiểm thử chéo Thành viên đảm nhiệm lập trình chức kiểm thử thành viên lại ngược lại Dưới số test case tiêu biểu kiểm thử: 5.2.1 Test case hình Login Bảng 5.1: Bảng test case hình login Test case Test case ID description Thực đăng LOG_01 đăng nhập account chưa đăng kí Kiểm tra đăng nhập với password sai LOG_02 Test steps Truy cập vào hệ thống Thực đăng nhập account chưa đăng kí Truy cập vào hệ thống Thực đăng nhập với password sai Expected Result Thông báo lên form “Tài khoản không tồn tại” Thông báo lên form “Mật sai vui lòng nhập lại” 88 CHƯƠNG 5: CÀI ĐẶT KIỂM THỬ Kiểm tra User đăng Nhập username với Thông báo đăng nhập thành công pass nhập thành cơng Nhấn button “Login” Hiển thị hình LOG _02 admin Kiểm tra password LOG_03 Nhập password sai validation Thông báo lỗi: validation “Mật bạn chứa kí tự tuần tự 5.2.2 Test case Thêm sản phẩm Bảng 5.2: Bảng test case Thêm câu hỏi Test case Test case ID description Không nhập mã Add_01 sản phẩm Test steps Đăng nhập vào trang admin Nhấn button thêm Hiện thị modal để nhập Expected Result Thông báo lên form “Yêu cầu nhập mã câu hỏi” thông tin sản phẩm cần thêm Nhập tất thiếu mã sản phẩm Không import ảnh Đăng nhập vào trang admin Nhấn button thêm Hiện thị modal để nhập Add_02 Thông báo lên form “Yêu cầu import ảnh” thông tin sản phẩm cần thêm Nhập tất thiếu ảnh Nhập vào giá sản phẩm chữ Add _03 Đăng nhập vào trang admin Nhấn button thêm Thông báo lên form Hiện thị modal để nhập “Giá không hợp lệ” thông tin sản phẩm cần thêm 4.Nhập vào ô giá “sadas” 89 CHƯƠNG 5: CÀI ĐẶT KIỂM THỬ 5.2.3 Test case Giỏ hàng Bảng 5.3: Bảng test case giỏ hàng Test case Test case ID description Cart_01 Cart_02 Test steps Expected Result Khi khách hàng Vào trang sản phẩm Thông báo lên form không đăng nhập Tiến hành “Chọn mua “u hàng” cầu đăng nhập” Khơng có hàng Đăng nhập thành cơng Sẽ khơng hiển thị hóa giỏ hàng Click vào giỏ hàng button “Tiến hành mua hàng.” 5.2.4 Test case Luyện tập Bảng 5.4: Bảng test case giỏ hàng Test case ID Test case description Exercies_01 Cart_02 Test steps Expected Result Khi người dùng Vào trang luyện tập Thông báo lên form không đăng nhập Tiến hành “bắt đầu” “Yêu cầu đăng nhập” Khơng có hàng Đăng nhập thành cơng Sẽ khơng hiển thị hóa giỏ hàng Click vào giỏ hàng button “Tiến hành mua hàng.” 90 CHƯƠNG 5: CÀI ĐẶT KIỂM THỬ 5.2.5 Test case thêm đề thi Bảng 5.5: Bảng test case giỏ hàng Test case ID Test case Test steps description AddExam_0 AddExam_02 Expected Result Khi admin không Vào trang admin Thông báo lên form đăng nhập Yêu cầu đăng nhập “Yêu cầu đăng nhập” Khơng có chọn Vào trang admin Thơng báo thêm câu hỏi Đăng nhập câu hỏi Click vào thêm đề thi Không chọn câu hỏi 91 KẾT LUẬN NHỮNG KẾT QUẢ ĐẠT ĐƯỢC - Hiểu rõ Angular CLI, ANT-DESGIN(NG-ZORRO), Typescript - Hiểu ASP NetCore áp dụng mơ hình MVVM - Xây dựng thành công website học tiếng Anh với cơng nghệ tìm hiểu ƯU ĐIỂM - Áp dụng kiến thức tìm hiểu vào khố luận Xây dựng website học tiếng Anh Có thể đăng nhập google facebook Phía Admin hoàn thiện chức ( Thêm, Sửa, Xóa, Tìm kiếm) sản phẩm, câu hỏi đề thi, người dùng Quản lý thành tích theo người dùng Và duyệt hố đơn Phía người dùng học tập, luyện tập , mua hàng Client luyện tập loại ngữ pháp khác Có thể dùng điểm đổi thưởng vật phẩm ví dụ: Sách Khi hoàn thành luyện tập nhận kinh nghiệm tích luỹ thành tích Khi hồn thành thành tích thưởng vàng kinh nghiệm Cập nhật profile người dùng - NHƯỢC ĐIỂM Giao diện phía người dùng chưa tốt - Chưa gửi thông báo cho người dùng qua mail - Đọc file exel câu hỏi đề thi - HƯỚNG PHÁT TRIỂN Khắc phục nhược điểm nêu - - Nhóm cải thiện giao diện để đạt chuẩn UX/UI - Nhóm thiết kế giao diện để chuẩn responsive thiết bị mobile - Bên cạnh đó, cải tiến code để tốc độ xử lý request trả response nhanh 92 TÀI LIỆU THAM KHẢO Tiếng việt [1] Tham khảo documents angular https://angular.io/docs [2] Tham khảo document NetCore https://docs.microsoft.com/vivn/dotnet/core/ [3] Sử dụng UI ng-zorro https://ng.ant.design/docs/introduce/en [4] Áp dụng mơ hình MVMM https://docs.microsoft.com/enus/aspnet/mvc/overview/getting-started/introduction/getting-started [5] Sử dụng hangfire https://docs.hangfire.io/en/latest/ [6] Áp dụng Repository Pattern C# https://codewithshadman.com/repositorypattern-csharp/ Tiếng anh [1] Referance documents angular at https://angular.io/docs [2] Referance document NetCore at https://docs.microsoft.com/vi[3] [4] [5] [6] vn/dotnet/core/ Using UI ng-zorro at https://ng.ant.design/docs/introduce/en Apply the model MVMM https://docs.microsoft.com/enus/aspnet/mvc/overview/getting-started/introduction/getting-started Using hangfire at https://docs.hangfire.io/en/latest/ Apply Repository Pattern C# https://codewithshadman.com/repositorypattern-csharp/ 93 S K L 0