Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 113 trang
THÔNG TIN TÀI LIỆU
Thông tin cơ bản
Định dạng
Số trang
113
Dung lượng
6,3 MB
Nội dung
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 WEBSITE QUẢN LÝ TRUNG TÂM ANH NGỮ SỬ DỤNG MEAN STACK GVHD:NGUYỄN TRẦN THI VĂN SVTH:TRẦN VIẾT BẢO MSSV: 16110017 SVTH:ĐOÀN VĂN HIỆP MSSV: 16110074 SKL0 Tp Hồ Chí Minh, tháng 07/2020 an z TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM KHOA ĐÀO TẠO CHẤT LƯỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG WEBSITE QUẢN LÝ TRUNG TÂM ANH NGỮ SỬ DỤNG MEAN STACK SVTH : TRẦN VIẾT BẢO MSSV : 16110017 SVTH : ĐỒN VĂN HIỆP MSSV : 16110074 Khóa : 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 07 năm 2020 an z TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM KHOA ĐÀO TẠO CHẤT LƯỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG WEBSITE QUẢN LÝ TRUNG TÂM ANH NGỮ SỬ DỤNG MEAN STACK SVTH : TRẦN VIẾT BẢO MSSV : 16110017 SVTH : ĐOÀN VĂN HIỆP MSSV : 16110074 Khóa : 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 07 năm 2020 an CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh phúc *** -TP Hồ Chí Minh, ngày … tháng … năm 2020 NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP Họ tên sinh viên MSSV Lớp Trần Viết Bảo 16110017 16110CLST2 Đoàn Văn Hiệp 16110074 16110CLST2 Ngành: Công nghệ thông tin Giáo viên hướng dẫn: ThS Nguyễn Trần Thi Văn ĐT: 0983 11 80 25 Ngày nhận đề tài: 24/02/2020 Ngày nộp đề tài: 01/07/2020 Tên đề tài: Xây dựng website quản lý trung tâm Anh ngữ sử dụng MEAN Stack Nội dung thực đề tài: Lý thuyết: Tìm hiểu sử dụng cơng nghệ MEAN Stack Nghiên cứu sử dụng RESTful API Thực hành: Phân tích chức nghiệp vụ mơ hình trung tâm tiếng Anh Xây dựng chức cho trang quản lý trung tâm Kiểm thử Báo cáo sản phẩm Sản phẩm: Trang quản lí thơng tin trung tâm Anh ngữ Trang giao diện trung tâm để người dùng tương tác với khóa học Phần API xử lý chức TRƯỞNG NGÀNH GIÁO VIÊN HƯỚNG DẪN (Ký ghi rõ họ tên) (Ký ghi rõ họ tên) an CỘNG HOÀ 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 : Trần Viết Bảo MSSV 1: 16110017 Họ tên Sinh viên : Đồn Văn Hiệp MSSV 2: 16110074 Ngành: Cơng nghệ Thông tin Tên đề tài : Xây dựng website quản lý trung tâm Anh ngữ sử dụng MEAN Stack Họ tên Giáo viên hướng dẫn : Th.S Nguyễn Trần Thi Văn NHẬN XÉT Về nội dung đề tài & khối lượng thực : Ưu điểm : Khuyết điểm : Đề nghị cho bảo vệ hay không ? Đánh giá loại : Điểm : ( Bằng chữ: ) Tp Hồ Chí Minh, ngày…tháng… năm 2020 Giáo viên hướng dẫn (Ký & ghi rõ họ tên) an CỘNG HOÀ 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 : Trần Viết Bảo MSSV 1: 16110017 Họ tên Sinh viên : Đồn Văn Hiệp MSSV 2: 16110074 Ngành: Cơng nghệ Thông tin Tên đề tài : Xây dựng website quản lý trung tâm Anh ngữ sử dụng MEAN Stack Họ tên Giáo viên phản biện: NHẬN XÉT Về nội dung đề tài & khối lượng thực : Ưu điểm : Khuyết điểm : Đề nghị cho bảo vệ hay không ? Đánh giá loại : Điểm : ( Bằng chữ: ) Tp Hồ Chí Minh, ngày…tháng…năm 2020 Giáo viên phản biện (Ký & ghi rõ họ tên) an LỜI CẢM ƠN Có thể hồn thành đề tài khóa luận, khơng thể khơng nói đến hướng dẫn tận tình q thầy khoa Công Nghệ Thông Tin, trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh Chúng em chân thành cảm ơn Trước hết, chúng em tỏ lòng biết ơn sâu sắc đến thầy Nguyễn Đăng Quang – Trưởng ngành Công Nghệ Thông Tin, trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh thầy Nguyễn Trần Thi Văn – Giảng viê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ận tình hướng dẫn, truyền đạt kiến thức quý báu để nhóm thực trọn vẹn đề tài Với kiến thức, nhận xét giúp chúng em chỉnh sửa, khắc phục thiếu sót học hỏi thêm kiến thức thực tế Cuối cùng, nhóm xin kính chúc q thầy có nhiều sức khỏe thành công sứ mệnh tiếp bước cho hệ kiến thức, kinh nghiệm quý báu Chúng em xin chân thành cảm ơn Thành phố Hồ Chí Minh, ngày 27 tháng 06 năm 2020 Trần Viết Bảo, Đoàn Văn Hiệp i an TÓM TẮT ĐỒ ÁN TỐT NGHIỆP Đề tài: Xây dựng website quản lý trung tâm Anh ngữ Các vấn đề nghiên cứu Tìm hiểu Angular, Nodejs, RESTful API Express framework Mơ hình, chức nghiệp vụ trung tâm giảng dạy tiếng Anh API bên thứ ba Momo, CAPTCHA, Google Drive Các vấn đề cần giải Xây dựng ứng dụng cho phép chủ sở hữu quản lý thông tin trung tâm Bảo mật thông tin Phân quyền truy cập để giảng viên, nhân viên sử dụng Xử lý yêu cầu nhanh, hạn chế lỗi Gửi thông báo, tài liệu cho học viên Các phương pháp giải vấn đề Xây dựng ứng dụng web để dễ dàng quản lý thông tin trung tâm Sử dụng JSON web token để tăng tính bảo mật Sử dụng MEAN Stack giúp tạo trang web nhanh mạnh mẽ Sử dụng mail server Google để gửi mail Kết đạt Hoành thành trang web quản lý trung tâm Anh ngữ với chức quản lý thông tin, thống kê, gửi thông báo cho học viên Một trang web dành cho người dùng đăng kí khóa học tương tác với trung tâm Phân quyền chức cho người quản trị, giảng viên nhân viên Kết luận Mọi thông tin trung tâm xử lý đưa lên trang web quản lý giúp chủ sỡ hữu có nhìn định hướng phát triển, hạn chế sai sót, tiết kiệm nhiều thời gian công sức việc quản lý ii an TÓM TẮT ĐỒ ÁN BẰNG TIẾNG ANH(ABSTRACT) Researches to conduct: Angular, Nodejs, RESTful API and Express framework Models, functional operation of the English centers Third party APIs like Momo, CAPTCHA, Google Drive Problems to solve: Building applications that allow owners to manage information of the center Assigning access to lecturers and staff Handling requests quickly, limiting errors Sending notices and documents to students Solutions: Build a web application for easy management of the center's information Use JSON web token for increase security Use MEAN Stack helps create fast and powerful websites Use Google's mail server to send mail Achivements: Establishment of an English center management website with information management, statistics and notifications for students A website for users to register for courses and to interact with the center Decentralization functions to administrators, lecturers and staff Conclusion: All information of the center is processed and posted on the management website to help owners have a view of the development orientation, limiting errors, saving a lot of time and effort in management iii an 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 i TÓM TẮT ĐỒ ÁN TỐT NGHIỆP ii TÓM TẮT ĐỒ ÁN BẰNG TIẾNG ANH(ABSTRACT) iii MỤC LỤC iv DANH MỤC CÁC CHỮ VIẾT TẮT vii DANH MỤC CÁC BẢNG BIỂU viii DANH MỤC CÁC HÌNH ẢNH, BIỂU ĐỒ x Chương 1: TỔNG QUAN 1.1 Mục tiêu đề tài 1.2 Mô tả ứng dụng web Chương 2: CƠ SỞ LÝ THUYẾT 2.1 Nền tảng phát triển 2.2 Thư viện sử dụng 2.2 Công nghệ sử dụng 2.2.1 Nodejs 2.2.2 Express 2.2.3 MongoDB 2.2.4 Angular 2.2.5 Dịch vụ bên Chương 3: XÁC ĐỊNH VÀ MƠ HÌNH HĨA U CẦU 10 3.1 Yêu cầu người dùng 10 iv an Chương 5: Cài đặt kiểm thử Chương 5: CÀI ĐẶT VÀ KIỂM THỬ 5.1 Cài đặt 5.1.1 Cài đặt MongoDB Bước 1: Truy cập trang chủ MongoDB https://www.mongodb.com/ tải gói cài đặt MongoDB Shell tiến hành cài đặt Bước 2: Vì MongoDB chưa hỗ trợ GUI nên ta cần tải thêm Robo 3T để thao tác quản lý liệu dễ dàng Truy cập trang web https://robomongo.org/ để tải tiến hành cài đặt Bước 3: Sau hoàn thành bước hai, ta khởi động ứng dụng Robo 3T, hình có xuất kết nối cài đặt thành cơng, cịn khơng xuất kết nối cần kiểm tra lại phần cài đặt NodeJS Hình 5.1 Kiểm tra MongoDB Robo 3T 5.1.2 Cài đặt NodeJS Bước 1: Để cài đặt, ta vào trang tải NodeJS https://nodejs.org/en/download/, chọn phiên phù hợp với hệ điều hành máy tính, tiến hành tải cài đặt Bước 2: Sau cài đặt hoàn tất, để kiểm tra xem q trình cài đặt thành cơng hay khơng, ta khởi động Command Prompt gõ dịng lệnh hình 82 an Chương 5: Cài đặt kiểm thử Hình 5.2 Kiểm tra NodeJS Nếu hình Command Prompt hiển thị phiên NodeJS q trình cài đặt thành cơng, cịn xuất lỗi cần xem lại trình cài đặt 5.1.3 Cài đặt frameworks ExpressJS 5.1.3.1 Cài đặt NPM Vì trình cài đặt NodeJS bao gồm gói cài đặt NPM, để kiểm tra NPM có máy tính ta gõ lệnh hình Hình 5.3 Kiểm tra NPM Nếu hình Command Prompt hiển thị phiên NPM trình cài đặt thành cơng, cịn xuất lỗi cần xem lại trình cài đặt 5.1.3.2 Cài đặt Visual Studio Code Bước 1: Vào trang tải Visual Studio Code https://code.visualstudio.com/download, chọn gói cài đặt tương ứng với hệ điều hành máy tính tiến hành tải Bước 2: Cài đặt gói vừa tải Bước 3: Sau cài đặt, nhấn vào biểu tượng Visual Studio Code để mở ứng dụng 83 an Chương 5: Cài đặt kiểm thử 5.1.3.3 Cài đặt frameworks ExpressJS Bước 1: Ở cửa sổ Terminal Visual Studio Code, ta gõ lệnh npm init, sau nhập tên gói muốn tải về, cụ thể express nên ta nhập vào express phần “package name” nhấn Enter Hình 5.4 Tiến hành cài đặt Express Bước 2: Sau thực xong, ta thấy hệ thống tự sinh file có tên package.json Bước 3: Kiểm tra file package.json để thấy phiên Express trình cài đặt thành cơng Hình 5.5 Cài đặt Express thành cơng 5.1.4 Cài đặt Angular Bước 1: Mở ứng dụng Visual Studio Code, phần terminal, gõ dòng lệnh “npm install -g @angular/cli” để tiến hành cài đặt Angular (Nếu có phát sinh lỗi hệ điều hành Linux thiếu quyền, ta nên thêm “sudo” trước câu lệnh để cài đặt quyền Administrator) Bước 2: Sau cài đặt xong, phần terminal, ta gõ dịng lệnh hình 84 an Chương 5: Cài đặt kiểm thử Hình 5.6 Kiểm tra phiên Angular Bước 3: Nếu hình terminal xuất thơng số hình ta cài đặt Angular thành công 85 an Chương 5: Cài đặt kiểm thử 5.2 Kế hoạch kiểm thử 5.2.1 Danh sách loại kiểm thử Kiểm thử giao diện (User interface test) Kiểm thử chức (Function test) Kiểm thử tính tồn vẹn liệu (Data and database integrity testing) 5.2.2 Môi trường kiểm thử Hệ điều hành: Windows 10 Trình duyệt: Google Chrome (ver 83.0 64-bit) 5.3 Thiết kế kiểm thử Bảng 5.1: Các chức kiểm thử Chức kiểm thử Đăng nhập Thêm học viên Chỉnh sửa lớp học Gửi mail cho học viên STT 5.4 Trường hợp kiểm thử 5.4.1 Đăng nhập Tiền điều kiện: o Thiết bị kiểm thử có kết nối internet Bảng 5.2: Test case đăng nhập Mã testcase DN_001 DN_002 DN_003 DN_004 DN_005 Mô tả Thực Kết mong đợi Kiểm tra giao Thao tác phần tử Các input nhập diện giao diện đăng nhập được, nút đăng nhập thực chức Kiểm tra thứ tự Ở hình đăng nhập, Thứ tự di chuyển phần di chuyển nhấn tab quan sát tử từ xuống phần tử nhấn Tab Kiểm tra phím Ở hình đăng nhập, Thơng báo lỗi đăng nhập Enter nhấn vào input Tên tài khoản nhấn Enter Kiểm tra input Ở hình đăng nhập, Thơng báo lỗi đăng nhập trống nhấn đăng nhập Kiểm tra viết Ở hình đăng nhập, Thơng báo lỗi đăng nhập hoa chữ đầu đăng nhập với tên tài 86 an Chương 5: Cài đặt kiểm thử DN_006 DN_007 DN_008 tên tài khoản Kiểm tra viết hoa chữ đầu mật Kiểm tra viết hoa chữ cuối tên tài khoản Kiểm tra viết hoa chữ cuối mật Kiểm tra kí tự đặc biệt khoản viết hoa chữ đầu Ở hình đăng nhập, Thông báo lỗi đăng nhập đăng nhập với mật viết hoa chữ đầu Ở hình đăng nhập, Thông báo lỗi đăng nhập đăng nhập với tên tài khoản viết hoa chữ cuối Ở hình đăng nhập, Thơng báo lỗi đăng nhập đăng nhập với mật viết hoa chữ cuối Đăng nhập với tên đăng Thông báo lỗi đăng nhập nhập thêm kí tự đặc biệt DN_010 Nhập tên Đăng nhập với tên đăng Thông báo lỗi đăng nhập tài khoản nhập mật không sai mật DN_011 Nhập tên Đăng nhập với tên đăng Thông báo lỗi đăng nhập tài khoản nhập mật tài mật khoản khác tài khoản khác DN_012 Nhập tên tài Đăng nhập với tên đăng Thông báo lỗi đăng nhập khoản nhập mật để không nhập mật trống DN_013 Nhập mật Đăng nhập với mật Thông báo lỗi đăng nhập không tên đăng nhập để trống nhập tên tài khoản DN_014 Đăng nhập với Tên tài khoản có dấu Tài khoản khơng tồn tên tài khoản có dấu DN_014 Đăng nhập với Đăng nhập với tên đăng Đăng nhập thành công, tên đăng nhập nhập mật chuyển sang trang quản lý mật với sở liệu 5.4.2 Thêm học viên Tiền điều kiện: DN_009 87 an Chương 5: Cài đặt kiểm thử o Thiết bị kiểm thử có kết nối internet o Đăng nhập vào hệ thống với quyền admin, nhân viên Bảng 5.3: Test case thêm học viên Mô tả Kiểm tra phần tử form thêm học viên Thêm học viên mà khơng nhập liệu Thêm học viên mà không nhập tên học viên Thực Kết mong đợi Thao tác với phần tử Các phần tử thao tác form thêm học viên THV_004 Thêm học viên mà khơng nhập khóa học Thông báo lỗi thêm học viên THV_005 Thêm học viên mà không nhập tên lớp THV_006 Thêm học viên mà không nhập lớp học THV_007 Tên học viên số THV_008 Tên học viên có chứa kí tự đặc biệt Email học viên không cấu trúc Hiển thị học phí Mã testcase THV_001 THV_002 THV_003 THV_009 THV_010 Ở form tạo học viên, nhấn Thông báo lỗi thêm học nút Thêm viên Ở form tạo học viên, nhập đầy đủ thông tin học viên không nhập tên học viên, nhấn nút Thêm Ở form tạo học viên, nhập đầy đủ thơng tin học viên khơng chọn khóa học, nhấn nút Thêm Ở form tạo học viên, nhập đầy đủ thông tin học viên không chọn lớp, nhấn nút Thêm Ở form tạo học viên, nhập đầy đủ thông tin học viên không chọn lớp học, nhấn nút Thêm Ở form tạo học viên, nhập tên học viên số, nhấn nút Thêm Ở form tạo học viên, nhập tên học viên kí tự đặc biệt, nhấn nút Thêm Ở form tạo học viên, nhập email học viên khơng có tên miền, nhấn nút Thêm Ở form thêm học viên, sau chọn khóa học lớp học, số tiền học phí hiển thị input Thông báo lỗi thêm học viên Thông báo lỗi thêm học viên Thông báo lỗi thêm học viên Thông báo lỗi tên học viên không hợp lệ Thông báo lỗi tên học viên không hợp lệ Thông báo lỗi email khơng hợp lệ Hiển thị học phí tương ứng với khóa học 88 an Chương 5: Cài đặt kiểm thử THV_011 THV_011 Không nhập số Ở form tạo học viên, điện thoại không số điện thoại, nhấn nút Thêm Nhập đầy đủ Ở form tạo học viên, nhập thông tin đầy đủ thông tin mà form yêu cầu yêu cầu Thông báo lỗi số điện thoại không hợp lệ Thông báo thêm học viên thành công 5.4.3 Chỉnh sửa lớp học Tiền điều kiện: o Thiết bị kiểm thử có kết nối internet o Đã đăng nhập vào hệ thống với quyền admin Bảng 5.4: Test case chỉnh sửa lớp học Mã testcase CSLH_001 CSLH_001 CSLH_002 CSLH_003 CSLH_004 Mô tả Kiểm tra phần tử form Chỉnh sửa mã lớp học Chỉnh sửa mã lớp học thành rỗng Kiểm tra danh sách phòng học Chỉnh sửa ngày khai giảng CSLH_005 Chỉnh sửa ngày bế giảng CSLH_006 Chỉnh sửa ngày khai giảng sau ngày bế giảng CSLH_007 Chỉnh sửa ngày bế giảng trước ngày khai giảng Chỉnh sửa giảng viên CSLH_008 Thực Kết mong đợi Thao tác với phần tử Các phần tử thao tác form thêm học viên Trên form chỉnh sửa lớp học, chỉnh sửa mã lớp học Trên form chỉnh sửa lớp học, chỉnh sửa mã lớp học thành rỗng Trên form chỉnh sửa lớp học, chọn phòng học Trên form chỉnh sửa lớp học, sửa ngày khai giảng thành ngày khác Trên form chỉnh sửa lớp học, sửa ngày bế giảng thành ngày khác Trên form chỉnh sửa lớp học, sửa ngày khai giảng thành ngày sau ngày bế giảng Trên form chỉnh sửa lớp học, sửa ngày bế giảng thành ngày trước ngày khai giảng Trên form chỉnh sửa lớp học, sửa thành giảng viên khác Chỉnh sửa thành công Thông báo lỗi mã lớp học không hợp lệ Liệt kê đầy đủ phịng học có hệ thống Chỉnh sửa thành công Chỉnh sửa thành công Thông báo lỗi ngày khai giảng sau ngày bế giảng Thông báo lỗi ngày bế giảng trước ngày khai giảng Chỉnh sửa thành công 89 an Chương 5: Cài đặt kiểm thử CSLH_009 CSLH_010 CSLH_011 CSLH_012 CSLH_013 Chỉnh sửa giảng viên trùng lịch Chỉnh sửa trùng phòng học với lớp học khác Kiểm tra chức đề xuất Trên form chỉnh sửa lớp học, chỉnh sửa giảng viên có lịch vào ca học Trên form chỉnh sửa lớp học, chỉnh sửa phòng học trùng với phòng học lớp khác vào ca học Trên form chỉnh sửa lớp học, chọn biểu tượng bên cạnh giảng viên để đề xuất phòng học giảng viên phù hợp Chỉnh sửa ghi Trên form chỉnh sửa lớp học, thay đổi giá trị input ghi Liệt kê danh Trên form chỉnh sửa lớp sách giảng học, chọn select Giảng viên viên để xem danh sách giảng viên Thông báo lỗi trùng lịch Thông báo lỗi phòng học sử dụng Chức đề xuất hoạt động Chỉnh sửa thành công Liệt kê đầy đủ giảng viên 5.4.4 Chỉnh sửa thông tin cá nhân Tiền điều kiện: o Thiết bị kiểm thử có kết nối internet o Đã đăng nhập vào hệ thống Bảng 5.5: Test case chỉnh sửa thông tin cá nhân Mã testcase CSTT_001 CSTT_002 CSTT_003 CSTT_004 Mô tả Thực Kiểm tra Thao tác với phần tử phần tử trên form chỉnh sửa thông form tin cá nhân Chỉnh sửa họ Ở form chỉnh sửa thông tin tên cá nhân, sửa họ tên nhấn nút Cập nhật Chỉnh sửa họ Ở form chỉnh sửa thông tin tên thành rỗng cá nhân, sửa họ tên thành rỗng nhấn nút Cập nhật Chỉnh sửa họ Ở form chỉnh sửa thơng tin tên có số cá nhân, chỉnh sửa họ tên có số nhấn nút Cập nhật Kết mong đợi Các phần tử thao tác Hiển thị thông báo chỉnh sửa thành công Hiển thi thông báo lỗi họ tên không hợp lệ Hiển thi thông báo lỗi họ tên không hợp lệ 90 an Chương 5: Cài đặt kiểm thử CSTT_005 CSTT_006 CSTT_007 CSTT_008 CSTT_009 CSTT_010 CSTT_011 CSTT_012 CSTT_013 5.5 Chỉnh sửa họ Ở form chỉnh sửa thơng tin tên có kí tự đặc cá nhân, chỉnh sửa họ tên biệt có kí tự đặc biệt nhấn nút Cập nhật Chỉnh sửa số Ở form chỉnh sửa thông tin điện thoại cá nhân, chỉnh sửa số điện thoại nhấn nút Cập nhật Chỉnh sửa số Ở form chỉnh sửa thông tin điện thoại cá nhân, chỉnh sửa số điện thành rỗng thoại thành rỗng nhấn nút Cập nhật Chỉnh sửa Ở form chỉnh sửa thông tin email cá nhân, chỉnh sửa email nhấn nút Cập nhật Chỉnh sửa Ở form chỉnh sửa thông tin email thành cá nhân, chỉnh sửa email rỗng thành rỗng nhấn nút Cập nhật Chỉnh sửa địa Ở form chỉnh sửa thông tin cá nhân, chỉnh sửa địa nhấn nút Cập nhật Cập nhật thông Ở form chỉnh sửa thông tin tin không cá nhân, nhấn nút Cập thay đổi thông nhật tin Chỉnh sửa ảnh Ở form chỉnh sửa thông tin đại diện cá nhân, chọn ảnh nhấn nút Cập nhật Chọn ảnh đại Ở form chỉnh sửa thông tin diên không cá nhân, chọn file khác file phải ảnh ảnh nhấn nút Cập nhật Hiển thi thông báo lỗi họ tên không hợp lệ Hiển thị thông báo chỉnh sửa thành công Hiển thi thông báo lỗi số điện thoại không hợp lệ Hiển thị thông báo chỉnh sửa thành công Hiển thị thông báo lỗi email không hợp lệ Hiển thị thông báo chỉnh sửa thành công Không nhấn nút Cập nhật Hiển thị thông báo chỉnh sửa thành công Hiển thị thông báo lỗi file không hợp lệ Kết kiểm thử 5.5.1 Kết tổng quan Số testcase thực hiện: 51 Số testcase đạt: 49/51 Số testcase chưa đạt: 2/51 91 an Chương 5: Cài đặt kiểm thử Hình 5.7 Kết tổng quan kiểm thử 5.5.2 Kết cụ thể theo test case Bảng 5.6: Kết test theo test case STT Test case Đăng nhập Thêm học viên Chỉnh sửa lớp học Chỉnh sửa thông tin cá nhân Đạt 14 11 13 12 Chưa đạt 0 Số lượng test case 14 11 13 13 92 an Chương 6: Kết luận hướng phát triển Chương 6: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 6.1 6.2 Kiến thức tìm hiểu Cộng nghệ xây dựng Web MEAN Stack Sử dụng JWT việc thực chức xác thực phân quyền Sử dụng NodeMailer để gửi mail Sử dụng API Momo để hỗ trợ toán online Sử dụng Captcha để website hoạt động tốt Sử dụng API Google Drive để upload ảnh lên Drive Chức cài đặt 6.2.1 Trang dành cho người dùng Xem danh sách khóa học Xem chi tiết lớp học Đăng kí lớp học Thanh tốn Momo Gửi thông tin yêu cầu hỗ trợ đến hệ thống Xem giới thiệu trung tâm giảng viên 6.2.2 Trang dành cho Admin giảng viên Chức quản lí Admin: o Thêm, sửa, xóa chỉnh trạng thái khóa học, lớp học phần, lớp học, phòng học, giảng viên, quản trị viên o Xem thống kê học viên đăng kí online trung tâm o Xem thống kê toán qua Momo trung tâm o Xem thống kê tiền toán qua Momo trung tâm Chức quản lí giảng viên: o Xem thời khóa biểu giảng viên 6.2.3 Chức chung actor Admin, nhân viên giảng viên o Xem danh sách lớp học học viên lớp học o Gửi mail cho học viên o Chỉnh sửa thông tin cá nhân o Đăng xuất o Đăng nhập 93 an Chương 6: Kết luận hướng phát triển o Đổi mật Admin, nhân viên o Xem danh sách người dùng cần hỗ trợ gửi từ trang dành cho người dùng o Gửi mail cho người dùng cần liên hệ để hỗ trợ o Xem toàn danh sách học viên o Thêm, sửa, xóa chỉnh trạng thái học viên o Gửi mail cho học viên theo lớp theo cá nhân 6.3 6.4 Ưu điểm Trang web thực chức đủ để phục vụ cho trung tâm giảng dạy Ứng dụng thiết kế cho việc sử dụng cho nhiều mơn học khác Có hỗ trợ toán online cho người dùng Hỗ trợ chat Facebook để người dùng nhanh chóng giải đáp thắc mắc Nhược điểm Giao diện thiết kế chưa đẹp tốt Sử dụng API bên thứ ba hạn chế mặt phát triển 6.5 Hướng phát triển Khắc phục nhược điểm Hỗ trợ chatbot cho người dùng trang dành cho người dùng Nâng cấp thành quản lý chuỗi trung tâm 94 an DANH MỤC TÀI LIỆU THAM KHẢO [1] https://techtalk.vn/mot-cai-nhin-tong-quan-nhat-ve-nodejs.html [2] https://viblo.asia/p/nodejs-voi-express-framework-rQOvPKVgkYj [3] https://viblo.asia/p/mongodb-la-gi-co-so-du-lieu-phi-quan-he-bJzKmgoPl9N [4] https://developers.momo.vn/v1/#cong-thanh-toan-momo-gioi-thieu [5]https://webkimcuong.com/google-captcha-recaptcha-la-gi-tai-sao-ban-nen-dung-nocho-website-cua-minh/ [6] https://viblo.asia/p/thao-thac-voi-google-drive-api-gGJ59O4xZX2 95 an an ... Tên đề tài: Xây dựng website quản lý trung tâm Anh ngữ sử dụng MEAN Stack Nội dung thực đề tài: Lý thuyết: Tìm hiểu sử dụng công nghệ MEAN Stack Nghiên cứu sử dụng RESTful API Thực... nghiệp vụ mơ hình trung tâm tiếng Anh Xây dựng chức cho trang quản lý trung tâm Kiểm thử Báo cáo sản phẩm Sản phẩm: Trang quản lí thơng tin trung tâm Anh ngữ Trang giao diện trung tâm để người dùng... Hồ Chí Minh, tháng 07 năm 2020 an z TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM KHOA ĐÀO TẠO CHẤT LƯỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG WEBSITE QUẢN LÝ TRUNG TÂM ANH NGỮ SỬ DỤNG MEAN STACK SVTH : TRẦN