Xây dựng website cộng đồng hỗ trợ học tập học siêu dễ easy learn

Trang web Học Siêu Dễ Easy Learn là một cộng đồng học tập trực tuyến được xây dựng trên hệ sinh thái giáo dục 4.0, nhằm đáp ứng nhu cầu ngày càng tăng về giáo dục trực tuyến và cung cấp một môi trường học tập đơn giản, dễ triển khai và tiếp cận. Với sự hỗ trợ của công nghệ MERN Stack (MongoDB, Express.js, React.js, Node.js), Học Siêu Dễ mang đến một giao diện trực quan và tính năng mạnh mẽ. Trang web tạo điều kiện cho cộng đồng người học và trợ giảng giao lưu, chia sẻ kiến thức và hỗ trợ lẫn nhau trong quá trình học tập. Học Siêu Dễ giúp người dùng dễ dàng tìm kiếm và tham gia vào các khóa học, bài giảng và tài liệu học tập. Ngoài ra, trang web còn cung cấp công cụ thảo luận giữa trợ giảng và học viên, tạo ra một môi trường học tập tương tác và đáng tin cậy. Cộng đồng Học Siêu Dễ cũng cho phép người dùng đánh giá và chia sẻ phản hồi về khóa học, giúp cải thiện chất lượng giảng dạy và tạo ra sự minh bạch trong quá trình học tập. Với sự phát triển của công nghệ và tác động của đại dịch COVID19, Học Siêu Dễ đóng vai trò quan trọng trong việc cung cấp một giải pháp học tập linh hoạt và tiện ích, tạo điều kiện thuận lợi cho mọi người tiếp cận kiến thức và phát triển cá nhân trong một cộng đồng hỗ trợ sôi nổi.

Tính cấp thiết của đề tài

Trong thời đại Cách mạng Công nghệ 4.0 và sự phát triển nhanh chóng của Internet, chúng ta đã trải qua một cuộc cách mạng trong việc học tập trực tuyến Giờ đây, mọi người có thể tiếp cận nhiều tiện ích hơn trong cuộc sống, trong đó việc học trực tuyến đóng vai trò quan trọng Thay vì đến lớp học truyền thống, chúng ta có thể học tập ở bất kỳ đâu và bất kỳ lúc nào. Đi theo xu hướng đó, nhóm chúng tôi quyết định thực hiện đề tài "Xây dựng website cộng đồng hỗ trợ học tập: Học siêu dễ - Easy learn", hoạt động theo mô hình mạng xã hội giáo dục Trang web này sẽ kết nối các gia sư và học sinh với nhau, tạo ra một cộng đồng học tập đầy đủ và sôi động Các tương tác giữa thành viên sẽ diễn ra như một mạng xã hội thông qua giao diện trực quan và thân thiện.

CHƯƠNG 1: TỔNG QUAN ỨNG DỤNG

Website "Học siêu dễ - Easy learn" sẽ cung cấp các chức năng hỗ trợ việc học tập một cách nhanh chóng và hiệu quả nhất Đây là một nền tảng giúp người học và người dạy có thể tương tác, chia sẻ kiến thức, tư vấn và giải đáp câu hỏi Các tài liệu, bài giảng và bài tập sẽ được cập nhật đều đặn để đảm bảo người học có nguồn kiến thức phong phú và đa dạng

Với đề tài này, chúng tôi hy vọng có thể tận dụng tối đa lợi ích của công nghệ để tạo ra một môi trường học tập trực tuyến thú vị và hữu ích, giúp mọi người tiếp cận kiến thức một cách dễ dàng và nâng cao khả năng học tập của mình.

Mục tiêu xây dựng ứng dụng

Ứng dụng dành cho nền tảng học tập trực tuyến, kết nối giáo viên và học sinh Mục đích của chúng tôi là cung cấp môi trường học tập đa dạng và phong phú, tạo điều kiện tiếp cận kiến thức dễ dàng cho người học, qua đó nâng cao năng lực học tập.

KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 9

Đánh giá tổng quan website dạy học số tương tự

CÁC TIÊU CHÍ diendan.hocmai.vn lazi.vn

Giao diện Website Giao diện chưa thật sự tối ưu Giao diện đẹp, gọn gàng

Tốc độ phản hồi Nhanh Nhanh.

Quản trị Hệ thống lớn với lượng người dùng lớn nên việc quản trị sẽ khó khăn hơn.

Hệ thống lớn với lượng người dùng lớn chủ yếu là các bạn nhỏ từ THPT tới tiểu học nên việc quản trị có phần khó khăn.

Tính năng website Nhiều tính năng tuy nhiên không dễ sử dụng cho những người mới. Đáp ứng hầu hết các yêu cầu cơ bản dành cho website cộng đồng học tập

Tốc độ tải trang website Tốc độ load nhanh Tốc độ load nhanh

Dễ dàng thao tác và điều hướng. Điều hướng thao tác dễ dàng, dễ thực hiện Điều hướng thao tác dễ dàng, dễ thực hiện Hạn chế tối thiểu các lỗi Còn một số lỗi nhỏ, nhiều ảnh bị lỗi.

Còn một số lỗi nhỏ, dễ bị làm phiền bởi các người dùng khác.

Website dễ dàng nâng cấp

Có thể thêm được nhiều tính năng một cách dễ dàng mà không ảnh hưởng đến những tính năng cũ Đa số đầy đủ các tính năng cơ bản, việc nâng cấp tính năng có thể khả thi trong tương lai

Website dễ dàng triển khai

Website có số lượng tính năng quá là nhiều nên việc triển khai cho những cơ sở nhỏ những nơi chưa có đủ nguồn lực thì là không thể

Website có nhiều cấp bậc học sinh dùng nên việc triển khai và quản lý cần phân bổ quản lý nhân lực phải hợp lý

Bảng 1 Đánh giá các webite dạy học số tương tự

Các chức năng đặc biệt của từng trang web

PHÂN LOẠI diendan.hocmai.vn lazi.vn

Chức năng cơ bản - Quản lý các câu hỏi, tài liệu học tập

- Quản lý các câu hỏi.

CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU

- Có diễn đàn và thông báo

- Có những mục trao đổi khác ngoài vấn đề học tập

- Lọc và tìm kiếm tài liệu học

- Có không gian trò chuyện

- Lọc và tìm kiếm câu hỏi

Chức năng nâng cao - Nhiệm vụ và bảng xếp hạng.

Bảng 2 Phân tích chức năng của các website tương tự Đánh giá:

- Ưu điểm: Dễ sử dụng, tốc độ phản hồi nhanh, đầy đủ các chức năng cơ bản.

- Nhược điểm: Giao diện khá thô sơ, không bắt mắt, chưa thật sự tối ưu với người mới, còn một số lỗi giao diện.

Đặc tả yêu cầu người dùng

1 2.3.1 Yêu cầu về Quản trị viên

− Quản lý khóa học: thêm, xóa, sửa.

− Quản lý bài đăng: xóa

− Quản lí thông báo: thêm, xóa.

− Quản lý người dùng: thêm, xóa, sửa.

− Quản lý thông tin cá nhân: Sửa

2 2.3.2 Yêu cầu về Trợ giảng

− Quản lý môn học: Sửa

− Quản lý tài liệu: Sửa, thêm, xóa

− Quản lý đề thi: Sửa, thêm, xóa

− Quản lý thông báo: Xóa, sửa

3 2.3.3 Yêu cầu về Người dùng

− Quản lí bài đăng: thêm, xóa, sửa

− Quản lí giỏ hàng: thêm, xóa, sửa.

− Quản lý thông tin cá nhân: sửa.

2.4 Đặc tả yêu cầu hệ thống

4 2.4.1 Yêu cầu về giao diện

− Giao diện đẹp, dễ sử dụng.

− Khi kéo, co giãn độ dài rộng trên trang web thì giao diện phải co giãn theo không được bể, khuất giao diện Tương tự giao diện trên app có thể thích ứng với các kích thước màn hình điện thoại to, nhỏ khác nhau.

− Khi một trang response quá lâu nên có biểu tượng loading để người dùng biết.

− Bắt buộc phải có internet.

6 2.4.3 Yêu cầu về hệ điều hành

− Tất cả các hệ điều hành Windows, Linux… miễn có thể truy cậpInternet.

Hệ thống sử dụng mô hình Client Server với:

− Server sử dụng Node.JS ExpressJS

− Client sử dụng ReactJS cho website

Hình 1 Sơ đồ kiến trúc hệ thống

CHƯƠNG 3: CƠ SỞ LÝ THUYẾT

CHƯƠNG 3: CƠ SỞ LÝ THUYẾT 3.1 MERN Stack

- MERN Stack là một công nghệ phát triển ứng dụng web, nó bao gồm một tập hợp các công nghệ và công cụ như MongoDB, Express.js, React và Node.js. o MongoDB là một hệ quản trị cơ sở dữ liệu phi quan hệ (NoSQL) dựa trên tài liệu JSON, được sử dụng để lưu trữ dữ liệu của ứng dụng. o Express.js là một framework phía máy chủ xây dựng trên Node.js, giúp xây dựng các API và quản lý các yêu cầu và phản hồi trên máy chủ. o React là một thư viện JavaScript phía máy khách được sử dụng để xây dựng giao diện người dùng tương tác và linh hoạt. o Node.js là một môi trường thực thi mã JavaScript phía máy chủ, cho phép chạy mã JavaScript bên ngoài trình duyệt web.Chia sẻ cùng code ở cả phía client và server.

- Khi kết hợp với nhau, các thành phần trong MERN Stack tạo thành một cấu trúc phát triển đầy đủ cho ứng dụng web MERN Stack cho phép phát triển ứng dụng web hiệu quả với tính mô-đun cao, tái sử dụng mã nguồn và khả năng xây dựng ứng dụng đơn trang (Single-Page Applications - SPA).

Hình 2 Mô hình hoạt động MERN Stack

- Máy khách gửi yêu cầu HTTP từ trình duyệt web.

- Express.js nhận yêu cầu từ máy khách và xử lý nó.

- Express.js tương tác với MongoDB để truy xuất và cập nhật dữ liệu.

- Sau khi xử lý yêu cầu, Express.js trả về phản hồi cho máy khách.

- React nhận phản hồi từ Express.js và tạo ra giao diện người dùng tương ứng.

- Giao diện người dùng được hiển thị trên trình duyệt web của máy khách.

- Tích hợp toàn diện: MERN Stack cung cấp một giải pháp toàn diện từ phía máy chủ đến phía máy khách, sử dụng JavaScript cho cả hai phía Điều này giúp đơn giản hóa việc phát triển và hiểu mã nguồn.

- Hiệu suất cao: MERN Stack sử dụng Node.js, một môi trường phát triển mã JavaScript với hiệu suất cao Node.js cho phép xử lý đồng thời và xây dựng các ứng dụng thời gian thực, đảm bảo khả năng mở rộng và xử lý cao.

- Khả năng đa nền tảng: MERN Stack cho phép xây dựng ứng dụng đa nền tảng, có thể chạy trên nhiều hệ điều hành và trình duyệt khác nhau.

- Cộng đồng phát triển lớn: MERN Stack đã nhận được sự ủng hộ mạnh mẽ từ cộng đồng phát triển Điều này có nghĩa là có nhiều tài liệu, hướng dẫn và ví dụ có sẵn để hỗ trợ trong quá trình phát triển và giải quyết vấn đề.

Do tích hợp nhiều công nghệ và công cụ, MERN Stack sở hữu kiến thức rộng lớn hơn một số công nghệ khác dùng trong phát triển Yếu tố này đòi hỏi người học phải có thời gian làm quen với các thành phần trong MERN Stack.

- MERN Stack không cung cấp giải pháp quản lý trạng thái ứng dụng sẵn có. Điều này có nghĩa là cần sử dụng các thư viện bên thứ ba hoặc phát triển các giải pháp tùy chỉnh để quản lý trạng thái ứng dụng.

- MERN Stack có tính mô-đun cao, có nghĩa là việc tích hợp các công nghệ và quản lý các phụ thuộc có thể phức tạp hơn so với các cấu trúc phát triển khác.

12 3.1.4 Áp dụng MERN Stack cho dự án

MERN Stack được áp dụng xuyên suốt trong quá trình xây dựng dự án như sau:

- MongoDB: xây dựng các bảng như "users", "posts", "courses",… để lưu trữ thông tin tương ứng.

- Express.js: o Xây dựng các API cho việc đăng ký, đăng nhập và quản lý tài khoản người dùng,… o Xử lý yêu cầu liên quan đến bài viết, bình luận, khóa học,… o Tạo các endpoint để truy xuất dữ liệu từ MongoDB và trả về dưới dạng JSON.

- React: o Tạo các trang như trang chủ, trang đăng ký, trang đăng nhập, trang danh sách bài viết, trang chi tiết bài viết, trang khóa học,… o Quản lý trạng thái ứng dụng và xử lý sự kiện tương tác từ người dùng.

Node.js đóng vai trò xử lý các yêu cầu từ người dùng như đăng ký, đăng nhập, tải lên bài viết, Nhờ sử dụng Node.js để chạy máy chủ, các yêu cầu từ phía người dùng sẽ được máy chủ xử lý và phản hồi lại cho người dùng.

3.2 Các công nghệ sử dụng ở Back-end

- Khái niệm : NodeJS là một nền tảng phát triển độc lập được xây dựng ở trên Javascript Runtime của Chrome có thể xây dựng được các ứng dụng mạng một cách nhanh chóng và dễ dàng mở rộng, chạy đa nền tảng và có mã nguồn mở, được sử dụng để chạy các ứng dụng web bên ngoài trình duyệt của client.

- Các ứng dụng Nodejs: Websocket server, Fast File Upload Client, Ad Server, Cloud Services, RESTful API, Any Real-time Data Application,…

- Ưu điểm: o Sử dụng JavaScript – một ngôn ngữ lập trình dễ học. o Chia sẻ cùng code ở cả phía client và server. o Cộng đồng hỗ trợ tích cực. o IO hướng sự kiện không đồng bộ, cho phép xử lý nhiều yêu cầu đồng thời. o IO hướng sự kiện không đồng bộ, cho phép xử lý nhiều yêu cầu đồng thời. o …

- Nhược điểm: o Khó thao tác với cơ sử dữ liệu quan hệ. o Mỗi callback sẽ đi kèm với rất nhiều callback lồng nhau khác. o Cần có kiến thức tốt về JavaScript. o Không có khả năng mở rộng, vì vậy không thể tận dụng lợi thế mô hình đa lõi trong các phần cứng cấp server hiện nay. o … b Áp dụng

- Minh họa cách sử dụng thư viện Pagination trong Nodejs

Hình 3 Code minh hoạ sử dụng thư viện Paginate

Sơ đồ phân rã chức năng

Hình 9 Sơ đồ phân rã chức năng

Sơ đồ lớp

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM

Mô hình hoá yêu cầu

4.3.2 Lược đồ tuần tự và mô tả chi tiết chức năng

Hình 15 Sequence Diagram Đăng nhập

Usecase Đăng nhập Tên - Name Đăng nhập

Người dùng đăng nhập vào hệ thống qua email đã đăng ký tài khoản. Đối tượng -

Người dùng đã đăng ký tài khoản.

Tài khoản của người dùng đã được đăng ký và có trong hệ thống.

Điều kiện sau khi đăng nhập thành công: Xuất hiện thông báo thành công và màn hình sẽ hiển thị thông tin về người dùng Đăng nhập không thành công: Xuất hiện thông báo lỗi và màn hình sẽ trở về trạng thái như ban đầu.

Luồng điều kiện - Flow of

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM events

1 Truy cập trang đăng nhập

2 Người dùng nhập email và password

3 Hệ thống kiểm tra, xác thực thông tin đăng nhập thành công

4 Hệ thống ghi nhận lại hoạt động sau khi đăng nhập

5 Hệ thống hiển thị thông báo lỗi “Tên đăng nhập hoặc mật khẩu không chính xác”

6 Hệ thống yêu cầu người dùng đăng nhập lại

7 Bước 2 ở luồng cơ bản được thực hiện

Yêu cầu phi chức năng -

Usecase Đăng ký tài khoản Tên - Name Đăng ký

Người truy cập trang web sử dụng chức năng này để đăng ký tài khoản bằng số điện thoại và email Đối tượng -

Email hợp lệ và chưa có đăng ký trong hệ thống Học Siêu Dễ

Post- conditions Đăng ký thành công: Người dùng có thể đăng nhập thành công vào trang web với email và password đã đăng ký Đăng ký thất bại: Người dùng không thể đăng nhập bằng tài khoản vừa đăng ký

Luồng điều kiện - Flow of events

1 Truy cập trang đăng ký

2 Người dùng nhập email và số điện thoại

3 Hệ thống kiểm tra, xác thực thông tin và gửi mã OTP về email

4 Người dùng nhập OTP và các thông tin yêu cầu

5 Hệ thống cập nhật dữ liệu

6 Hệ thống thông báo đăng ký thành công

7 Hệ thống thông báo lỗi

8 Yêu cầu người đăng ký điền lại email và số điện thoại

9 Bước 3 luồng cơ bản thực hiện

Bảng 4 Usecase Đăng ký tài khoản

4.3.2.3 Chức năng “Quên mật khẩu”

Hình 17 Sequence Diagram Quên mật khẩu

Usecase quên mật khẩu Tên - Name Quên mật khẩu

Người truy cập trang web sử dụng chức năng quên mật khẩu để lấy lại mật khẩu Đối tượng -

Email hợp lệ và đã đăng ký trong hệ thống Học Siêu Dễ

Thành công: Người dùng lấy lại mật khẩu và đăng nhập vào hệ thống

Thất bại: Người dùng không thể lấy lại mật khẩu

Basic flow 2 Người dùng nhấn quên mật khẩu và điền email

3 Hệ thống kiểm tra, xác thực thông tin và gửi mã OTP về email

4 Người dùng nhập OTP và cập nhật mật khẩu

5 Hệ thống cập nhật dữ liệu

6 Hệ thống thông báo đổi mật khẩu thành công

8 Yêu cầu người đăng ký điền lại email

Bảng 5 Usecase Quên mật khẩu

4.3.2.4 Chức năng “Chỉnh sửa thông tin tài khoản”

Hình 18 Sequence Diagram Chỉnh sửa thông tin tài khoản

Usecase Chỉnh sửa thông tin tài khoảnTên - Name Chỉnh sửa thông tin cá nhân

Người dùng truy cập trang thông tin cá nhân để thay đổi thông tin cá nhân Đối tượng -

Người dùng đã đăng ký tài khoản.

Người dùng đăng nhập thành công vào hệ thống

Chỉnh sửa thành công: Người dùng cập nhật thông tin cá nhân thành công

Chỉnh sửa thất bại: Người dùng không thay đổi được thông tin cá nhân

1 Truy cập trang thay đổi thông tin

2 Người dùng nhập các thông tin cần thay đổi

3 Hệ thống kiểm tra, xác thực thông tin

4 Xác thực thành công, cập nhật lại data

5 Hệ thống thông báo cập nhật thông tin thành công

7 Yêu cầu điền lại thông tin

Bảng 6 Usecase Chỉnh sửa thông tin tài khoản

Hình 19 Sequence Diagram Tìm kiếm

Usecase Tìm kiếm Tên - Name Tìm kiếm

Tìm kiếm thông tin khoá học hoặc bài viết Đối tượng -

Tìm kiếm thành công: Hệ thống hiển thị danh sách khoá học hoặc bài viết

Tìm kiếm thất bại: Hệ thống chưa có dữ liệu

Luồng điều kiện - Flow of

1 Nhập nội dung tìm kiếm vào ô tìm kiếm

2 Hệ thống kiểm tra, xác thực thành công trả về kết quả

4.3.2.6 Chức năng “Tạo bài viết”

Hình 20 Sequence Diagram Tạo bài viết

Tên - Name Tạo bài viết

Người dùng đang gặp khó khăn khi học và cần giúp đỡ của cộng đồng, thì thực hiện chức năng đăng bài Mục đích để người khác có thể giải đáp thắc mắc của người đăng bài. Đối tượng -

Người dùng đã đăng nhập vào hệ thống, số điểm của người dùng tối thiểu là 10

Post- conditions Đăng bài thành công: Hiển thị bài viết ngay Đăng bài thất bại: Không hiển thị bài viết

2 Người dùng nhập nội dung và hình ảnh cần hỏi đáp

3 Hệ thống kiểm tra, xác thực thành công

4 Thêm bài viết vào dữ liệu

5 Thông báo đăng bài thành công

3 Yêu cầu nhập lại nội dung

4 Ở bước 2 luồng cơ bản thực hiện

Bảng 8 Usecase Tạo bài viết

4.3.2.7 Chức năng “Quản lý bài viết”

Hình 21 Sequence Diagram Quản lý bài viết

Usecase Xem chi tiết bài viết Tên - Name Xem chi tiết bài viết

Người dùng sử dụng chức năng này để xem chi tiết bài viết bao gồm cả các câu hỏi và câu trả lời Đối tượng -

Người dùng có quyền truy cập vào bài viết

Thành công: Hiển thị thông tin đầy đủ của bài viết Thất bại: Hiển thị thông báo

1 Người dùng chọn bài viết cần xem

3 Hệ thống hiển thị kết quả

3 Thông báo không có quyền truy cập

Bảng 9 Usecase Xem danh sách bài viết

Usecase Chỉnh sửa bài viết Tên - Name Chỉnh sửa bài viết

Người dùng sử dụng chức năng này để chỉnh sửa bài viết. Đối tượng -

Người dùng đã đăng nhập và là tác giả bài viết

Chỉnh sửa thành công: Hiển thị chi tiết bài viết sau khi cập nhật

Chỉnh sửa thất bại: Không thấy thay đổi ở chi tiết bài viết

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM kiện - Flow of events

1 Người dùng truy cập trang chỉnh sửa bài viết

2 Nhập nội dung cần thay đổi

3 Hệ thống hiển thị đã thêm vào mục yêu thích thành công

Bảng 10 Usecase Chỉnh sửa bài viết

Usecase Xóa bài viết Tên - Name Xóa bài viết

Người dùng sử dụng chức năng này để xóa bài viết Đối tượng -

Người dùng đã đăng nhập thành công và là tác giả bài viết

Xoá bài viết thành công: Không hiển thị bài viết nữa Xoá bài viết thất bại: Bài viết vẫn còn hiển thị

1 Người dùng chọn chức năng xoá bài viết

3 Hệ thống thông báo xoá thành công

5 Hệ thống thông báo xoá thất bại

Bảng 11 Usecase Xoá bài viết

4.3.2.8 Chức năng “Xem bảng xếp hạng"

Hình 22 Sequence Diagram Xem bảng xếp hạng

Usecase Xem bảng xếp hạng

Tên - Name Xem bảng xếp hạng

Người dùng sử dụng chức năng này để theo dõi bảng xếp hạng của người dùng Đối tượng -

Thành công: Hiển thị bảng xếp hạng của tháng đó Thất bại: Hiển thị thông báo chưa có dữ liệu

1 Người dùng chọn tháng cần xem

2 Hệ thống kiểm tra, xác thực

3 Thông báo thành công, hiển thị bảng xếp hạng

4 Hệ thống thông báo chưa có dữ liệu

Bảng 12 Usecase Xem bảng xếp hạng

Hình 23 Sequence Diagram Điểm danh

Usecase Điểm danh Tên - Name Điểm danh

Người dùng sử dụng chức năng này để điểm danh nhận điểm thưởng. Đối tượng -

Người dùng đã đăng nhập thành công, và chưa điểm danh ngày hôm đó

Post- conditions Điểm danh thành công: Người dùng được cộng 20 điểm trong ngày hôm đó Điểm danh thất bại: Không được cộng điểm

1 Người dùng nhấn vào chức năng “Điểm danh”

2 Hệ thống kiểm tra và xác thực thông tin

3 Thông báo điểm danh thành công

4 Người dùng được cộng 20 điểm

6 Thông báo đã điểm danh ( điểm danh không thành công)

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM flow người dùng quay lại điểm danh vào ngày hôm sau.

Bảng 13 Usecase Điểm danh mỗi ngày

4.3.2.10 Chức năng “Cho điểm người trả lời”

Hình 24 Sequence Diagram Cho điểm người trả lời

Usecase Cho điểm người trả lời Tên - Name Cho điểm người trả lời

Người dùng sử dụng chức năng này để cho điểm người trả lời câu hỏi giải đáp được thắc mắc của người đăng bài.

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM Đối tượng -

Người dùng đã đăng nhập và là tác giả của bài viết, bài viết chưa cho điểm

Cho điểm thành công: Hệ thống sẽ cộng điểm cho người được cho bằng số điểm của bài viết.

Cho điểm thất bại: Hệ thống sẽ không cộng điểm nữa

1 Người dùng nhấn nút cho điểm

3 Thông báo cho điểm thành công

4 Hệ thống cập nhật điểm cho người dùng

5 Thông báo bài viết đã được cho điểm

6 Hệ thống không cộng điểm nữa

Bảng 14 Usecase Cho điểm người trả lời

4.3.2.11 Chức năng “Hỏi và trả lời”

Hình 25 Sequence Diagram Hỏi và trả lời

Usecase Hỏi và trả lời Tên - Name Hỏi và trả lời

Người dùng sử dụng chức năng này để thực hiện hỏi và trả lời Đối tượng -

Người dùng đã đăng nhập, và có quyền tham trong bài viết và khoá học

Bình luận thành công: Hiển thị bình luận trên bài viết hoặc khoá học

Bình luận thất bại: Không hiển thị bình luận

1 Truy cập vào bài viết

2 Nhập nội dung bình luận

3 Hệ thống kiểm tra, xác thực

4 Thông báo thành công và hiển thị bình luận

5 Hệ thống thống cập nhật dữ liệu

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM nghiệp vụ -

Bảng 15 Usecase Bình luận bài viết

4.3.2.12 Chức năng “Bình chọn câu trả lời”

Hình 26 Sequence Diagram Bình chọn câu trả lời

Usecase Bình chọn câu trả lời Tên - Name Bình chọn câu trả lời

Người dùng sử dụng chức năng này để đánh giá câu trả lời Đối tượng -

Người dùng đã đăng nhập

Thành công: Hệ thống hiển thị lên màn hình Thất bại: Hệ thống hiển thị thông báo lỗi

1 Người dùng chọn vào “Vote” hoặc “Unvote”

2 Hệ thống kiểm tra và xác thực

3 Hệ thống thông báo thành công và hiển thị lên màn hình

Bảng 16 Usecase Bình chọn câu trả lời

4.3.2.13 Chức năng “Báo cáo bài viết”

Hình 27 Sequence Diagram Báo cáo bài viết

Usecase Báo cáo bài viết Tên - Name Báo cáo bài viết

Người dùng sử dụng chức năng này để báo cáo bài viết vi phạm Đối tượng -

Thành công: Hệ thống thông báo thành công Thất bại: Hệ thống hiển thị thông báo lỗi

1 Người dùng chọn vào chức năng báo cáo và mô tả về vi phạm của bài viết

3 Hệ thống thông báo thành công

Bảng 17 Usecase Báo cáo bài viết

4.3.2.14 Chức năng “Đăng ký làm trợ giảng”

Hình 28 Sequence Diagram Đăng ký làm trợ giảng

Usecase Đăng ký làm trợ giảng Tên - Name Đăng ký làm trợ giảng

Người dùng sử dụng chức năng này để đăng ký làm trợ giảng cho hệ thống “Học Siêu Dễ” Đối tượng -

1 Người dùng chọn chức năng đăng ký làm trợ giảng

2 Người dùng nhập thông tin theo yêu cầu

6 Yêu cầu nhập lại thông tin

Bảng 18 Usecase Đăng ký làm trợ giảng

4.3.2.15 Chức năng “Trợ giảng đăng ký trả lời và hỗ trợ”

Hình 29 Sequence Diagram Trợ giảng đăng ký trả lời và hỗ trợ

Usecase Trợ giảng đăng ký trả lời và hỗ trợTên - Name Trợ giảng đăng ký trả lời và hỗ trợ

Trợ giảng sử dụng chức năng này để đăng ký trả lời và hỗ trợ bài viết hoặc khoá học Đối tượng -

Người dùng đã đăng nhập và có quyền là Trợ giảng

1 Trợ giảng chọn bài viết hoặc khoá học cần hỗ trợ để đăng ký

Bảng 19 Usecase Trợ giảng đăng ký trả lời và hỗ trợ

4.3.2.16 Chức năng “Quản trị xét duyệt”

Hình 30 Sequence Diagram Quản trị xét duyệt

Usecase Quản trị xét duyệt Tên - Name Quản trị xét duyệt

Quản trị sử dụng chức năng xét duyệt này để duyệt thông tin và yêu cầu từ Người dùng và Trợ giảng Đối tượng -

Người dùng đã đăng nhập và có quyền là Quản trị

1 Quản trị chọn yêu cầu cần xét duyệt

Luồng thay thế 5 Hệ thống thông báo lỗi

Bảng 20 Usecase Quản trị xét duyệt

4.3.2.17 Chức năng “Tạo khoá học”

Hình 31 Sequence Diagram Tạo khoá học

Tên - Name Tạo khoá học

Quản trị sử dụng chức năng này để tạo khoá học cho hệ thống “Học Siêu Dễ” Đối tượng -

1 Quản trị chọn tạo khoá học

2 Nhập các thông tin cần thiết cho một khoá học

Bảng 21 Usecase Tạo khoá học

4.3.2.18 Chức năng “Quản lý khoá học”

Hình 32 Sequence Diagram Quản lý khoá học

Usecase Xem khoá học Tên - Name Xem khoá học

Người dùng xem được chi tiết khoá học bao gồm thảo luận trong khoá học đó. Đối tượng -

Quản trị, trợ giảng khoá học và người dùng đã mua khoá học

Thành công: Hệ thống hiển thị kết quả Thất bại: Hệ thống hiển thị thông báo

1 Chọn khoá học đã có quyền tham gia

3 Hệ thống hiển thị kết quả

4 Hệ thống thông báo không có quyền truy cập

Bảng 22 Usecase Xem khoá học

Usecase Chỉnh sửa khoá học Tên - Name Chỉnh sửa khoá học

Quản trị sử dụng chức năng này để chỉnh sửa khoá học cho hệ thống “Học Siêu Dễ” Đối tượng -

1 Quản trị chọn khoá học

2 Chỉnh sửa các thông tin cần thiết cho một khoá học

Bảng 23 Usecase Chỉnh sửa khoá học

Usecase Xoá khoá học Tên - Name Xoá khoá học

Quản trị sử dụng chức năng này để xoá khoá học cho hệ thống “Học Siêu Dễ” Đối tượng -

1 Quản trị chọn khoá học

2 Chọn chức năng xoá khoá học

6 Yêu cầu thực hiện lại bước 2

Bảng 24 Usecase Xoá khoá học

4.3.2.19 Chức năng “Quản lý giỏ hàng”

Hình 33 Sequence Diagram Quản lý giỏ hàng

Usecase Thêm khoá học vào giỏ hàng Tên - Name Thêm khoá học vào giỏ hàng

Người dùng thêm khoá học cần mua vào giỏ hàng Đối tượng -

1 Người dùng chọn khoá học

2 Chọn chức năng thêm vào giỏ hàng

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM flow 7 Ở bước 3 luồng cơ bản thực hiện

Bảng 25 Usecase Thêm khoá học vào giỏ hàng

Usecase Xoá khoá học trong giỏ hàng Tên - Name Xoá khoá học trong giỏ hàng

Người dùng xoá khoá học trong giỏ hàng Đối tượng -

1 Người dùng chọn khoá học

2 Chọn chức năng xoá khỏi giỏ hàng

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM chức năng -

Bảng 26 Usecase Xoá khoá học trong giỏ hàng

Hình 34 Sequence Diagram Thanh toán

Usecase Thanh toán Tên - Name Thanh toán

Người dùng thực hiện thanh toán khi mua khoá học hay mua điểm thưởng Đối tượng -

Luồng cơ bản - 1 Người dùng chọn thanh toán

Basic flow 2 Chọn phương thức thanh toán

4.4 Thiết kế cơ sở dữ liệu

4.4.1 Nhóm cơ sở dữ liệu người dùng

Hình 35 Nhóm cơ sở dữ liệu người dùng a Bảng tài khoản (user)

STT Thuộc tính Kiểu dữ liệu Ý nghĩa Ghi chú

1 _id ObjectId Id của user Khóa chính, random tự động

2 first_name String Tên của người dùng required

3 last_name String Tên họ của người dùng required

4 email String Địa chỉ email của tài khoản unique

5 phone Number Số điện thoại của tài unique

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM khoản

6 password String Mật khẩu của người dùng required

7 authType String Đăng ký tài khoản theo các hình thức khác nhau

3 hình thức: local, facebook, google

10 avatar ObjectId Hình đại diện

14 courses Arrays Mảng các khoá học đã mua

16 Favorites ObjectId Danh sách khoá học yêu thích

17 role String Vai trò trong hệ thống

18 status Number Trạng thái của tài khoản

19 createdAt datetime Thời gian tạo

20 updatedAt datetime Thời gian cập nhật lần cuối

Bảng 28 Model User b Bảng Rank (Rank)

Khóa chính, tự động tăng

2 day_save datetime Ngày lưu

3 key_filter String Từ khoá lọc

4 point Number Số điểm thưởng

5 user ObjectId Thông tin người dùng

Bảng 29 Model Rank c Bảng OTP từ email (OTP)

1 _id ObjectId Id Khóa chính, tự động tăng

2 email String Email của người dùng

3 otp Number Mã OTP từ email

4 expireAt ObjectId Thời gian hết hạn OTP

Bảng 30 Model OTP d Bảng điểm thưởng (Point)

1 _id ObjectId Id của điểm thưởng

2 point Number Điểm thưởng người dùng Điểm thưởng này sử dụng

3 point_rank Number Điểm hạng trong tháng

4 status Number Trạng thái điểm thưởng

5 user ObjectId Điểm thưởng của người dùng

6 day_check_in datetime Cập nhật ngày điểm danh

Bảng 31 Model Point e Bảng lịch sử thay đổi điểm thưởng (HistoryPoint)

2 userId ObjectId Thông tin người dùng

5 user_send ObjectId Thông tin người gửi

6 user_receive datetime Thông tin người nhận

7 bill_record ObjectId Thông tin hoá đơn

8 post ObjectId Thông tin bài viết

Bảng 32 Model HistoryPoint f Bảng nhiệm vụ (Mission)

1 _id ObjectId Id Khóa chính,

2 name String Tên nhiệm vụ

3 point Number Số điểm thưởng nhận

Bảng 33 Model Mission g Bảng kiểm tra nhiệm vụ (ViewMission)

3 missionId ObjectId Thông tin nhiệm vụ

4 type Number Kiểu nhiệm vụ

Bảng 34 Model ViewMission h Bảng thông báo (Notification)

1 _id ObjectId Id của của thông báo

2 userId ObjectId Thông báo của người dùng

5 read Boolean Trạng thái xem

6 type Number Kiểu thông báo

7 itemId Object Id của các kiểu thông báo trên

4.4.2 Nhóm cơ sở dữ liệu bài viết

Hình 36 Nhóm cơ sở dữ liệu bài viết a Bảng bài viết (Post)

1 _id ObjectId Id của bài viết Khóa chính, tự động tăng

2 content String Nội dung bài viết required

3 image ObjectId Hình ảnh bài viết

4 user ObjectId Tác giả bài viết

5 type_post Number Trạng thái bài viết

Gồm 2 loại: Cộng đồng và trợ giảng

Bài viết dành cho trợ giảng trả lời 1-1

7 point_post Number Số điểm của bài viết

Trạng thái cho điểm của bài viết

9 comment_auto_po int Array

Danh sách người dùng được cho điểm tự động

10 iclass ObjectId Bài viết thuộc lớp

11 subject ObjectId Bài viết thuộc môn

12 status Number Trạng thái của bài viết

Gồm 3: ẩn, hoạt động, bị khoá

Bảng 36 Model Post b Bảng hỏi đáp trong bài viết và khoá học (Comment)

1 _id ObjectId Id của bình luận Khóa chính, tự động tăng

2 content String Nội dung bình luận required

3 image ObjectId Hình ảnh bình luận

4 user ObjectId Tác giả bình luận

5 postId ObjectId Bài viết được bình luận

6 videoCourseId ObjectId Bài học được bình luận

7 repliesComment ObjectId Bình luận được trả lời

8 total_reacts Object Lượt đánh giá

9 status_point Object Trạng thái cho điểm

10 status_point_aut o Object Trạng thái cho điểm tự động

Bảng 37 Model Comment c Bảng đánh giá câu trả lời (React)

2 user ObjectId Thông tin người dùng

4 commentId ObjectId Thông tin bình luận

5 type String Trạng thái đánh giá

Bảng 38 Model React d Bảng lớp học và môn học (ObIClass và Subject)

1 _id ObjectId Id của lớp học và môn học

Bảng 39 Model ObIClass và Subject e Bảng trợ giảng (Assistant)

1 _id ObjectId Id của trợ giảng Khóa chính, tự động tăng

3 cccd_user ObjectId Hình CCCD của người dùng

Hình chứng chỉ hoặc giấy khen của người dùng

Mô tả, giới thiệu về bản thân, kinh nghiệm

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM hoặc các thành tựu đạt được

6 position Number Vị trí hiện tại

7 support_SubList Array Danh sách môn học có thể hỗ trợ

8 support_ClassLis t Array Danh sách lớp học có thể hỗ trợ

9 status Number Trạng thái của trợ giảng

Bảng 40 Model Assistant f Bảng lưu fille (Attachment)

1 _id ObjectId Id của file Khóa chính, tự động tăng

3 size String Kích thước file

7 link String Đường dẫn file sau khi upload

8 user ObjectId Người upload file

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM g Bảng quảng cáo (Advertise)

1 _id ObjectId Id của quảng cáo

4.4.3 Nhóm cơ sở dữ liệu khoá học

Hình 37 Nhóm cơ sở dữ liệu khoá học a Bảng danh mục khoá học (CategoryCourse)

1 _id ObjectId Id của danh mục Khóa chính, tự động tăng

2 name String Tên danh mục required

3 description String Mô tả chi tiết danh mục

4 banner ObjectId Hình danh mục

5 status Number Trạng thái danh mục

6 topic String Các lựa chọn

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM b Bảng khoá học (Course)

1 _id ObjectId Id của khoá học Khóa chính, tự động tăng

2 name String Tên khoá học required

3 title String Tiêu đề khoá học

4 detail_course String Mô tả chi tiết khoá học

5 price Number Giá khoá học

7 assistantId ObjectId Trợ giảng khoá học

8 sold Number Số lượng khoá học đã bán

9 category ObjectId Danh mục khoá học

10 banner ObjectId Hình khoá học

11 video ObjectId Video khoá học

12 status Number Trạng thái khoá học

13 class_id ObjectId Khoá học thuộc lớp

14 subject_id ObjectId Khoá học thuộc môn

Bảng 44 Model CategoryCourse c Bảng bài học trong khoá học (VideoCourse)

1 _id ObjectId Id của bài học Khóa chính, tự động tăng

2 name String Tên bài học required

3 title String Tiêu đề bài học

4 description String Mô tả chi tiết bài học

5 thumbnail ObjectId Hình bài học

6 video ObjectId Video bài học

7 course ObjectId Thuộc khoá học

8 status Number Trạng thái bài học

Bảng 45 Model VideoCourse d Bảng kiểm tra tình trạng xem bài học (ViewVideoCourse)

Id ObjectId Thông tin bài học

Bảng 46 Model ViewVideoCourse e Bảng đánh giá khoá học (RatingCourse)

3 courseId ObjectId Thông tin khoá học

4 rating Number Đánh giá mức hài lòng Từ 1 đến 5

5 comment String Bình luận khoá học

Bảng 47 Model RatingCourse f Bảng giỏ hàng (Cart)

1 _id ObjectId Id của bài học Khóa chính, tự động tăng

3 courseId Array Danh sách khoá học cần mua

5 price_discount Number Giá sau khi giảm

6 quantityOrdered Number Số lượng khoá học

Bảng 48 Model Cart g Bảng lịch sử thanh toán (BillRecord)

1 _id ObjectId Id của hoá đơn Khóa chính, tự động tăng

2 pay_point Number Số điểm thưởng khi mua

4 courseId Array Danh sách khoá học khi mua

6 price_discount Number Giá sau khi khuyến mãi

7 quantity Number Số lượng khoá học đã mua

8 payment_method String Phương thức thanh toán

9 payment_status String Trạng thái

Bảng 49 Model BillRecord h Bảng trợ giảng khoá học (AssistantCourse)

2 assistantId ObjectId Thông tin trợ giảng

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG PHẦN MỀM j Bảng yêu thích khoá học (CourseWishList)

4 like Boolean Thích hoặc không thích

Thiết kế giao diện

4.5.1 Giao diện cho khách (chưa đăng nhập) a Trang chủ

Hình 38: Trang chủ cho khách b Trang tìm kiếm

Hình 39: Trang tìm kiếm c Trang đăng kí

Hình 40: Trang đăng kí d Trang đăng nhập

Hình 41: Trang đăng nhập e Trang bảng xếp hạng

Hình 42: Trang bảng xếp hạng f Trang khóa học

Hình 43: Trang khóa học g Trang chi tiết khóa học

Hình 44: Trang chi tiết khóa học

4.5.2 Giao diện cho người dùng a Trang chủ

Hình 45: Trang chủ cho người dùng đã đăng nhập c Trang cá nhân

Hình 46: Trang cá nhân d Trang khóa học của tôi

Hình 47: Trang khóa học của tôi e Trang đơn hàng

Hình 48: Trang đơn hàng f Trang điểm

Hình 49: Trang điểm g Trang danh sách yêu thích

Hình 50:Trang danh sách yêu thích h Trang bạn bè

Hình 51: Trang bạn bè i Trang nhiệm vụ

Hình 52: Trang nhiệm vụ j Trang giỏ hàng

Hình 53: Trang giỏ hàng k Trang thông tin thanh toán

Hình 54: Trang thông tin thanh toán l Trang thanh toán

Hình 55: Trang thanh toán m Trang hỏi gia sư

Hình 56 Trang hỏi gia sư n Trang quản lí câu hỏi gia sư

Hình 57 Trang quản lý câu hỏi gia sư

4.5.3 Giao diện cho trợ giảng a Trang trợ giảng

Hình 58: Trang trợ giảng b Trang đăng kí làm trợ giảng

Hình 59: Trang đăng kí làm trợ giảng c Trang hỗ trợ khóa học

Hình 60 Trang hỗ trợ khoá học d Trang hỗ trợ câu hỏi

Hình 61 Trang hỗ trợ câu hỏi

4.5.4 Giao diện cho quản trị viên a Trang chủ quản trị viên

Hình 62: Trang chủ quản trị viên b Trang quản lí người dùng

Hình 63: Trang quản lí người dùng c Trang quản lí trợ giảng

Hình 64: Trang quản lí trợ giảng d Trang quản lí bài viết vi phạm

Hình 65: Trang quản lí bài viết vi phạm e Trang quản lí khóa học

Hình 66: Trang quản lí khóa học f Trang quản lí quảng cáo

Hình 67: Quản lí quảng cáo g Trang quản lí trợ giảng khóa học

Hình 68 Trang quản lý trợ giảng khoá học h Trang quản lí bài viết gia sư

Hình 69 Trang quản lý bài viết gia sư

CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ

CHƯƠNG 5 CÀI ĐẶT VÀ KIỂM THỬ 5.1 Cài đặt

5.1.1 Truy cập bằng Visual Studio Code

- Cài đặt và chạy dự án dưới localhost: o Back-End:

Clone Project về máy tính theo lệnh git dưới đây:

“ git clone https://github.com/theanh176/Backend_Easy_Learn_Final.git ”

Sử dụng lệnh cài đặt thư viện: npm install

Sử dụng lệnh chạy dự án: npm run watch o Front-End:

Clone Project về máy tính theo lệnh git dưới đây:

“ git clone https://github.com/theanh176/Easy-Learn-App.git ”

“ git clone https://github.com/theanh176/admin-easy-learn-app.git ”

Sử dụng lệnh cài đặt thư viện: yarn

Sử dụng lệnh chạy dự án: yarn start

5.1.2 Truy cập bằng trình duyệt web

- Link trang web Easy-Learn: https://www.hocsieude.tech/

Tài khoản người dùng: tonthienthach01@yopmail.com / 123456Aa

Tài khoản gia sư: theanh17assistant1@yopmail.com / 123456Aa

- Link trang web Admin Easy-Learn: https://www.admin.hocsieude.tech/

Tài khoản quản trị viên: admin.easylearn@gmail.com / Aa123456

STT Tên module Vai trò áp dụng Mô tả

Người dùng Người truy cập trang web sử dụng chức năng này để đăng ký tài khoản bằng phone và email

2 Đăng nhập Người dùng đã đăng nhập

Người dùng đăng nhập vào hệ thống qua email đã đăng ký tài khoản.

3 Quên mật khẩu Người dùng đã đăng nhập.

Người dùng truy cập trang quân mật khẩu để đổi mật khẩu.

4 Chỉnh sửa thông tin tài khoản

Người dùng đã đăng nhập truy cập vào trang cá nhân để đổi thông tin cá nhân

5 Tạo bài viết Người dùng đã đăng nhập

Người dùng đã đăng nhập có thể tạo bài viết để đặt câu hỏi cho cộng động từ trang chủ hoặc trang cá nhân

6 Xem chi tiết bài viết

Người dùng Người dùng sử dụng chức năng này để xem chi tiết bài viết và các câu trả lời của bài viết đó

7 Hỏi và trả lời Người dùng đã đăng nhập

Người dùng đã đăng nhập thực hiện bình luận câu hỏi và khóa học

Người dùng sử dụng chức năng này để chỉnh sửa bài viết.

9 Xoá bài viết Người dùng đã đăng nhập

Người dùng sử dụng chức năng này để xóa bài viết

Người dùng sử dụng chức năng này để điểm danh cho mình.

11 Cho điểm người trả lời

Người dùng sử dụng chức năng này để cho điểm người trả lời câu hỏi giải đáp được thắc mắc của người đăng bài.

Người dùng sử dụng chức năng này để báo cáo những câu hỏi vi phạm.

13 Đăng kí làm trợ giảng

Người dùng đã đăng nhập sử dụng chức năng này để đăng kí làm trợ giảng.

14 Bình chọn câu trả lời

Người dùng đã đă đăng nhập

Người dùng sử dụng chức năng này để đánh giá câu trả lời trong câu hỏi

15 Tìm kiếm Người dùng Người dùng nhập thông tin câu hỏi hoặc khóa học để tìm kiếm

16 Theo dõi bảng xếp hạng của người dùng trong tháng

Người dùng Người dùng sử dụng chức năng này để theo dõi bảng xếp hạng của người dùng

17 Trợ giảng đăng kí trả lời và hỗ trợ

Trợ giảng Trợ giảng đăng kí trả lời câu hỏi và thực hiện trả lời câu hỏi.

Quản trị viên Quản trị viên xét duyệt gia sư, bài viết,…

19 Tạo khóa học Quản trị viên Quản trị viên có thể tạo khóa học mới

20 Xem khóa học Người dùng Người dùng có quyền xem khóa học

Quản trị viên Quản trị viên có thể chỉnh sửa khóa học

22 Xóa khóa học Quản trị viên Quản trị viên có thể xóa khóa học

23 Thêm khóa học vào giỏ hàng

Người dùng thêm khóa học vào giỏ hàng của mình

24 Xóa khóa học trong giỏ hàng

Người dùng xóa khóa học không mong muốn ra khỏi giỏ hàng

25 Thanh toán Người dùng đã đă đăng nhập

Người dùng thực hiện chức năng thanh toán cho giỏ hàng của mình

Bảng 52 Phạm vi kiểm thử

5.2.1.2 Loại kiểm thử o Kiểm thử tích hợp (Integration test): kết hợp các module của ứng dụng và kiểm thử như một ứng dụng hoàn chỉnh. o Kiểm thử hệ thống (System test): kiểm thử xem thiết kế và toàn bộ hệ thống (sau khi tích hợp) có thỏa mãn yêu cầu đặt ra hay không. o Kiểm thử khả năng sử dụng (Usability test): xác minh ứng dụng có khả

5.2.1.3 Rủi ro và các vấn đề

Rủi ro Kế hoạch giảm nhẹ

Các thành viên trong nhóm chưa có nhiều kinh nghiệm trong việc kiểm thử trang web.

Học hỏi, tìm hiểu từ các nguồn trên mạng, bạn bè, thầy cô…

Bảng 53 Rủi ro và các vấn đề

Dự án sẽ sử dụng hai thành viên trong nhóm làm tester Quá trình kiểm thử sẽ bắt đầu khi tất cả các điều sau được thỏa mãn: o Trang web đã sẵn sàng để kiểm thử o Môi trường kiểm thử được xây dựng o Đủ nhân lực cho quá trình kiểm thử. o Đặc tả kiểm thử được xác định.

Quy trình kiểm thử gồm 6 bước như sau:

Bước 1: Phân tích yêu cầu (Requirement analysis)

Bước 2: Lập kế hoạch kiểm thử (Test planning) o Xác định phạm vi kiểm thử, hướng tiếp cận, quy trình kiểm thử, tài nguyên và nhân lực test. o Xác định các chức năng/module cần được kiểm tra; các công cụ và môi trường kiểm thử cần có. o Lên kế hoạch thiết kế công việc kiểm thử

Bước 3: Phát triển kịch bản kiểm thử (Test case development) o Đánh giá, xem xét tài liệu o Viết test case / checklists

CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ o Chuẩn bị dữ liệu kiểm thử o Đánh giá test case / checklists

Bước 4: Thiết lập môi trường kiểm thử (Test environment setup)

Thực hiện kiểm thử phần mềm, so sánh với kết quả mong đợi và ghi lại buglog các lỗi phát sinh Tiến hành kiểm thử lại (re-test) để xác định lỗi đã được khắc phục và kiểm thử hồi quy (regression test) khi có thay đổi liên quan Theo dõi và phân tích tiến trình, điều chỉnh tài liệu dự án phù hợp với thực tế Báo cáo thường xuyên về tình hình thực hiện dự án cho quản lý dự án (Project Manager) và khách hàng.

Sau khi thực hiện các trường hợp thử nghiệm, bước cuối cùng là kết thúc chu trình thử nghiệm Trong giai đoạn này, nhóm kiểm thử sẽ tổng kết và báo cáo kết quả kiểm thử Họ sẽ đánh giá xem quá trình kiểm thử có đáp ứng các tiêu chí về phạm vi, chất lượng, chi phí, thời gian và mục tiêu đặt ra hay không Sau đó, nhóm kiểm thử sẽ thảo luận và rút ra bài học kinh nghiệm từ quá trình thử nghiệm để cải thiện chất lượng kiểm thử trong tương lai.

5.2.3.1 Kết quả kiểm thử chức năng phía Người dùng

T Module Các bước thực hiện

- Chọn đăng ký tài khoản mới

- Điền các thông tin yêu cầu

- Nhận được thông báo đăng ký thành công

- Chuyển đến trang đăng nhập

- Nhận được thông báo đăng ký thành công

- Chuyển đến trang đăng nhập Đạt

2 Xem chi tiết bài viết

Chọn vào bài viết Hiển thị chi tiết bài viết

Hiển thị chi tiết bài viết Đạt

Chọn xem tất cả ở bảng xếp hạng

Hiển thị danh sách bảng xếp hạng

Hiển thị danh sách bảng xếp hạng Đạt

Chọn xem tất cả ở khóa học

Hiển thị danh sách khóa học

Hiển thị danh sách khóa học Đạt

5 Tìm kiếm - Chọn vào ô tìm kiếm trên thanh ở đầu trang.

-Nhập thông tin khóa học cần tìm kiếm

Hiển thị khóa học cần tìm nếu có hoặc thông báo không tìm thấy

Hiển thị khóa học cần tìm nếu có hoặc thông báo không tìm thấy Đạt

Bảng 54 Kiểm thử chức năng phía người dùng

5.2.3.2 Kết quả kiểm thử chức năng phía Người dùng (Người dùng đã đăng nhập)

- Nhấn vào trang đăng nhập

- Điền các thông tin đăng nhập

- Nhấn vào nút đăng nhập

- Hiện thông báo đăng nhập thành công

- Chuyển đến trang home Đạt

2 Chỉnh sửa thông tin cá nhân

- Nhấn vào trang chỉnh sửa

- Nhập nội dung cần chỉnh sửa

- Hiện thông báo thành công

- Hiện thông báo thành công Đạt

-Trong chi tiết bài viết chọn trả lời.

-Hiển thị thông báo thành công

-Hiển thị thông báo thành công Đạt

- Nhấn vào trang đăng bài

- Nhập nội dung cần đăng

- Hiện thông báo đăng bài thành công

- Hiện thông báo đăng bài thành công Đạt

Nhấp vào trang chỉnh sửa bài viết Nhập nội dung cần chỉnh sửa

Thông báo chỉnh sửa thành công

Thông báo chỉnh sửa thành công Đạt

- Nhấp chọn xoá bài viết

- Hiển thị thông báo xoá thành công

- Hiển thị thông báo xoá thành công Đạt

- Người dùng nhấp vào điểm danh ở trang home

- Thông báo điểm danh thành công

- Thông báo điểm danh thành công Đạt

8 Cho điểm người trả lời

- Truy cập vào bài viết

- Nhấp cho điểm bình luận giải đáp thắc mắc hay nhất

- Thông báo cho điểm thành công

- Thông báo cho điểm thành công Đạt

- Nhấn vào góc trái của bài viết.

-Nhập thông tin báo cáo

Hiển thị thông báo thành công

Hiển thị thông báo thành công Đạt

- Like hoặc Dislike trên bình luận

Hiển thị like hoặc dislike trên bình luận

Hiển thị like hoặc dislike trên bình luận Đạt

-Ở trang đăng kí chọn quên mật khẩu Đổi mật khẩu thành công và Đổi mật khẩu thành công và đăng nhập Đạt

CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ gmail -Nhập mã OTP -Nhập mật khẩu mới thành công

12 Đăng ký làm trợ giảng

-Truy cập trang đăng ký làm trợ giảng.

- Nhập thông tin cá nhân.

Thông báo thành công Đạt

13 Thêm khóa học vào giỏ hàng

-Truy cập trang khóa học.

- Nhấn vào thêm giỏ hàng.

Thông báo thành công và trong giỏ hàng đã có khóa học

Thông báo thành công và trong giỏ hàng đã có khóa học Đạt

14 Xóa khóa học trong giỏ hàng

-Truy cập vào giỏ hàng.

Thông báo thành công, khóa học mất khỏi giỏ hàng

Thông báo thành công, khóa học mất khỏi giỏ hàng Đạt

- Truy cập vào giỏ hàng.

- Chọn phương thức thanh toán.

Thông báo thanh toán thành công

Thông báo thanh toán thành công Đạt

Bảng 55 Kiểm thử chức năng người dùng đã đăng nhập

5.2.3.3 Kết quả kiểm thử chức năng phía Trợ giảng

1 Trợ giảng đăng kí trả lời và hỗ trợ

- Chọn mục đăng kí khóa học.

- Nhấn nút đăng kí khóa học

- Thông báo thành công và khóa học có trong mục đã xét duyệt

- Thông báo thành công và khóa học có trong mục đã xét duyệt Đạt

Bảng 56 Kiểm thử chức năng phía Trợ giảng

5.2.3.4 Kết quả kiểm thử chức năng phía Quản trị viên

- Chọn mục bài viết vi phạm.

- Bài viết được chuyển qua mục đã xử lí

- Bài viết được chuyển qua mục đã xử lí Đạt

Bảng 57 Kiểm thử chức năng phía Quản trị viên

CHƯƠNG 6 KẾT LUẬN 6.1 Kết quả đạt được

Sau quá trình nghiên cứu và hoàn thiện đề tài “Xây dựng Website cộng đồng hỗ trợ học tập Học Siêu Dễ - Easy Learn”, tổng kết lại nhóm thực hiện đã đạt được những kết quả sau:

- Đồ án đã tìm hiểu và áp dụng thành công các công nghệ như MongoDB, ExpressJS, Cloudinary vào phát triển phần back-end của dự án MongoDB được sử dụng làm cơ sở dữ liệu NoSQL để lưu trữ dữ liệu, ExpressJS là framework backend giúp xây dựng API và xử lý logic phía server và Cloudinary được sử dụng để lưu trữ và quản lý hình ảnh trong ứng dụng.

- Đối với phần front-end, dự án đã sử dụng thành công ReactJS, Tailwind CSS, Material UI, và các thư viện khác để xây dựng giao diện người dùng trực quan và tương tác ReactJS được sử dụng làm framework front-end chính, Tailwind CSS cung cấp các lớp CSS tái sử dụng để thiết kế giao diện, và Material UI cung cấp các thành phần UI đẹp và tương tác sẵn có.

- Ngoài ra, đồ án cũng đã tìm hiểu và áp dụng cách kiểm thử phần mềm vào quá trình phát triển Nhóm đã sử dụng các công cụ kiểm thử như Jest và ReactTesting Library để viết các test case và kiểm tra tính đúng đắn và hiệu suất của

- Qua quá trình thực hiện đề tài, nhóm thực hiện đã có cơ hội rèn luyện và cải thiện kỹ năng viết code Các thành viên đã học được cách viết code sạch, dễ đọc và dễ bảo trì Điều này giúp tăng tính hiệu quả và khả năng tái sử dụng trong quá trình phát triển dự án

- Kỹ năng làm việc nhóm cũng được nâng cao Các thành viên đã học cách phân công công việc, thống nhất quy trình làm việc và tương tác với nhau một cách hiệu quả Điều này giúp đảm bảo sự chính xác và đồng nhất trong quá trình phát triển và tăng khả năng hoàn thành dự án đúng tiến độ.

- Ngoài ra, đồ án cũng giúp các thành viên cải thiện kỹ năng tìm kiếm thông tin và đọc hiểu tài liệu Qua quá trình nghiên cứu và áp dụng công nghệ mới, các thành viên đã học cách tìm kiếm thông tin chính xác và đáng tin cậy từ các nguồn tài liệu trực tuyến và tài liệu hướng dẫn Điều này giúp mở rộng kiến thức và sẵn sàng áp dụng các công nghệ mới vào dự án trong tương lai.

- Trang web "Xây dựng Website cộng đồng hỗ trợ học tập Học Siêu Dễ - Easy Learn" đã được triển khai trên các nền tảng Railway và Vercel Việc triển khai trên các nền tảng này đảm bảo ứng dụng có thể hoạt động ổn định và có sẵn cho người dùng truy cập từ mọi lúc, mọi nơi.Người dùng có thể đăng kí và sử dụng các tính năng sẵn có trên trên web.

- Người dùng có thể đăng kí, tìm kiếm, thảo luận, đánh giá, học tập cách khóa học, hỏi bài trực tiếp gia sư,…

- Tham gia các hoạt động tích lũy điểm thưởng.

- Cung cấp giao diện người dùng tương tác và thân thiện.

− Giao diện thân thiện với người dùng, dễ dàng sử dụng: Trang web "Xây dựng Website cộng đồng hỗ trợ học tập Học Siêu Dễ - Easy Learn" được thiết kế với giao diện thân thiện, hỗ trợ trên mọi nền tảng, dễ dàng điều hướng và tương tác Người dùng có thể dễ dàng tìm kiếm thông tin, tạo bài viết, thảo luận và sử dụng các tính năng khác một cách thuận tiện.

− Nhiều tính năng miễn phí: trang web cung cấp các tính năng như đăng kí, tìm kiếm, thảo luận,… hoàn toàn miễn phí Điều này tạo điều kiện thuận lợi cho người dùng truy cập và tận dụng các tính năng hỗ trợ học tập mà không cần phải trả phí.

Nhược điểm

Trang web hiện tại chỉ cho phép đăng nhập thông qua tài khoản riêng của người dùng, hạn chế tính linh hoạt và sự lựa chọn của họ Việc tích hợp các phương thức đăng nhập khác như Facebook, Twitter, GitHub sẽ giải quyết vấn đề này, cho phép người dùng đăng nhập dễ dàng và thuận tiện hơn, đồng thời mở rộng phạm vi tiếp cận và khả năng tiếp cận của trang web.

Hướng phát triển

- Bổ sung tính năng nâng cao để cung cấp cho người dùng trải nghiệm học tập

CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ vụ kiếm điểm,… thêm vào để tăng cường giá trị của trang web và thu hút người dùng.

- Tích hợp những tính năng được hỗ trợ bởi trí tuệ nhân tạo.

- Tích hợp đăng nhập bằng các phương thức khác: Mở rộng tính năng đăng nhập bằng các phương thức khác như Facebook, Twitter, Google, GitHub, vv.

- Phát triển ứng dụng di động "Học Siêu Dễ - Easy Learn" trên các nền tảng iOS và Android Điều này giúp người dùng tiếp cận và sử dụng ứng dụng một cách thuận tiện trên điện thoại di động và máy tính bảng.

- Tối ưu hóa hiệu suất và bảo mật: Nâng cao hiệu suất và độ tin cậy của ứng dụng bằng cách tối ưu hóa mã nguồn, cải thiện quy trình xử lý dữ liệu và tăng cường bảo mật Đảm bảo an toàn thông tin người dùng và ổn định hoạt động của ứng dụng.

DANH MỤC TÀI LIỆU THAM KHẢO

1 Meta Platforms, Inc (n.d), Getting Started, https://reactjs.org/docs/getting-started.html

2 MongoDB, Inc (n.d), MongoDB Documentation, https://www.mongodb.com/docs/

3 StrongLoop, IBM, and other expressjs.com contributors (n.d), API documentation, https://expressjs.com/en/5x/api.html

4 OpenJS Foundation and Node.js contributors (n.d), About documentation, https://nodejs.org/en/docs/

5 Hà Thê Trung ( 28/05/2015), Tìm hiểu về Material UI, https://viblo.asia/p/tim-hieu-ve-material-ui-jdWrvwg8vw38

6 Amazon Web Services, Inc (n.d), JavaScript là gì?, https://aws.amazon.com/vi/what-is/javascript/

7 Ngoc Nguyễn (28/03/2016), Sử dụng Cloudinary để quản lý ảnh cho ứng dụng của bạn, https://viblo.asia/p/su-dung-cloudinary-de-quan-ly-anh-cho-ung-dung-cua-ban-E7bGoxggv5e2

8 Hoàng Nguyễn (15/12/2019), Tìm hiểu về Tailwind CSS, https://viblo.asia/p/tim-hieu-ve-tailwind-css-924lJp6WKPM

9 Socket.IO, Inc (n.d), Socket.IO Documentation, https://socket.io/

10 Tanner Linsley, Inc (n.d), React Query, https://tanstack.com/query/v3/

11 VNPAY, (2018), Hướng dẫn tích hợp Cổng thanh toán VNPAY, https://sandbox.vnpayment.vn/apis/docs/huong-dan-tich-hop/

12 Nguyen Quang Huy, (30/01/2018), Thanh toán bằng Paypal, https://viblo.asia/p/thanh-toan- bang-paypal-6J3Zg2YWKmB

13 PayPal, Inc (n.d), PayPal Developer, https://developer.paypal.com/sdk/js/

14 Anonystick, Inc (n.d), Sử dụng Socket io trong mô hình MVC Express và Node.js, https://anonystick.com/blog-developer/su-dung-socket-io-trong-mo-hinh-mvc-express-va- nodejs-theo-2-video-source-2022051090927347

15 Olaoluwa Ajibade, Inc (n.d), Scheduling Jobs with Node.js, https://reflectoring.io/schedule- cron-job-in-node/

Tiêu đề	Xây Dựng Website Cộng Đồng Hỗ Trợ Học Tập Học Siêu Dễ - Easy Learn
Người hướng dẫn	ThS. Mai Anh Thơ, ThS. Nguyễn Hữu Trung
Trường học	Trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh
Chuyên ngành	Công nghệ phần mềm
Thể loại	báo cáo khóa luận tốt nghiệp
Năm xuất bản	2023
Thành phố	TP.HCM

Định dạng
Số trang	119
Dung lượng	10,86 MB
File đính kèm	SourceCode.rar (12 MB)