cung cấp các ví dụ cụ thể, hướng dẫn sử dụng, và giải thích các thuộc tính của từngthành phần, giúp tôi tiết kiệm thời gian trong việc tra cứu và thử nghiệm.Hỗ trợ tốt với Typescript, vớ
TÍNH CẤP THIẾT CỦA ĐỀ TÀI
3 Khảo sát hiện trạng các website tương tự
4 Đối tượng và phạm vi nghiên cứu của đề tài
5 Kết quả dự kiến đạt được
Chương 1: Cơ sở lý thuyết
1.1 Kiến trúc chung của hệ thống
1.2 Công nghệ sử dụng ở Front-end
1.3 Công nghệ sử dụng ở Back-end
Chương 2: Phân tích thiết kế
2.2 Danh sách các Use case
2.3 Lược đồ tuần tự - Sequence diagram
1 Những kết quả đạt được
DANH SÁCH TÀI LIỆU THAM KHẢO
- Thiết kế cơ sở dữ liệu
- Tiến hành triển khai code back-end.
- Tiến hành triển khai code front-end
- Tiến hành kết nối front-end và back-end
Bảng 0-1Kế hoạch thực hiện
Bùi Quốc Đinh - Viết báo cáo
- Lập trình back-end, kiểm thử back-end
Huỳnh Văn Quới - Viết báo cáo
- Lập trình front-end, kiểm thử front-end
Bảng 0-2Phân công thực hiện
Ngày 12 tháng 07 năm 2023 Ý kiến của giáo viên hướng dẫn Người viết đề cương
2 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 16
4 ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU 17
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 19
1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 19
1.2 CÔNG NGHỆ SỬ DỤNG Ở FRONT-END 19
1.3 CÔNG NGHỆ SỬ DỤNG Ở BACK-END 28
CHƯƠNG 2 KHẢO SÁT VÀ PHẦN TÍCH HIỆN TRẠNG 40
CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ 46
3.3 LƯỢC ĐỒ TUẦN TỰ - SEQUENCE DIAGRAM 75
KẾT QUẢ ĐẠT ĐƯỢC 122 ƯU ĐIỂM VÀ NHƯỢC ĐIỂM 122
LÀM VIỆC CÙNG GIÁO VIÊN HƯỚNG DẪN 125
Bảng 3-4 Usecase quên mật khẩu 52
Bảng 3-5 Usecase đổi mật khẩu 53
Bảng 3-7 Usecase đăng bài viết 54
Bảng 3-8 Usecase xem bài viết 55
Bảng 3-9 Usercase bình luận bài viết 55
Bảng 3-10 Usecase đánh giá bài viết 56
Bảng 3-11 Usecase đánh giá bình luận 57
Bảng 3-12 Usecase đánh dấu bài viết 57
Bảng 3-13 Usecase xem thông cá nhân người dùng khác 58
Bảng 3-14 Usecase theo dõi người dùng khác 59
Bảng 3-15 Usecase chỉnh sửa thông tin cá nhân 59
Bảng 3-16 Usecase báo cáo người dùng 60
Bảng 3-17 Usecase báo cáo bài viết 61
Bảng 3-18 Usecase bào cáo bình luận 62
Bảng 3-20 Usecase xin vào nhóm 63
Bảng 3-21 Usecase duyệt vào nhóm 64
Bảng 3-22 Usecase đăng bài viết trong nhóm 65
Bảng 3-25 Usecase admin thêm chủ đề 67
Bảng 3-26 Usecase admin sửa chủ đề 68
Bảng 3-27 Usecase admin cấm người dùng 68
Bảng 3-28 : Usecase admin gỡ lệnh cấm người dùng 69
Bảng 3-29 Admin cộng, trừ điểm đóng góp người dùng 70
Bảng 3-30 Admin xử lý report người dùng 71
Bảng 3-31 Admin xử lý report bài viết 72
Bảng 3-32 Admin xử lý report bình luận 74
Bảng 3-33 Admin xem thông tin thống kê 74
Bảng 0-57 Mô tả trang đăng nhập 97
Bảng 3-65 Mô tả trang hiển thị những bài đăng của người dùng 102
Bảng 3-66 Mô tả trang đăng bài 103
Bảng 3-67 Mô tả form tạo diễn đàn 104
Bảng 3-68 Mô tả trang chi tiết diễn đàn 104
Bảng 3-69 Mô tả giao diện quản lý người dùng 108
Bảng 4-1 Lịch trình kiểm thử 113
Bảng 4-2 Chiến lược kiểm thử 113
Bảng 4-3 Kiểm thử chức năng đăng nhập, đăng ký 118
Bảng 4-4 Kiểm thử chức năng tạo bài viết, bình luận 119
Bảng 4-5 Kiểm thử chức năng đánh giá bài viết, bình luận 119
Bảng 4-6 Kiểm thử chức năng quản lý thông tin cá nhân 120
Bảng 4-7 Kiểm thử chức năng tạo nhóm 121
Hình 1-1 Sơ đồ app full stack 19
Hình 1-2 :GraphQL Codegen + React Apollo Hooks 23
Hình 2-1 Trang chủ Stack overflow 40
Hình 3-1 Lược đồ usercase: User 46
Hình 3-3 Lược đồ usecase: Admin 48
Hình 3-4 Lược đồ tuần tự đăng nhập 75
Hình 3-5 Lược đồ tuần tự đăng ký 76
Hình 3-6 Lược đồ tuần tự quản lý thông tin cá nhân 76
Hình 3-7 Lược đồ tuần tự Quản lý bài viết 77
Hình 3-8 Lược đồ tuần tự tìm kiếm bài viết 77
Hình 3-9 Lược đồ tuần tự tạo bình luận 78
Hình 3-10 Lược đồ tuần tự đánh giá bài viết 78
Hình 3-11 Lược đồ tuần tự tạo đánh giá bình luận 79
Hình 3-12 Lược đồ tuần tự tạo đánh dấu bài viết 79
Hình 3-20 Lược đồ tuần tự đăng bài viết trong nhóm 83
Hình 3-21 Lược đồ tuần tự xóa nhóm 84
Hình 3-22 Lược đồ tuần tự admin quản lý chủ đề 84
Hình 3-23 Lược đồ tuần tự quản lý người dùng 85
Hình 3-24 Lược đồ cơ sở dữ liệu 85
Hình 2-25 Màn hình đăng nhập 97
Hình 2-26 Màn hình đăng ký 97
Hình 2-27 Màn hình trang chủ 98
Hình 2-28 Giao diện trang chủ đề 99
Hình 2-29 Giao diện trang diễn đàn 99
Hình 2-30 Giao diện trang hiển thị người dùng đang theo dõi 100
Hình 2-31 Giao diện trang hiển thị người dùng khác đã theo dõi người dùng 100
Hình 2-32 Giao diện hiển thị những bài viết người dùng đã lưu 101
Hình 2-33 Giao diện hiển thị những bài đăng của người dùng 101
Hình 2-34 Giao diện trang quản lý tài khoản người dùng 102
Hình 2-35 Giao diện trang đăng bài viết 102
Hình 2-36 Giao diện form chỉnh sửa tài khoản 103
Hình 2-37 Giao diện form tạo diễn đàn 103
Hình 2-38 Giao diện diễn đàn 104
Hình 2-39 Giao diện form chỉnh sửa group diễn đàn 105
Hình 2-40 Giao diện form quản lý thông tin xin gia nhập Diễn đàn 105
Hình 2-41 Giao diện chi tiết bài đăng trên diễn đàn 106
Hình 2-42 Giao diện report comment 106
Hình 2-43 Giao diện report người dùng 107
Hình 2-44 Giao diện report bài viết 107
Hình 2-45 Giao diện quản lý người dùng 108
Hình 2-46 Gieo diện quản lý bài viết 108
Hình 3-47 Giao diện admin quản lý diễn đàn 109
Hình 3-48 Giao diện admin quản lý report - người dùng 109
Hình 3-49 Giao diện admin quản lý report - bài viết 110
Hình 3-50 Giao diện admin quản lý report - bình luận 110
Hình 3-51 Giao diện quản lý thông báo (người dùng và admin) 111 nghệ thông tin Để từ đó, ứng dụng những kiến thức mà thầy truyền tải, nhóm em xin trình bày lại những gì mà mình đã học hỏi được thông qua việc thực hiện đề tài “Xây dựng website diễn đàn Tư vấn sinh viên Sư Phạm Kỹ Thuật”
Kiến thức là vô hạn và sự tiếp nhận kiến thức của bản thân mỗi người luôn tồn tại những hạn chế nhất định Do đó, trong phạm vi khả năng của bản thân, nhóm em đã rất cố gắng để hoàn thành đề tài một cách tốt nhất Tuy nhiên, chắc chắn không tránh khỏi những thiếu sót, nhóm em rất mong nhận được sự cảm thông và những ý kiến đóng góp đến từ cô để đề tài của em được hoàn thiện hơn.
Một lần nữa, chúng em xin chân thành cảm ơn thầy đã tận tình hướng dẫn, chỉ dẫn em trong suốt quá trình học tập và thực hiện đồ án này.
Kính chúc thầy sức khỏe, hạnh phúc thành công trên con đường sự nghiệp giảng dạy
Trân trọng Bùi Quốc Định Huỳnh Văn Quới
1 LÝ DO CHỌN ĐỀ TÀI
Trong cuộc sống hiện đại ngày nay, thế giới đang thay đổi theo từng phút, từng giây đòi hỏi chúng ta phải không ngừng thay đổi theo để thích ứng Đối với lớp sinh viên, các bạn trẻ Gen-Z hiện tại lại càng đòi hỏi phải thay đổi nhanh và chủ động hơn hết Để có sự chuẩn bị cho sự thay đổi chóng mặt này, thì vấn đề nắm bắt và trao đổi thông tin giữa các sinh viên với nhau là một trong những yếu tố quan trọng. Nhất là các bạn sinh viên Sư phạm Kỹ thuật đầy nhiệt huyết và năng nổ với tư duy cầu tiến Đặt vấn đề đó vào trong bối cảnh thời buổi Công nghệ thông tin đang chi phối thế giới thì website diễn đàn trao đổi thông tin là công cụ tuyệt vời, một cánh tay phải đắc lực của các bạn sinh viên.
Với những lý do trên, nhóm chúng em đã lựa chọn đề tài "Xây dựng website diễn dàn tư vấn sinh viên Sư Phạm Kỹ Thuật" cho đồ án Tiểu luận chuyên ngành của mình Với đề tài này nhóm chúng em mong muốn xây dựng một hệ thống forum đơn giản, gọn nhẹ, linh hoạt, để quản lý với sự kết hợp của hai công nghệ Reactjs và Spring boot.
2 TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Hiện tại, các bạn sinh viên Sư Phạm Kỹ Thuật vẫn chưa có một website giúp trao đổi và nắm bắt thông tin lẫn nhau Hầu hết, các bạn sinh viên thường trao đổi với nhau qua các nền tảng khác nhau như các group trên Zalo, các hội nhóm trên FaceBook ….Điều này có một nhược điểm rất rõ nhận thấy, đó là tính xác thực phía sau mỗi tài khoản Các đối tượng xấu có thể khai thác nhược điểm này để lừa đảo, vụ lợi cho bản thân, gây mất hình tượng sinh viên Sư Phạm Kỹ Thuật và nhiều vấn đề nhạy cảm khác Nhược điểm thứ hai, đó là không phù hợp với một bộ phận sinh viên Có rất nhiều bạn sinh viên không sử dụng một số mạng xã hội nhất định như Facebook, Zalo, Instagram …Nên việc chọn nền tảng chung cho một môn học cụ thể nào đó sẽ gây ra nhiều vấn đề bất cập trong việc trao đổi thông tin như không phải tất cả thành viên điều nắm được thông tin, thông tin không đến được với người tiếp nhận ….
Từ những hạn chế mà một số lần bản thân đã gặp phải trong việc trao đổi thông tin lẫn nhau Nên một diễn đàn để trao đổi thông tin giữa các sinh viên Sư Phạm Kỹ
- Các kỹ thuật phân tích thiết kế hệ thống.
- Tìm hiểu các framework hỗ trợ cho đề tài ở Spring boot, Reactjs và hệ thống AI.
- Phát triển các tính năng cốt lõi của một trang web tìm kiếm việc làm.
- Dùng Postman để kiểm tra lại hiệu năng của hệ thống.
4 ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU.
Người dùng: Người dùng nhập email sinh viên và đăng ký tài khoản, password để đăng nhập vào web Người dùng có nhu cầu trao đổi thông tin thì có thể đăng bài, tìm kiếm bài viết, comment các bài viết Nếu muốn lưu trữ thông tin thì có thể follow user hoặc đánh dấu bài viết Ngoài ra, sẽ có một hệ thống điểm để đánh giá người dùng lẫn nhau thông qua các bài đăng và comment.
Admin nhóm: Người quản trị của một nhóm Ngoài việc có các chức năng cơ bản của một người dùng thì admin nhóm có các chức năng khác như quản lý nhóm, các thành viên trong nhóm và bài viết trong nhóm, duyệt các bài viết và người dùng trong nhóm, xoá thành viên ra khỏi nhóm, xóa nhóm ….
Admin: Người quản trị hệ thống Đăng nhập vào giao diện admin bằng tài khoản admin, có chức năng quản lý người dùng, nhóm của người dùng, chủ đề, bài viết, comment….Có thể đưa ra lệnh bắn đối với các người dùng có biểu hiện không tốt Ngoài ra, thì admin còn có thể thống kê số lượng người dùng, bài viết, hay các thông tin của bài viết như comment, đánh giá, LƯỢC xem….
Website tập trung vào việc xử lý các nghiệp vụ cơ bản của một diễn đàn online.
Cụ thể là đăng ký tài khoản có sử dụng email sinh viên; đăng nhập; quản lý thông tin cá nhân; tìm kiếm bài viết, đăng bài viết, bình luận, đánh giá bài viết, tạo hội nhóm, theo dõi người dùng, bài viết…Về quản lý: quản lý người dùng, hội nhóm,bài viết, cấm người dùng ra khỏi hệ thống; thống kê các thông tin liên quan đế bài viết, user…
Hình 1-1 Sơ đồ app full stack
Kiến trúc của ứng dụng gồm 6 phần cơ bản người dùng (client) gửi yêu cầu (make request) thông qua tầng giao diện, sau đó phía frontend sẽ gửi request đó cho backend, backend nhận được request và tiến hành truy xuất CSDL và trả lại cho frontend để hiển thị thông tin mà người dùng mong muốn.
1.2 CÔNG NGHỆ SỬ DỤNG Ở FRONT-END
ReactJS là một thư viện JavaScript mã nguồn mở được phát triển bởi Facebook, ra mắt vào năm 2013 ReactJS được sử dụng để xây dựng các ứng dụng web tương tác và hiệu quả ReactJS nhanh chóng trở nên phổ biến và được sử dụng bởi nhiều công ty lớn như Instagram, Netflix, Airbnb,
ReactJS có một cộng đồng người dùng và nhà phát triển rất lớn và tích cực.Cộng đồng này cung cấp nhiều tài nguyên học tập và hỗ trợ cho người dùngReactJS ReactJS đang tiếp tục phát triển và được cải thiện ReactJS 18, phiên bản mới nhất của ReactJS, được phát hành vào tháng 3 năm 2023 Phiên bản này mang đến nhiều cải tiến về hiệu suất, tính năng và khả năng tiếp cận.
Có nhiều lý do để chọn ReactJS để xây dựng ứng dụng web Dưới đây là một số lý do chính:
- Sự phổ biến: ReactJS là một thư viện JavaScript phổ biến và được sử dụng rộng rãi trong ngành công nghiệp phát triển web Điều này có nghĩa là có nhiều tài nguyên học tập và hỗ trợ có sẵn cho ReactJS, và bạn sẽ dễ dàng tìm được việc làm với các kỹ năng ReactJS.
CƠ SỞ LÝ THUYẾT
CÔNG NGHỆ SỬ DỤNG Ở BACK-END
Chương 2: Phân tích thiết kế
2.2 Danh sách các Use case
2.3 Lược đồ tuần tự - Sequence diagram
1 Những kết quả đạt được
DANH SÁCH TÀI LIỆU THAM KHẢO
- Thiết kế cơ sở dữ liệu
- Tiến hành triển khai code back-end.
- Tiến hành triển khai code front-end
- Tiến hành kết nối front-end và back-end
Bảng 0-1Kế hoạch thực hiện
Bùi Quốc Đinh - Viết báo cáo
- Lập trình back-end, kiểm thử back-end
Huỳnh Văn Quới - Viết báo cáo
- Lập trình front-end, kiểm thử front-end
Bảng 0-2Phân công thực hiện
Ngày 12 tháng 07 năm 2023 Ý kiến của giáo viên hướng dẫn Người viết đề cương
2 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 16
4 ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU 17
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 19
1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 19
1.2 CÔNG NGHỆ SỬ DỤNG Ở FRONT-END 19
1.3 CÔNG NGHỆ SỬ DỤNG Ở BACK-END 28
CHƯƠNG 2 KHẢO SÁT VÀ PHẦN TÍCH HIỆN TRẠNG 40
CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ 46
3.3 LƯỢC ĐỒ TUẦN TỰ - SEQUENCE DIAGRAM 75
KẾT QUẢ ĐẠT ĐƯỢC 122 ƯU ĐIỂM VÀ NHƯỢC ĐIỂM 122
LÀM VIỆC CÙNG GIÁO VIÊN HƯỚNG DẪN 125
Bảng 3-4 Usecase quên mật khẩu 52
Bảng 3-5 Usecase đổi mật khẩu 53
Bảng 3-7 Usecase đăng bài viết 54
Bảng 3-8 Usecase xem bài viết 55
Bảng 3-9 Usercase bình luận bài viết 55
Bảng 3-10 Usecase đánh giá bài viết 56
Bảng 3-11 Usecase đánh giá bình luận 57
Bảng 3-12 Usecase đánh dấu bài viết 57
Bảng 3-13 Usecase xem thông cá nhân người dùng khác 58
Bảng 3-14 Usecase theo dõi người dùng khác 59
Bảng 3-15 Usecase chỉnh sửa thông tin cá nhân 59
Bảng 3-16 Usecase báo cáo người dùng 60
Bảng 3-17 Usecase báo cáo bài viết 61
Bảng 3-18 Usecase bào cáo bình luận 62
Bảng 3-20 Usecase xin vào nhóm 63
Bảng 3-21 Usecase duyệt vào nhóm 64
Bảng 3-22 Usecase đăng bài viết trong nhóm 65
Bảng 3-25 Usecase admin thêm chủ đề 67
Bảng 3-26 Usecase admin sửa chủ đề 68
Bảng 3-27 Usecase admin cấm người dùng 68
Bảng 3-28 : Usecase admin gỡ lệnh cấm người dùng 69
Bảng 3-29 Admin cộng, trừ điểm đóng góp người dùng 70
Bảng 3-30 Admin xử lý report người dùng 71
Bảng 3-31 Admin xử lý report bài viết 72
Bảng 3-32 Admin xử lý report bình luận 74
Bảng 3-33 Admin xem thông tin thống kê 74
Bảng 0-57 Mô tả trang đăng nhập 97
Bảng 3-65 Mô tả trang hiển thị những bài đăng của người dùng 102
Bảng 3-66 Mô tả trang đăng bài 103
Bảng 3-67 Mô tả form tạo diễn đàn 104
Bảng 3-68 Mô tả trang chi tiết diễn đàn 104
Bảng 3-69 Mô tả giao diện quản lý người dùng 108
Bảng 4-1 Lịch trình kiểm thử 113
Bảng 4-2 Chiến lược kiểm thử 113
Bảng 4-3 Kiểm thử chức năng đăng nhập, đăng ký 118
Bảng 4-4 Kiểm thử chức năng tạo bài viết, bình luận 119
Bảng 4-5 Kiểm thử chức năng đánh giá bài viết, bình luận 119
Bảng 4-6 Kiểm thử chức năng quản lý thông tin cá nhân 120
Bảng 4-7 Kiểm thử chức năng tạo nhóm 121
Hình 1-1 Sơ đồ app full stack 19
Hình 1-2 :GraphQL Codegen + React Apollo Hooks 23
Hình 2-1 Trang chủ Stack overflow 40
Hình 3-1 Lược đồ usercase: User 46
Hình 3-3 Lược đồ usecase: Admin 48
Hình 3-4 Lược đồ tuần tự đăng nhập 75
Hình 3-5 Lược đồ tuần tự đăng ký 76
Hình 3-6 Lược đồ tuần tự quản lý thông tin cá nhân 76
Hình 3-7 Lược đồ tuần tự Quản lý bài viết 77
Hình 3-8 Lược đồ tuần tự tìm kiếm bài viết 77
Hình 3-9 Lược đồ tuần tự tạo bình luận 78
Hình 3-10 Lược đồ tuần tự đánh giá bài viết 78
Hình 3-11 Lược đồ tuần tự tạo đánh giá bình luận 79
Hình 3-12 Lược đồ tuần tự tạo đánh dấu bài viết 79
Hình 3-20 Lược đồ tuần tự đăng bài viết trong nhóm 83
Hình 3-21 Lược đồ tuần tự xóa nhóm 84
Hình 3-22 Lược đồ tuần tự admin quản lý chủ đề 84
Hình 3-23 Lược đồ tuần tự quản lý người dùng 85
Hình 3-24 Lược đồ cơ sở dữ liệu 85
Hình 2-25 Màn hình đăng nhập 97
Hình 2-26 Màn hình đăng ký 97
Hình 2-27 Màn hình trang chủ 98
Hình 2-28 Giao diện trang chủ đề 99
Hình 2-29 Giao diện trang diễn đàn 99
Hình 2-30 Giao diện trang hiển thị người dùng đang theo dõi 100
Hình 2-31 Giao diện trang hiển thị người dùng khác đã theo dõi người dùng 100
Hình 2-32 Giao diện hiển thị những bài viết người dùng đã lưu 101
Hình 2-33 Giao diện hiển thị những bài đăng của người dùng 101
Hình 2-34 Giao diện trang quản lý tài khoản người dùng 102
Hình 2-35 Giao diện trang đăng bài viết 102
Hình 2-36 Giao diện form chỉnh sửa tài khoản 103
Hình 2-37 Giao diện form tạo diễn đàn 103
Hình 2-38 Giao diện diễn đàn 104
Hình 2-39 Giao diện form chỉnh sửa group diễn đàn 105
Hình 2-40 Giao diện form quản lý thông tin xin gia nhập Diễn đàn 105
Hình 2-41 Giao diện chi tiết bài đăng trên diễn đàn 106
Hình 2-42 Giao diện report comment 106
Hình 2-43 Giao diện report người dùng 107
Hình 2-44 Giao diện report bài viết 107
Hình 2-45 Giao diện quản lý người dùng 108
Hình 2-46 Gieo diện quản lý bài viết 108
Hình 3-47 Giao diện admin quản lý diễn đàn 109
Hình 3-48 Giao diện admin quản lý report - người dùng 109
Hình 3-49 Giao diện admin quản lý report - bài viết 110
Hình 3-50 Giao diện admin quản lý report - bình luận 110
Hình 3-51 Giao diện quản lý thông báo (người dùng và admin) 111 nghệ thông tin Để từ đó, ứng dụng những kiến thức mà thầy truyền tải, nhóm em xin trình bày lại những gì mà mình đã học hỏi được thông qua việc thực hiện đề tài “Xây dựng website diễn đàn Tư vấn sinh viên Sư Phạm Kỹ Thuật”
Kiến thức là vô hạn và sự tiếp nhận kiến thức của bản thân mỗi người luôn tồn tại những hạn chế nhất định Do đó, trong phạm vi khả năng của bản thân, nhóm em đã rất cố gắng để hoàn thành đề tài một cách tốt nhất Tuy nhiên, chắc chắn không tránh khỏi những thiếu sót, nhóm em rất mong nhận được sự cảm thông và những ý kiến đóng góp đến từ cô để đề tài của em được hoàn thiện hơn.
Một lần nữa, chúng em xin chân thành cảm ơn thầy đã tận tình hướng dẫn, chỉ dẫn em trong suốt quá trình học tập và thực hiện đồ án này.
Kính chúc thầy sức khỏe, hạnh phúc thành công trên con đường sự nghiệp giảng dạy
Trân trọng Bùi Quốc Định Huỳnh Văn Quới
1 LÝ DO CHỌN ĐỀ TÀI
Trong cuộc sống hiện đại ngày nay, thế giới đang thay đổi theo từng phút, từng giây đòi hỏi chúng ta phải không ngừng thay đổi theo để thích ứng Đối với lớp sinh viên, các bạn trẻ Gen-Z hiện tại lại càng đòi hỏi phải thay đổi nhanh và chủ động hơn hết Để có sự chuẩn bị cho sự thay đổi chóng mặt này, thì vấn đề nắm bắt và trao đổi thông tin giữa các sinh viên với nhau là một trong những yếu tố quan trọng. Nhất là các bạn sinh viên Sư phạm Kỹ thuật đầy nhiệt huyết và năng nổ với tư duy cầu tiến Đặt vấn đề đó vào trong bối cảnh thời buổi Công nghệ thông tin đang chi phối thế giới thì website diễn đàn trao đổi thông tin là công cụ tuyệt vời, một cánh tay phải đắc lực của các bạn sinh viên.
Với những lý do trên, nhóm chúng em đã lựa chọn đề tài "Xây dựng website diễn dàn tư vấn sinh viên Sư Phạm Kỹ Thuật" cho đồ án Tiểu luận chuyên ngành của mình Với đề tài này nhóm chúng em mong muốn xây dựng một hệ thống forum đơn giản, gọn nhẹ, linh hoạt, để quản lý với sự kết hợp của hai công nghệ Reactjs và Spring boot.
2 TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Hiện tại, các bạn sinh viên Sư Phạm Kỹ Thuật vẫn chưa có một website giúp trao đổi và nắm bắt thông tin lẫn nhau Hầu hết, các bạn sinh viên thường trao đổi với nhau qua các nền tảng khác nhau như các group trên Zalo, các hội nhóm trên FaceBook ….Điều này có một nhược điểm rất rõ nhận thấy, đó là tính xác thực phía sau mỗi tài khoản Các đối tượng xấu có thể khai thác nhược điểm này để lừa đảo, vụ lợi cho bản thân, gây mất hình tượng sinh viên Sư Phạm Kỹ Thuật và nhiều vấn đề nhạy cảm khác Nhược điểm thứ hai, đó là không phù hợp với một bộ phận sinh viên Có rất nhiều bạn sinh viên không sử dụng một số mạng xã hội nhất định như Facebook, Zalo, Instagram …Nên việc chọn nền tảng chung cho một môn học cụ thể nào đó sẽ gây ra nhiều vấn đề bất cập trong việc trao đổi thông tin như không phải tất cả thành viên điều nắm được thông tin, thông tin không đến được với người tiếp nhận ….
Từ những hạn chế mà một số lần bản thân đã gặp phải trong việc trao đổi thông tin lẫn nhau Nên một diễn đàn để trao đổi thông tin giữa các sinh viên Sư Phạm Kỹ
- Các kỹ thuật phân tích thiết kế hệ thống.
- Tìm hiểu các framework hỗ trợ cho đề tài ở Spring boot, Reactjs và hệ thống AI.
- Phát triển các tính năng cốt lõi của một trang web tìm kiếm việc làm.
- Dùng Postman để kiểm tra lại hiệu năng của hệ thống.
4 ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU.
Người dùng: Người dùng nhập email sinh viên và đăng ký tài khoản, password để đăng nhập vào web Người dùng có nhu cầu trao đổi thông tin thì có thể đăng bài, tìm kiếm bài viết, comment các bài viết Nếu muốn lưu trữ thông tin thì có thể follow user hoặc đánh dấu bài viết Ngoài ra, sẽ có một hệ thống điểm để đánh giá người dùng lẫn nhau thông qua các bài đăng và comment.
Admin nhóm: Người quản trị của một nhóm Ngoài việc có các chức năng cơ bản của một người dùng thì admin nhóm có các chức năng khác như quản lý nhóm, các thành viên trong nhóm và bài viết trong nhóm, duyệt các bài viết và người dùng trong nhóm, xoá thành viên ra khỏi nhóm, xóa nhóm ….
Admin: Người quản trị hệ thống Đăng nhập vào giao diện admin bằng tài khoản admin, có chức năng quản lý người dùng, nhóm của người dùng, chủ đề, bài viết, comment….Có thể đưa ra lệnh bắn đối với các người dùng có biểu hiện không tốt Ngoài ra, thì admin còn có thể thống kê số lượng người dùng, bài viết, hay các thông tin của bài viết như comment, đánh giá, LƯỢC xem….
Website tập trung vào việc xử lý các nghiệp vụ cơ bản của một diễn đàn online.
Cụ thể là đăng ký tài khoản có sử dụng email sinh viên; đăng nhập; quản lý thông tin cá nhân; tìm kiếm bài viết, đăng bài viết, bình luận, đánh giá bài viết, tạo hội nhóm, theo dõi người dùng, bài viết…Về quản lý: quản lý người dùng, hội nhóm,bài viết, cấm người dùng ra khỏi hệ thống; thống kê các thông tin liên quan đế bài viết, user…
Hình 1-1 Sơ đồ app full stack
Kiến trúc của ứng dụng gồm 6 phần cơ bản người dùng (client) gửi yêu cầu (make request) thông qua tầng giao diện, sau đó phía frontend sẽ gửi request đó cho backend, backend nhận được request và tiến hành truy xuất CSDL và trả lại cho frontend để hiển thị thông tin mà người dùng mong muốn.
1.2 CÔNG NGHỆ SỬ DỤNG Ở FRONT-END
ReactJS là một thư viện JavaScript mã nguồn mở được phát triển bởi Facebook, ra mắt vào năm 2013 ReactJS được sử dụng để xây dựng các ứng dụng web tương tác và hiệu quả ReactJS nhanh chóng trở nên phổ biến và được sử dụng bởi nhiều công ty lớn như Instagram, Netflix, Airbnb,
ReactJS có một cộng đồng người dùng và nhà phát triển rất lớn và tích cực.Cộng đồng này cung cấp nhiều tài nguyên học tập và hỗ trợ cho người dùngReactJS ReactJS đang tiếp tục phát triển và được cải thiện ReactJS 18, phiên bản mới nhất của ReactJS, được phát hành vào tháng 3 năm 2023 Phiên bản này mang đến nhiều cải tiến về hiệu suất, tính năng và khả năng tiếp cận.
Có nhiều lý do để chọn ReactJS để xây dựng ứng dụng web Dưới đây là một số lý do chính:
- Sự phổ biến: ReactJS là một thư viện JavaScript phổ biến và được sử dụng rộng rãi trong ngành công nghiệp phát triển web Điều này có nghĩa là có nhiều tài nguyên học tập và hỗ trợ có sẵn cho ReactJS, và bạn sẽ dễ dàng tìm được việc làm với các kỹ năng ReactJS.
KHẢO SÁT VÀ PHẦN TÍCH HIỆN TRẠNG
KHẢO SÁT HIỆN TRẠNG
Hiện nay, với sự phát triển về công nghệ, nhiều diễn đàn, mạng xã hội đã được tạo ra với nhiều nhu cầu khác nhau, trong đó, phần lớn là dùng để giải trí, trao đổi tin tức,
2.1.1 Trang web stack overflow Đối với cộng đồng lập trình viên, Stack overflow đã không còn quá xa lạ, đây là một trang web chia sẻ kinh nghiệm, tư vấn, giải quyết hàng triệu vấn đề cho hàng triệu lập trình viên trên toàn thế giới.
Hình 2-1 Trang chủ Stack overflow
- Chứng chỉ SSL: Stack Overflow sử dụng HTTPS, đảm bảo mã hóa dữ liệu truyền tải giữa người dùng và máy chủ.
- Xác thực người dùng: Sử dụng OAuth để đăng nhập thông qua các dịch vụ bên ngoài như Google, Facebook, GitHub, giúp tăng cường bảo mật.
- Chất lượng nội dung:Nội dung trên Stack Overflow do cộng đồng đóng góp, với cơ chế đánh giá, bình chọn giúp nâng cao chất lượng bài viết.
- Quản lý nội dung:Các quản trị viên và người dùng có uy tín cao có thể chỉnh sửa, xóa các câu hỏi và câu trả lời không phù hợp.
Tốc độ load dữ liệu :
- Hiệu suất: Stack Overflow có tốc độ load dữ liệu nhanh, nhờ vào việc sử dụng các công nghệ hiện đại như CDN (Content Delivery Network), tối ưu hóa hình ảnh và mã nguồn.
Khả năng thao tác và điều hướng :
- Điều hướng: Trang web cung cấp thanh tìm kiếm mạnh mẽ, menu điều hướng dễ sử dụng và các liên kết nội bộ giúp người dùng dễ dàng tìm kiếm và chuyển đổi giữa các nội dung.
- Trải nghiệm người dùng: Cung cấp các tính năng như lưu câu hỏi yêu thích, theo dõi câu hỏi, và nhận thông báo, giúp cải thiện trải nghiệm người dùng.
- Công nghệ: Sử dụng các công nghệ web hiện đại và có khả năng mở rộng Việc nâng cấp và cập nhật các tính năng mới được thực hiện thường xuyên để đáp ứng nhu cầu người dùng.
- API: Cung cấp API cho phép tích hợp với các dịch vụ và ứng dụng bên ngoài, mở rộng khả năng sử dụng và phát triển.
- Accessibility: Stack Overflow chú trọng đến khả năng tiếp cận, hỗ trợ các công cụ đọc màn hình và có thể sử dụng bàn phím để điều hướng.
Ngôn ngữ: Hỗ trợ nhiều ngôn ngữ, giúp người dùng trên toàn thế giới có thể truy cập và sử dụng.
Viblo là một trang web theo thiên hương blog được xây dựng bởi người Việt, nơi đây là nới mọi người chia sẻ kiến thức, đăng các blog về cộng nghệ để cộng đồng cùng nhau bình luận và trao đổi.
Hình 2-3 Trang chủ Viblo Để đánh giá trang web Viblo, chúng ta sẽ đi vào từng đánh giá chi tiết:
- Thiết kế:Giao diện hiện đại, tối giản với màu sắc chủ đạo là xanh dương và trắng, giúp dễ nhìn và tập trung vào nội dung.
- Bố cục: Rõ ràng, các thành phần chính như bài viết, câu hỏi, thảo luận được sắp xếp hợp lý.
-Chứng chỉ SSL: Sử dụng HTTPS, đảm bảo mã hóa dữ liệu.
Tốc độ load dữ liệu:
- Hiệu suất: Tốc độ load nhanh, nhờ sử dụng các công nghệ như CDN và tối ưu hóa mã nguồn.
Khả năng thao tác và điều hướng:
- Điều hướng:Thanh tìm kiếm mạnh mẽ, menu điều hướng dễ sử dụng, liên kết nội bộ thuận tiện.
- Trải nghiệm người dùng: Tính năng lưu bài viết yêu thích, theo dõi bài viết, và nhận thông báo.
- Công nghệ:Sử dụng công nghệ web hiện đại, nâng cấp và cập nhật thường xuyên.
- API:Cung cấp API cho tích hợp với dịch vụ và ứng dụng bên ngoài.
- Accessibility:Hỗ trợ công cụ đọc màn hình và điều hướng bằng bàn phím.
- Ngôn ngữ:Hỗ trợ tiếng Việt và tiếng Anh, phục vụ người dùng trên toàn thế giới.
Sau khi khảo sát và đánh giá hai nền tảng nổi bật trong lĩnh vực công nghệ thông tin là Stack Overflow và Viblo.asia, chúng tôi đã rút ra nhiều bài học quan trọng có thể ứng dụng vào việc xây dựng một trang web diễn đàn tư vấn sinh viên.
- Giao diện trang web phải hiện đại, gọn gàng và bắt mắt, dễ nhìn và sử dụng Màu sắc và bố cục cần phù hợp với thị hiếu của giới trẻ hiện nay, tạo cảm giác thân thiện và thoải mái khi sử dụng.
- Trang web cần cung cấp các chức năng cơ bản như đăng bài viết, thảo luận, đánh giá và quản lý nội dung Những chức năng này giúp người dùng dễ dàng chia sẻ và tiếp nhận thông tin, tạo môi trường học tập và trao đổi hiệu quả.
- Khả năng tương tác giữa các thành viên cần được tăng cường Các tính năng như bình luận, thích, chia sẻ bài viết, theo dõi tác giả và nhận thông báo sẽ giúp xây dựng một cộng đồng năng động và gắn kết Đồng thời, cần có cơ chế kiểm duyệt để tránh thông tin nhiễu và không phù hợp.
- Tích hợp hệ thống trò chuyện hoặc liên hệ trực tiếp giữa các thành viên, giúp tăng cường giao tiếp và hỗ trợ lẫn nhau trong quá trình học tập và tìm kiếm thông tin.
XÁC ĐỊNH YÊU CẦU
2.2.1 Yêu cầu phi chức năng
- Giao diện đẹp, đơn giả, dễ sử dụng.
- Tốc độ phản hồi nhanh.
- Hạn chế lỗi trên giao diện người dùng
- Có đa dạng chức năng phục vụ cho việc tìm kiếm và trao đổi thông tin.
- Dữ liệu phải mang tính có khoa học, có độ chính xác cao.
Nhóm chức năng cơ bản: Đây là những chức năng cần thiết để tạo nên một trang web diễn đàn tư vấn sinh viên hoàn chỉnh, bao gồm:
- Chức năng đăng nhập, đăng ký: Sinh viên cần có thể đăng nhập, đăng ký tài khoản để sử dụng website.
- Chức năng tìm kiếm: Sinh viên cần có thể tìm kiếm thông tin theo các tiêu chí khác nhau, như: chủ đề, keyword,
- Chức năng tạo bài viết: Sinh viên cần có thể tạo bài viết để chia sẻ thông tin, kinh nghiệm, hoặc đặt câu hỏi tư vấn.
- Chức năng bình luận bài viết: Sinh viên có thể bình luận bài viết của nhau để trao đổi, chia sẻ thông tin.
- Chức năng nhắn tin: Sinh viên có thể trao đổi tin nhắn với nhau hoặc nhóm chat.
- Chức năng quản lý tài khoản: Sinh viên cần có thể quản lý tài khoản của mình, như: thay đổi thông tin, mật khẩu,
Ngoài các chức năng cơ bản trên, website diễn đàn tư vấn sinh viên có thể có thêm các chức năng nâng cao khác, như:
- Chức năng phân loại bài viết: Bài viết có thể được phân loại theo các chủ đề khác nhau, như: học tập, định hướng nghề nghiệp, tâm lý,
PHÂN TÍCH THIẾT KẾ
LƯỢC ĐỒ USE CASE
Hình 3-4Lược đồ usercase: User
Hình 3-6 Lược đồ usecase: Admin
DANH SÁCH CÁC USECASE
Mô tả Tạo tài khoản mới dựa vào Email thuộc trường Đại học Sư phạm Kỹ thuật TP HCM
Hành vi của tác nhân Hành vi của hệ thống
1 Người dùng nhấn vào “Đăng ký” trên màn hình đăng nhập
2 Chuyển người dùng sang màn hình đăng ký
7 Chuyển người dùng sang trang đăng nhập
A1 Sai định dạng các filed dữ liệu
5 Thông báo lỗi tương ứng với các field
6 Quay lại bước 3 A2 Dữ liệu đầu vào có các filed bị trùng lặp
6 Trả về thông báo tương ứng với các field
7 Quay lại bước 3 Điều kiện trước
Người dùng mới, chưa có tài khoản Điều kiện sau
Mô tả Nhận mã OTP từ email để xác nhận người dùng
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
1 Hệ thống gửi mail (kèm mã
OTP) đến email của người dùng.
2 Màn hình người dùng hiện popup xác nhận OTP
3 Người dùng kiểm tra email trên tài khoản đã chính xác chưa sau đó nhập mã OTP chính xác từ email của người dùng Sau đó nhấn
4 Hệ thống kiểm tra mã OTP
5 Thông báo người dùng đã xác nhận thành công
7 Chuyển người dùng sang màn hình tương ứng
A1.1: Người dùng nhập sai mã OTP
5 Thông báo đến người dùng mã OTP bị sai
6 Quay lại bước 3 A1.2: Người dùng nhập sai mã OTP quá 3 lần
5 Thông báo người dùng phiên xác thực đã kết thúc và chuyển người dùng quay lại màn hình trước bước xác thực sau 5s. Điều kiện trước
Người dùng được chuyển đến trang xác thực từ 1 trong các hình thức (Đăng ký, quên mật khẩu …) Điều kiện sau Thông báo cho người dùng đã xác thực thành công và hiển thị nút
“Tiếp tục” đưa người dùng đến màn hình tiếp theo.
Bảng 3-2 Usecase Xác nhận OTP
Mô tả Đăng nhập bằng Username
3 Người dùng nhập thông tin tài khoản mật khẩu
4 Hệ thống kiểm tra thông tin tài khoản và mật khẩu
5 Chuyển người dùng sang trang Home
A2 Người dùng nhập sai tài khoản và mật khẩu
6 Thông báo lỗi tương ứng đến người dùng
7 Chuyển người dùng sang bước 6 Điều kiện trước Người dùng chưa đăng nhập hoặc phiên đăng nhập hết hạn Điều kiện sau Chuyền người dùng sang trang Đăng nhập
Mô tả Người dùng quên mật khẩu muốn lấy lại mật khẩu bằng email
Luồng chính Hành vi của tác nhân Luồng chính
1 Người dùng bấm vào nút quên mật khẩu ở trang đăng nhập
2 Hiển thị màn hình trang đăng nhập
Luồng thay thế 3 Người dùng nhập email và nhấn nút “Gửi”
Luồng thay thế 4 Hệ thống kiểm tra thông tin tài khoản và mật khẩu
5 Chuyển người dùng sang trang Home
7 Người dùng nhập mật khẩu mới và nhấn “Gửi”
A1 Email của người dùng không tồn tại trong hệ thống
5 Gửi thông báo tương ứng đến người dùng
6 Quay lại bước 3 Điều kiện trước Người dùng đang ở trang đăng nhập Điều kiện sau Đặt lại mật khẩu mới cho người dùng và thông báo đã đổi mật khẩu thành công
Bảng 3-4 Usecase quên mật khẩu
Mô tả Đổi mật khẩu mới cho tài khoản của người dùng
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
“Đổi mật khẩu” ở trang thông tin người dùng
2 Hệ thống chuyển người dùng sang trang đổi mật khẩu
3 Người dung nhập mật khẩu cũ và mật khẩu mới
4 Hệ thống kiểm tra thông tin mật khẩu cũ
5 Hệ thống thông báo người dùng thay đổi mật khẩu thành công
A1 Người dùng nhập sai mật khẩu cũ
5 Hệ thống thông báo lỗi tương ứng cho người dùng
Mô tả Đăng xuất tài khoản hiện tại khỏi nền tảng
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
1 Người dùng nhấn vào nút đăng xuất
2 Hệ thống đăng xuất người dùng khỏi hệ thống và chuyển sang trang khách
Luồng thay thế Điều kiện trước - Người dùng đã đăng nhập
- Người dùng đang ở trang thông tin cá nhân Điều kiện sau Đăng xuất người dùng và chuyển sang trang khách
Mô tả Người dùng đăng bài viết mới
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
1 Người dùng bấm vào “Đăng bài” ở trang
2 Hệ thống chuyển người dùng sang trang tạo bài viết thông tin cá nhân
3 Người dung nhập các thông tin liên quan đến bài viết và nhấn
4 Hệ thống thông báo đăng bài viết thành công
Luồng thay thế A1 Người dùng nhập thiếu thông tin
5 Hệ thống thông báo lỗi tương ứng cho người dùng
6 Quay lại bước 3 Điều kiện trước - Người dùng đã đăng nhập
- Người dùng đang ở trang thông tin cá nhân Điều kiện sau Bài viết mới được tạo và thông báo đến người dùng
Bảng 3-7 Usecase đăng bài viết
Mô tả Người dùng xem bài viết
Luồng chính Hành vi của tác nhân
Hành vi của hệ thống
1 Người dùng bấm vào tiêu đề của bài viết ở trang chủ
2 Hệ thống chuyển người dùng sang trang chi tiết bài viết
Mô tả Tạo bình luận trong bài viết
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
1 Người dùng bấm vào text box ở trang chi tiết bài viết
2 Người dung nhập nội dung bình luận
3 Hệ thống thông báo tạo bình luận thành công
Luồng thay thế A1 Người dùng nhập nội dung quá dài
5 Hệ thống thông báo lỗi tương ứng cho người dùng
6 Quay lại bước 2 Điều kiện trước - Người dùng đã đăng nhập
- Người dùng đang ở trang chi tiết bài viết Điều kiện sau Bình luận được tạo thành công và thông báo cho người dùng
Bảng 3-9 Usercase bình luận bài viết
Mô tả Tạo đánh giá cho bài viết
Hành vi của tác nhân Hành vi của hệ thống
1 Người dùng bấm vào biểu tượng like hoặc dislike ở trang chi tiết bài viết
2 Hệ thống thông báo đánh giá thành công và tính toán điểm cho user đăng bài
Luồng thay thế Điều kiện trước
- Người dùng đã đăng nhập
- Người dùng đang ở trang chi tiết bài viết Điều kiện sau
Tạo đánh giá thành công và thông báo cho người dùng
Bảng 3-10 Usecase đánh giá bài viết
Mô tả Tạo đánh giá cho bình luận
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
1 Người dùng bấm vào biểu tượng like hoặc dislike phía dưới bình luận ở trang chi tiết bài viết
2 Hệ thống thông báo đánh giá thành công và tính toán điểm cho user bình luận
Mô tả Đánh dấu bài viết
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
“Đánh dấu” ở trang chủ hoặc trang chi tiết bài viết
2 Hệ thống thông báo đánh dấu thành công
Luồng thay thế Điều kiện trước
- Người dùng đã đăng nhập
- Người dùng đang ở trang chi tiết bài viết hoặc trang chủ Điều kiện sau Tạo đánh dấu thành công và thông báo cho người dùng
Bảng 3-12 Usecase đánh dấu bài viết
3.2.13 Xem thông tin cá nhân người dùng khác
Mô tả Xem thông tin cá nhân người dùng khác
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
1 Người dùng bấm tên của người dung khác ở trang chủ hoặc khi tìm kiếm
2 Hệ thống chuyển người dùng đến trang cá nhân của người dùng khác
Luồng thay thế Điều kiện trước
- Người dùng đã đăng nhập Điều kiện sau Người dùng xem được thông tin cá nhân của người dùng khác
Bảng 3-13 Usecase xem thông cá nhân người dùng khác
3.2.14 Theo dõi người dùng khác
Mô tả Theo dõi người dùng khác
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
“Theo dõi” của người dùng ở trang chi tiết cá nhân
2 Hệ thống thông báo theo dõi thành công
Mô tả Người dùng chỉnh sửa thông tin cá nhân
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
“Chỉnh sửa thông tin” ở trang cá nhân
2 Hệ thống chuyển người dùng sang trang chỉnh sửa cá nhân
3 Người dung nhập các thông tin liên quan và nhấn “Lưu”
4 Hệ thống thông báo chỉnh sửa thông tin thành công
Luồng thay thế A1 Người dùng nhập thiếu thông tin
5 Hệ thống thông báo lỗi tương ứng cho người dùng
6 Quay lại bước 3 Điều kiện trước - Người dùng đã đăng nhập
- Người dùng đang ở trang thông tin cá nhân Điều kiện sau Chỉnh sửa thông tin thành công và thông báo đến người dùng
Bảng 3-15 Usecase chỉnh sửa thông tin cá nhân
Mô tả Người dùng báo cáo người dùng khác
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
“Báo cáo” của người dùng ở trang chi tiết cá nhân
2 Hệ thống chuyển đến trang báo cáo
3 Người dùng nhập lý do và nội dung báo cáo rồi ấn “Báo cáo”
4 Hệ thống thông báo báo cáo thành công
Luồng thay thế Điều kiện trước - Người dùng đã đăng nhập
- Người dùng ở trang chi tiết cá nhân của người dùng khác Điều kiện sau Người dùng báo cáo được người dùng khác và hệ thống thông báo thành công
Bảng 3-16 Usecase báo cáo người dùng
Mô tả Người dùng báo cáo bài viết
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
“Báo cáo” ở trang chi tiết bài viết
2 Hệ thống chuyển đến trang báo cáo Điều kiện trước - Người dùng đã đăng nhập
- Người dùng ở trang chi tiết bài viết Điều kiện sau Người dùng báo cáo được bài viết và hệ thống thông báo thành công
Bảng 3-17 Usecase báo cáo bài viết
Mô tả Người dùng báo cáo bình luận
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
“Báo cáo” phía dưới bình luận ở trang chi tiết bài viết
2 Hệ thống chuyển đến trang báo cáo
3 Người dùng nhập lý do và nội dung báo cáo rồi ấn “Báo cáo”
4 Hệ thống thông báo báo cáo thành công
Luồng thay thế Điều kiện trước - Người dùng đã đăng nhập
- Người dùng ở trang chi tiết bài viết Điều kiện sau Người dùng báo cáo được bình luận và hệ thống thông báo thành công
Bảng 3-18 Usecase bào cáo bình luận
Mô tả Người dùng tạo nhóm
Luồng chính Hành vi của tác nhân Luồng chính
“Tạo nhóm” ở trang cá nhân
2 Hệ thống chuyển đến trang tạo nhóm
3 Người dung nhập các thông tin liên quan và nhấn “Lưu”
4 Hệ thống thông báo báo cáo thành công
Luồng thay thế A1 Người dùng nhập thiếu thông tin
5 Hệ thống thông báo lỗi tương ứng cho người dùng
6 Quay lại bước 3 Điều kiện trước - Người dùng đã đăng nhập
- Người dùng đang ở trang thông tin cá nhân Điều kiện sau Tạo nhóm thành công và thông báo đến người dùng
“Tham gia” ở trang chi tiết nhóm
2 Hệ thống thông báo đã gởi đơn xin vào nhóm thành công
Luồng thay thế Điều kiện trước - Người dùng đã đăng nhập
- Người dùng ở trang chi tiết nhóm Điều kiện sau Người dùng tạo đơn xin vào nhóm thành công
Bảng 3-20 Usecase xin vào nhóm
Mô tả Admin của nhóm duyệt thành viên vào nhóm
Luồng chính Hành vi của tác nhân Luồng chính
1 Admin nhóm chọn người dùng muốn duyệt vào nhóm
2 Hệ thống cho admin nhóm xem đơn xin vào nhóm
3 Admin nhóm chọn 4 Hệ thống thông báo kết quả đến
“Duyệt” hoặc “Từ chối” người dùng.
Luồng thay thế Điều kiện trước - Người dùng đã đăng nhập
-Người dùng là admin nhóm
- Người dùng ở trang quản lý nhóm Điều kiện sau Admin phê duyệt người dùng thành công và thông báo kết quản đến người dùng.
Bảng 3-21 Usecase duyệt vào nhóm
3.2.22 Đăng bài viết trong nhóm
Mô tả Người dùng muốn đăng bài viết trong nhóm
Luồng chính Hành vi của tác nhân Luồng chính
1 Người chọn “Tạo bài viết” trong trang chi tiết nhóm
2 Hệ thống chuyển đến trang thêm bài viết trong nhóm
3 Người dùng nhập các thông tin cần thiết và nhấn
4 Hệ thống thông báo tạo bài viết thành công
Luồng thay thế Điều kiện - Người dùng đã đăng nhập
Mô tả Thành viên muốn rời nhóm
Luồng chính Hành vi của tác nhân Luồng chính
“Rời nhóm” ở trang chi tiết nhóm
2 Hệ thống thông báo ròi nhóm thành công
Luồng thay thế Điều kiện trước - Người dùng đã đăng nhập
-Người dùng là thành viên nhóm
- Người dùng ở trang chi tiết nhóm Điều kiện sau Người dùng rời nhóm thành công
Mô tả Admin nhóm muốn xoá nhóm
Luồng chính Hành vi của tác nhân Luồng chính
“Xoá nhóm” ở trang quản lý nhóm
2 Hệ thống thông báo xoá nhóm thành công
Luồng thay thế Điều kiện trước - Người dùng đã đăng nhập
-Người dùng là admin nhóm
- Người dùng ở trang quản lý nhóm Điều kiện sau Người dùng xoá nhóm thành công
Mô tả Admin muốn thêm chủ đề
Luồng chính Hành vi của tác nhân Luồng chính
1 Admin chọn “Thêm chủ đề” ở trang quản lý chủ đề
2 Hệ thống chuyển đến trang thêm chủ đề
3 Admin nhập các thông tin liên quan và ấn
4 Hệ thống thông báo thêm thành công
- Admin ở trang quản lý chủ đề Điều kiện sau Admin thêm chủ đề thành công.
Bảng 3-25 Usecase admin thêm chủ đề
Mô tả Admin muốn sửa chủ đề
Luồng chính Hành vi của tác nhân Luồng chính
1 Admin chọn chủ đề muốn sửa và ấn “Sửa” ở trang quản lý chủ đề
2 Hệ thống chuyển đến trang sửa chủ đề
3 Admin nhập các thông tin liên quan và ấn
4 Hệ thống thông báo sửa thành công
A1 Người dùng nhập thiếu thông tin
5 Hệ thống thông báo lỗi tương ứng cho người dùng
6 Quay lại bước 3 Điều kiện trước
- Admin ở trang quản lý chủ đề Điều kiện sau Admin thêm chủ đề thành công.
Bảng 3-26 Usecase admin sửa chủ đề
Mô tả Admin muốn cấm người dùng
Luồng chính Hành vi của tác nhân Luồng chính
1 Admin chọn người dùng muốn cấm ở trang quản lý người dùng
2 Hệ thống chuyển đến trang cấm người dùng
3 Admin chọn lệnh cấm và ấn “Cấm”
4 Hệ thống thông báo cấm thành công
Luồng thay thế Điều kiện trước
- Admin ở trang quản lý người dùng Điều kiện sau Admin cấm người dùng thành công.
Bảng 3-27 Usecase admin cấm người dùng
3.2.28 Admin gỡ lệnh cấm người dùng
Mô tả Admin muốn gỡ lệnh cấm người dùng
Luồng chính Hành vi của tác nhân Luồng chính
Luồng thay thế Điều kiện trước
- Admin ở trang quản lý người dùng Điều kiện sau Admin cấm người dùng thành công.
Bảng 3-28: Usecase admin gỡ lệnh cấm người dùng
3.2.29 Admin cộng, trừ điểm đóng góp người dùng
Mô tả Admin muốn cộng, trừ điểm đóng góp cho người dùng
Luồng chính Hành vi của tác nhân Luồng chính
1 Admin chọn người dùng muốn cộng hoặc trừ điểm đóng góp
2 Admin chọn vào icon người dùng ở cột hành động ở dòng người dùng Admin muốn chọn
3 Admin nhập vào số điểm muốn cộng hoặc trừ
4 Hệ thống sẽ nhận số điểm và xử lý
5 Hệ thống thông báo cộng, trừ thành công
Luồng thay thế 3 Admin nhập sai định dạng (không phải số)
4 Hệ thống thông báo lỗi Quay lại bước 3 Điều kiện trước - Admin đã đăng nhập
- Admin ở trang quản lý người dùng Điều kiện sau Admin cấm người dùng thành công.
Bảng 3-29 Admin cộng, trừ điểm đóng góp người dùng
3.2.30 Admin xử lý report người dùng
Mô tả Admin xử lý report người dùng
Luồng chính Hành vi của tác nhân Luồng chính
1 Admin chọn loại report là “Người dùng”
2 Admin chọn vào icon hình mắt ở cột hành động ở dòng report mà admin muốn xem
3 Admin xem chi tiết report
4 Hệ thống hiển thị popup xem chi tiết report
8 Hệ thống sẽ xóa report đã xem A2: Nếu report đúng sự thật, hợp lý, admin chọn vào nút “Tick”
6 Hệ thống hiện popup nhập số điểm đóng góp mà admin sẽ trừ người dùng này
7 Admin nhập số điểm cần trừ
8 Hệ thống sẽ trừ điểm và gửi thông báo đến người dùng
9 Xóa report => luồng A1 Điều kiện trước
- Admin ở trang quản lý report Điều kiện sau Admin xử lý report thành công
Bảng 3-30 Admin xử lý report người dùng
3.2.31 Admin xử lý report bài viết
Mô tả Admin xử lý report bài viết
Luồng chính Hành vi của tác nhân Luồng chính
1 Admin chọn loại report là “Bài viết”
2 Admin chọn vào icon hình mắt ở cột hành động ở dòng report mà admin muốn xem
3 Admin xem chi tiết report
4 Hệ thống hiển thị popup xem chi tiết report
5 Admin chọn tắt sau khi xem xong chi tiết report
A1” Nếu Report đã được xử lý hoặc sai sự thật, vô lý, Admin chọn nút “Xóa” ở dòng report đang xem
6 Hệ thống hiển thị popup thông báo xóa report
8 Hệ thống sẽ xóa report đã xem A2: Nếu report đúng sự thật, hợp lý, admin chọn vào nút “Tick”
6 Hệ thống hiện popup nhập số điểm đóng góp mà admin sẽ trừ người dùng này
7 Admin nhập số điểm cần trừ
8 Hệ thống sẽ trừ điểm người dùng đăng bài, xóa bài viết và gửi thông báo đến người dùng
9 Xóa report => luồng A1 Điều kiện trước
- Admin ở trang quản lý report Điều kiện sau Admin xử lý report thành công
Bảng 3-31 Admin xử lý report bài viết
1 Admin chọn loại report là “Người dùng”
2 Admin chọn vào icon hình mắt ở cột hành động ở dòng report mà admin muốn xem
3 Admin xem chi tiết report
4 Hệ thống hiển thị popup xem chi tiết report
5 Admin chọn tắt sau khi xem xong chi tiết report
Luồng thay thế A1” Nếu Report đã được xử lý hoặc sai sự thật, vô lý, Admin chọn nút “Xóa” ở dòng report đang xem
6 Hệ thống hiển thị popup thông báo xóa report
8 Hệ thống sẽ xóa report đã xem A2: Nếu report đúng sự thật, hợp lý, admin chọn vào nút “Tick”
6 Hệ thống hiện popup nhập số điểm đóng góp mà admin sẽ trừ người dùng tạo bình luận này.
7 Admin nhập số điểm cần trừ
8 Hệ thống sẽ trừ điểm người dùng, xóa bình luận và gửi thông báo đến người dùng
9 Xóa report => luồng A1 Điều kiện trước - Admin đã đăng nhập
- Admin ở trang quản lý report Điều kiện sau Admin xử lý report thành công
Bảng 3-32 Admin xử lý report bình luận
3.2.33 Admin xem thông tin thống kê
Mô tả Xem thông tin thống kê
Luồng chính Hành vi của tác nhân Hành vi của hệ thống
1 Admin bấm vào nút thống kê trên thanh header
2 Hệ thống chuyển người dùng đến trang thống kê
Luồng thay thế Điều kiện trước - Admin đã đăng nhập Điều kiện sau - Admin xem được thông tin thống kê
Bảng 3-33 Admin xem thông tin thống kê
Hình 3-7 Lược đồ tuần tự đăng nhập
Hình 3-8 Lược đồ tuần tự đăng ký
3.3.3 Quản lý thông tin cá nhân
Hình 3-9 Lược đồ tuần tự quản lý thông tin cá nhân
Hình 3-10 Lược đồ tuần tự Quản lý bài viết
Hình 3-11 Lược đồ tuần tự tìm kiếm bài viết
Hình 3-12 Lược đồ tuần tự tạo bình luận
3.3.7 Tạo đánh giá bài viết
Hình 3-13 Lược đồ tuần tự đánh giá bài viết
Hình 3-14 Lược đồ tuần tự tạo đánh giá bình luận
Hình 3-15 Lược đồ tuần tự tạo đánh dấu bài viết
3.3.10 Theo dõi người dùng khác
Hình 3-16 Lược đồ tuần tự theo dõi người dùng khác
3.3.11 Báo cáo người dùng khác
Hình 3-17 Lược đồ tuần tự báo cáo người dùng khác
Hình 3-18 Lược đồ tuần tự báo cáo bài viết
Hình 3-19 Lược đồ tuần tự báo cáo bình luận
Hình 3-20 Lược đồ tuần tự quản lý nhóm
Hình 3-21 Lược đồ tuần tự xin vào nhóm
Hình 3-22 Lược đồ tuần tự duyệt đơn xin vào nhóm
3.3.17 Đăng bài viết trong nhóm
Hình 3-23 Lược đồ tuần tự đăng bài viết trong nhóm
Hình 3-24 Lược đồ tuần tự xóa nhóm
3.3.19 Admin quản lý chủ đề
Hình 3-25 Lược đồ tuần tự admin quản lý chủ đề
Hình 3-26 Lược đồ tuần tự quản lý người dùng
3.4.1 Lược đồ cơ sở dữ liệu
Hình 3-27 Lược đồ cơ sở dữ liệu
3.4.2 Mô tả cơ sở dữ liệu
KIỂU DỮ LIỆU MÔ TẢ
1 userid String – PK Mã người dùng
2 mssv String Mã số sinh viên
3 email String Email sinh viên
4 username String Tên đăng nhập
8 fullname String Tên đầy đủ
9 phone String Số điện thoại
11 image String Ảnh đại diện
12 reputation int Điểm đóng góp
13 createday Date Ngày tạo tài khoản
14 type String Loại tài khoản
16 roleid int - FK Mã quyền
17 isbanid int - FK Mã lệnh cấm
3 userid String - FK Mã người tạo
6 totalread int Tổng LƯỢC đọc
9 groupid int - FK Mã nhóm
10 ishide int Trạng thái ẩn
12 requiredreputation int Điểm đóng góp yêu cầu
STT TÊN THUỘC TÍNH KIỂU DỮ
1 commentid int – PK Mã bình luận
2 postid int - FK Mã bài viết
3 userid String - FK Mã người tạo
5 Comment_commentid int - FK Mã bình luận cha
KIỂU DỮ LIỆU MÔ TẢ
1 topicid int – PK Mã chủ đề
2 topicname String Tên chủ đề
3 isdelete int Trạng thái xoá
4 ishide int Trạng thái ẩn
KIỂU DỮ LIỆU MÔ TẢ
1 groupid int – PK Mã nhóm
KIỂU DỮ LIỆU MÔ TẢ
1 noticeid int – PK Mã thông báo
2 content String Tên thông báo
3 userid String - FK Mã người nhận
4 subject int Chủ đề thông báo
5 type int Loại thông báo
6 isseen int Trạng thái xem
1 reportid int – PK Mã báo cáo
5 createday Date Ngày báo cáo
6 User_report String - FK Mã người bị báo cáo
7 Post_report Int - FK Mã bài viết bịị báo cáo
8 Comment_report Int - FK Mã bình luận bị báo cáo
9 User_reporter String - FK Mã người báo cáo
1 followid int – PK Mã theo dõi
2 user_follow String - FK Mã người được theo dõi
3 user_follower String – FK Mã người theo dõi
STT TÊN THUỘC KIỂU DỮ MÔ TẢ
1 viewposstid int – PK Mã LƯỢC xem
2 userid String - FK Mã người xem
3 postid int – FK Mã bài viết được xem
1 postlikeid int – PK Mã đánh giá
2 userid String Mã người đánh giá
3 iconid String Mã loại đánh gias
4 postid int Mã bài viết đánh giá
1 commentlikeid int – PK Mã đánh giá
2 userid String Mã người đánh giá
3 iconid String Mã loại đánh giá
4 commentid int Mã bình luận đánh giá
1 iconid int – PK Mã đánh giá
2 iconname String Tên đánh giá
1 Refreshid int – PK Mã refreshtoken
2 userid String - FK Mã người dùng
3 token String Chuỗi xác thưc
2 nameban String Tên lệnh cấm
1 rolenid int – PK Mã quyền
KIỂU DỮ LIỆU MÔ TẢ
1 messageid int – PK Mã đoạn chat
2 messagename String Tên đoạn chat
STT TÊN THUỘC TÍNH KIỂU DỮ
1 detailmessageid int – PK Mã chi tiết đoạn chat
2 detailmessage_messageid int Mã đoạn chat
3 user_detailmessage String Mã user
5 lastseen Date Tin nhắn cuối cùng
STT TÊN THUỘC TÍNH KIỂU DỮ
1 contentid int – PK Mã tin nhắn
2 content String Nội dung tin nhắn
5 message_content int Mã đoạn chat
6 user_content String Mã người tạo
7 contentMessageResponse int Mã tin nhắn phản hồi
8 icon_contentmessage int Mã biêu cảm
STT TÊN THUỘC TÍNH KIỂU DỮ
5 group_messagedescription String Mô tả
STT TÊN THUỘC TÍNH KIỂU DỮ
1 detailgroup_messageid int – PK Mã chi tiết đoạn chat
2 detailgroupmessage_groupmessage int Mã đoạn chat nhóm
3 user_detailgroupmessage String Mã thành viên
5 createday_content Date Ngày tạo
STT TÊN THUỘC TÍNH KIỂU DỮ
1 content_groupmessageid int – PK Mã tin nhắn nhóm
2 content String Nội dung tin nhắn
5 groupmessage_content int Mã đoạn chat nhóm
6 user_contentgroup String Mã người tạo
7 contentMessageResponse int Mã tin nhắn phản hồi
STT TÊN THUỘC TÍNH KIỂU DỮ
1 content_groupmessage_iconid int – PK Mã biểu cảm chat
2 contentgroupmessageid int Mã tin nhắn
3 iconid int Mã biểu cảm
4 useid String Mã người tạo
Hình 2-29 Màn hình đăng ký
STT Tên Loại Ghi chú
1 Họ tên Input text Nhập họ và tên
2 Email Input text Nhập email trường cung cấp
3 Tên đăng nhập Input text Nhập tên đăng nhập
4 Mật khẩu Input text Nhập mật khẩu
5 Đăng ký Button Nhấn để đăng ký
6 Đăng nhập Button Nhấn để về trang đăng nhập
Bảng 3-58 Mô tả trang đăng ký
Hình 2-30 Màn hình trang chủ
STT Tên Loại Ghi chú
1 Tìm kiếm Input text Nhập từ khóa tìm kiếm
2 Trang chủ Button Nhấn để quay về trang chủ
3 Chủ đề Button Nhấn để đến trang chủ đề
4 Diễn đàn Button Nhấn để đến trang diễn đàn
5 Chat gemini Button Nhấn để chat với AI
6 Đăng bài Button Nhấn để đăng bài
7 Tin nhắn Button Nhấn để xem tin nhắn
8 Thông báo Button Nhấn để xem thông báo
9 Menu người dùng Button Nhấn để xem menu người dùng
10 Dành cho bạn Button Nhấn để hiển thị các bài viết
11 Đang theo dõi Button Nhấn để hiển thi các bài viết của những người đang theo dõi
12 Bài viết Button Nhấn để xem chi tiết bài viết
13 Menu bài viết Button Nhấn để xem menu
14 Nút like Button Nhấn để like
15 Nút dislike Button Nhấn để dislike
Hình 2-31 Giao diện trang chủ đề
STT Tên Loại Ghi chú
1 Thẻ chủ đề Button Nhấn để tìm theo chủ đề có sẵn
2 Tìm nhiều hơn Button Nhấn để tìm nhiều hơn 1 chủ đề
Bảng 3-60 Mô tả trang chủ đề
Hình 2-32 Giao diện trang diễn đàn
STT Tên Loại Ghi chú
1 Thẻ tên diễn đàn Button Nhấn để vào trang chi tiết diễn đàn
Bảng 3-61 Mô tả trang diễn đàn
Hình 2-33 Giao diện trang hiển thị người dùng đang theo dõi
STT Tên Loại Ghi chú
1 Thẻ tên người đang theo dõi
Button Nhấn để vào trang chi tiết người dùng
2 Bỏ theo dõi Button Nhấn để bỏ theo dõi
Bảng 3-62 Mô tả trang hiển thị người dùng đang theo dõi
Hình 2-34 Giao diện trang hiển thị người dùng khác đã theo dõi người dùng
Hình 2-35 Giao diện hiển thị những bài viết người dùng đã lưu
STT Tên Loại Ghi chú
1 Thẻ Button Nhấn để vào trang chi tiết bài viết
Bảng 3-64 Mô tả trang hiển thị những bài viết người dùng đã lưu
Hình 2-36 Giao diện hiển thị những bài đăng của người dùng
STT Tên Loại Ghi chú
1 Tạo nhóm Button Nhấn để tạo nhóm mới
2 Đăng bài Button Nhấn vào để đăng bài
3 Chỉnh sửa trang cá nhân
Button Nhấn để chỉnh sửa trang cá nhân
Bảng 3-65 Mô tả trang hiển thị những bài đăng của người dùng
Hình 2-37 Giao diện trang quản lý tài khoản người dùng
Hình 2-38 Giao diện trang đăng bài viết
STT Tên Loại Ghi chú
Bảng 3-66 Mô tả trang đăng bài
Hình 2-39 Giao diện form chỉnh sửa tài khoản
Hình 2-40 Giao diện form tạo diễn đàn
STT Tên Loại Ghi chú
1 Ảnh đại diện Input file Tải lên ảnh đại diện nhóm
2 Tên nhóm Input text Nhập tên nhóm
3 Mô tả nhóm Input text Mô tả nhóm
4 Lưu Button Nhấn để tạo nhóm
Bảng 3-67 Mô tả form tạo diễn đàn
Hình 2-41 Giao diện diễn đàn
STT Tên Loại Ghi chú
1 Đăng bài Button Tạo bài đăng trên nhóm
2 Chỉnh sửa nhóm Button Chỉnh sửa nhóm
3 Yêu cầu vào nhóm Button Xem yêu cầu vào nhóm (dành cho admin nhóm)
4 Icon Button Nhấn để xem thành viên nhóm
Bảng 3-68 Mô tả trang chi tiết diễn đàn
Hình 2-42 Giao diện form chỉnh sửa group diễn đàn
Hình 2-43 Giao diện form quản lý thông tin xin gia nhập Diễn đàn
Hình 2-44 Giao diện chi tiết bài đăng trên diễn đàn
Hình 2-45 Giao diện report comment
Hình 2-46 Giao diện report người dùng
Hình 2-47 Giao diện report bài viết
Hình 2-48 Giao diện quản lý người dùng
STT Tên Loại Ghi chú
1 Menu Button Menu quản lý
2 Cấm Button Nhấn để cấm người dùng
Bảng 3-69 Mô tả giao diện quản lý người dùng
Hình 2-49 Gieo diện quản lý bài viết
Hình 3-50 Giao diện admin quản lý diễn đàn
Hình 3-51 Giao diện admin quản lý report - người dùng
Hình 3-52 Giao diện admin quản lý report - bài viết
Hình 3-53 Giao diện admin quản lý report - bình luận
Hình 3-54 Giao diện quản lý thông báo (người dùng và admin)
THIẾT KẾ DỮ LIỆU
3.4.1 Lược đồ cơ sở dữ liệu
Hình 3-27 Lược đồ cơ sở dữ liệu
3.4.2 Mô tả cơ sở dữ liệu
KIỂU DỮ LIỆU MÔ TẢ
1 userid String – PK Mã người dùng
2 mssv String Mã số sinh viên
3 email String Email sinh viên
4 username String Tên đăng nhập
8 fullname String Tên đầy đủ
9 phone String Số điện thoại
11 image String Ảnh đại diện
12 reputation int Điểm đóng góp
13 createday Date Ngày tạo tài khoản
14 type String Loại tài khoản
16 roleid int - FK Mã quyền
17 isbanid int - FK Mã lệnh cấm
3 userid String - FK Mã người tạo
6 totalread int Tổng LƯỢC đọc
9 groupid int - FK Mã nhóm
10 ishide int Trạng thái ẩn
12 requiredreputation int Điểm đóng góp yêu cầu
STT TÊN THUỘC TÍNH KIỂU DỮ
1 commentid int – PK Mã bình luận
2 postid int - FK Mã bài viết
3 userid String - FK Mã người tạo
5 Comment_commentid int - FK Mã bình luận cha
KIỂU DỮ LIỆU MÔ TẢ
1 topicid int – PK Mã chủ đề
2 topicname String Tên chủ đề
3 isdelete int Trạng thái xoá
4 ishide int Trạng thái ẩn
KIỂU DỮ LIỆU MÔ TẢ
1 groupid int – PK Mã nhóm
KIỂU DỮ LIỆU MÔ TẢ
1 noticeid int – PK Mã thông báo
2 content String Tên thông báo
3 userid String - FK Mã người nhận
4 subject int Chủ đề thông báo
5 type int Loại thông báo
6 isseen int Trạng thái xem
1 reportid int – PK Mã báo cáo
5 createday Date Ngày báo cáo
6 User_report String - FK Mã người bị báo cáo
7 Post_report Int - FK Mã bài viết bịị báo cáo
8 Comment_report Int - FK Mã bình luận bị báo cáo
9 User_reporter String - FK Mã người báo cáo
1 followid int – PK Mã theo dõi
2 user_follow String - FK Mã người được theo dõi
3 user_follower String – FK Mã người theo dõi
STT TÊN THUỘC KIỂU DỮ MÔ TẢ
1 viewposstid int – PK Mã LƯỢC xem
2 userid String - FK Mã người xem
3 postid int – FK Mã bài viết được xem
1 postlikeid int – PK Mã đánh giá
2 userid String Mã người đánh giá
3 iconid String Mã loại đánh gias
4 postid int Mã bài viết đánh giá
1 commentlikeid int – PK Mã đánh giá
2 userid String Mã người đánh giá
3 iconid String Mã loại đánh giá
4 commentid int Mã bình luận đánh giá
1 iconid int – PK Mã đánh giá
2 iconname String Tên đánh giá
1 Refreshid int – PK Mã refreshtoken
2 userid String - FK Mã người dùng
3 token String Chuỗi xác thưc
2 nameban String Tên lệnh cấm
1 rolenid int – PK Mã quyền
KIỂU DỮ LIỆU MÔ TẢ
1 messageid int – PK Mã đoạn chat
2 messagename String Tên đoạn chat
STT TÊN THUỘC TÍNH KIỂU DỮ
1 detailmessageid int – PK Mã chi tiết đoạn chat
2 detailmessage_messageid int Mã đoạn chat
3 user_detailmessage String Mã user
5 lastseen Date Tin nhắn cuối cùng
STT TÊN THUỘC TÍNH KIỂU DỮ
1 contentid int – PK Mã tin nhắn
2 content String Nội dung tin nhắn
5 message_content int Mã đoạn chat
6 user_content String Mã người tạo
7 contentMessageResponse int Mã tin nhắn phản hồi
8 icon_contentmessage int Mã biêu cảm
STT TÊN THUỘC TÍNH KIỂU DỮ
5 group_messagedescription String Mô tả
STT TÊN THUỘC TÍNH KIỂU DỮ
1 detailgroup_messageid int – PK Mã chi tiết đoạn chat
2 detailgroupmessage_groupmessage int Mã đoạn chat nhóm
3 user_detailgroupmessage String Mã thành viên
5 createday_content Date Ngày tạo
STT TÊN THUỘC TÍNH KIỂU DỮ
1 content_groupmessageid int – PK Mã tin nhắn nhóm
2 content String Nội dung tin nhắn
5 groupmessage_content int Mã đoạn chat nhóm
6 user_contentgroup String Mã người tạo
7 contentMessageResponse int Mã tin nhắn phản hồi
STT TÊN THUỘC TÍNH KIỂU DỮ
1 content_groupmessage_iconid int – PK Mã biểu cảm chat
2 contentgroupmessageid int Mã tin nhắn
3 iconid int Mã biểu cảm
4 useid String Mã người tạo
THIẾT KẾ GIAO DIỆN
Hình 2-29 Màn hình đăng ký
STT Tên Loại Ghi chú
1 Họ tên Input text Nhập họ và tên
2 Email Input text Nhập email trường cung cấp
3 Tên đăng nhập Input text Nhập tên đăng nhập
4 Mật khẩu Input text Nhập mật khẩu
5 Đăng ký Button Nhấn để đăng ký
6 Đăng nhập Button Nhấn để về trang đăng nhập
Bảng 3-58 Mô tả trang đăng ký
Hình 2-30 Màn hình trang chủ
STT Tên Loại Ghi chú
1 Tìm kiếm Input text Nhập từ khóa tìm kiếm
2 Trang chủ Button Nhấn để quay về trang chủ
3 Chủ đề Button Nhấn để đến trang chủ đề
4 Diễn đàn Button Nhấn để đến trang diễn đàn
5 Chat gemini Button Nhấn để chat với AI
6 Đăng bài Button Nhấn để đăng bài
7 Tin nhắn Button Nhấn để xem tin nhắn
8 Thông báo Button Nhấn để xem thông báo
9 Menu người dùng Button Nhấn để xem menu người dùng
10 Dành cho bạn Button Nhấn để hiển thị các bài viết
11 Đang theo dõi Button Nhấn để hiển thi các bài viết của những người đang theo dõi
12 Bài viết Button Nhấn để xem chi tiết bài viết
13 Menu bài viết Button Nhấn để xem menu
14 Nút like Button Nhấn để like
15 Nút dislike Button Nhấn để dislike
Hình 2-31 Giao diện trang chủ đề
STT Tên Loại Ghi chú
1 Thẻ chủ đề Button Nhấn để tìm theo chủ đề có sẵn
2 Tìm nhiều hơn Button Nhấn để tìm nhiều hơn 1 chủ đề
Bảng 3-60 Mô tả trang chủ đề
Hình 2-32 Giao diện trang diễn đàn
STT Tên Loại Ghi chú
1 Thẻ tên diễn đàn Button Nhấn để vào trang chi tiết diễn đàn
Bảng 3-61 Mô tả trang diễn đàn
Hình 2-33 Giao diện trang hiển thị người dùng đang theo dõi
STT Tên Loại Ghi chú
1 Thẻ tên người đang theo dõi
Button Nhấn để vào trang chi tiết người dùng
2 Bỏ theo dõi Button Nhấn để bỏ theo dõi
Bảng 3-62 Mô tả trang hiển thị người dùng đang theo dõi
Hình 2-34 Giao diện trang hiển thị người dùng khác đã theo dõi người dùng
Hình 2-35 Giao diện hiển thị những bài viết người dùng đã lưu
STT Tên Loại Ghi chú
1 Thẻ Button Nhấn để vào trang chi tiết bài viết
Bảng 3-64 Mô tả trang hiển thị những bài viết người dùng đã lưu
Hình 2-36 Giao diện hiển thị những bài đăng của người dùng
STT Tên Loại Ghi chú
1 Tạo nhóm Button Nhấn để tạo nhóm mới
2 Đăng bài Button Nhấn vào để đăng bài
3 Chỉnh sửa trang cá nhân
Button Nhấn để chỉnh sửa trang cá nhân
Bảng 3-65 Mô tả trang hiển thị những bài đăng của người dùng
Hình 2-37 Giao diện trang quản lý tài khoản người dùng
Hình 2-38 Giao diện trang đăng bài viết
STT Tên Loại Ghi chú
Bảng 3-66 Mô tả trang đăng bài
Hình 2-39 Giao diện form chỉnh sửa tài khoản
Hình 2-40 Giao diện form tạo diễn đàn
STT Tên Loại Ghi chú
1 Ảnh đại diện Input file Tải lên ảnh đại diện nhóm
2 Tên nhóm Input text Nhập tên nhóm
3 Mô tả nhóm Input text Mô tả nhóm
4 Lưu Button Nhấn để tạo nhóm
Bảng 3-67 Mô tả form tạo diễn đàn
Hình 2-41 Giao diện diễn đàn
STT Tên Loại Ghi chú
1 Đăng bài Button Tạo bài đăng trên nhóm
2 Chỉnh sửa nhóm Button Chỉnh sửa nhóm
3 Yêu cầu vào nhóm Button Xem yêu cầu vào nhóm (dành cho admin nhóm)
4 Icon Button Nhấn để xem thành viên nhóm
Bảng 3-68 Mô tả trang chi tiết diễn đàn
Hình 2-42 Giao diện form chỉnh sửa group diễn đàn
Hình 2-43 Giao diện form quản lý thông tin xin gia nhập Diễn đàn
Hình 2-44 Giao diện chi tiết bài đăng trên diễn đàn
Hình 2-45 Giao diện report comment
Hình 2-46 Giao diện report người dùng
Hình 2-47 Giao diện report bài viết
Hình 2-48 Giao diện quản lý người dùng
STT Tên Loại Ghi chú
1 Menu Button Menu quản lý
2 Cấm Button Nhấn để cấm người dùng
Bảng 3-69 Mô tả giao diện quản lý người dùng
Hình 2-49 Gieo diện quản lý bài viết
Hình 3-50 Giao diện admin quản lý diễn đàn
Hình 3-51 Giao diện admin quản lý report - người dùng
Hình 3-52 Giao diện admin quản lý report - bài viết
Hình 3-53 Giao diện admin quản lý report - bình luận
Hình 3-54 Giao diện quản lý thông báo (người dùng và admin)
KIỂM THỬ
KẾ HOẠCH KIỂM THỬ
Tài liệu kế hoạch kiểm thử này đưa ra các mục đích sau:
● Xác định thông tin cơ bản về dự án và các thành phần chức năng được kiểm thử và không được kiểm thử.
● Liệt kê những yêu cầu cho việc kiểm thử (Test Requirements).
● Những chiến lược kiểm thử nên được sử dụng.
● Ước lượng những yêu cầu về tài nguyên và chi phí cho việc kiểm thử.
Các dịch vụ, chức năng cần kiểm tra:
- Quản lý hồ sơ cá nhân
- Xem bài viết, thông tin cá nhân của người khác
- Tạo bài viết, bình luận
- Đánh giá bài viết, bình luận
Lập kế hoạch kiểm thử
Xem lại các tài liệu Tài liệu Tes
Viết các testcase Tài liệu
Bảng 4-70 Lịch trình kiểm thử
Mục đích kiểm tra Đảm bảo các chức năng được kiểm tra hoạt động chính xác theo đặc tả yêu cầu
Kỹ thuật Thực thi tất cả các trường hợp có thể có cho mỗi nhóm chức năng, sử dụng dữ liệu hợp lệ và không hợp lệ để xác định:
- Kết quả mong đợi khi dữ liệu hợp lệ được sử dụng
- Cảnh báo phù hợp hiện ra khi dữ liệu không hợp lệ được sử dụng
Tất cả các testcase đã được thiết kế đều được thực thi.
Tất cả các lỗi tìm thấy đều được ghi nhận lý do rõ ràng để có thể giúp cho developer khắc phục.
Chịu trách nhiệm kiểm thử
Kiểm thử bằng tay thủ công, tuần tự theo các bước được định nghĩa trong testcase
Xử lý ngoại lệ Liệt kê tất cả các vấn đề liên quan phát sinh trong quá trình thực thi kiểm thử.
Bảng 4-71 Chiến lược kiểm thử
PHƯƠNG PHÁP KIỂM THỬ
Là một loại kiểm thử phần mềm trong đó thực hiện kiểm thử từng đơn vị hoặc thành phần riêng lẻ của phần mềm Mục đích của việc này là để xác nhận rằng của mỗi đơn vị hay mã code của phần mềm thực hiện chức năng đúng như mong đợi
Hình 73: Unit Test Ưu điểm:
- Kiểm thử đơn vị giúp sửa lỗi sớm trong chu kỳ phát triển phần mềm, từ đó giúp tiết kiệm thời gian và chi phí.
- Giúp các kỹ sư phần mềm hiểu cơ sở code và cho phép họ thực hiện các thay đổi nhanh chóng
- Kiểm thử đơn vị có thể được dùng như tài liệu dự án
- Kiểm thử đơn vị hỗ trợ việc sử dụng lại code Khi có dự án mới, các mã code và cách Kiểm thử đơn vị của dự án cũ có thể được tái sử dụng, chỉ cần điều chỉnh các mã code và cách test sao cho phù hợp. trong kế hoạch kiểm thử tích hợp vào tập hợp đó, và cung cấp đầu ra cho hệ thống tích hợp. Ưu điểm:
Mặc dù mỗi module đều được kiểm thử đơn vị (Unit test) nhưng các lỗi vẫn còn tồn tại với các nguyên nhân sau: o Một Module nói chung được thiết kế bởi một lập trình viên có hiểu biết và logic lập trình có thể khác với các lập trình viên khác Kiểm thử tích hợp là cần thiết để đảm bảo tính hợp nhất của phần mềm. o Tại thời điểm phát triển module vẫn có thể có thay đổi trong spec của khách hàng, những thay đổi này có thể không được kiểm tra ở giai đoạn unit test trước đó. o Giao diện và cơ sở dữ liệu của các module có thể chưa hoàn chỉnh khi được ghép lại. o Khi tích hợp hệ thống các module có thể không tương thích với cấu hình chung của hệ thống. o Thiếu các xử lý ngoại lệ có thể xảy ra.
Hai mô-đun khác nhau ‘Mô-đun A và’ Mô-đun B, được tích hợp sau đó thử nghiệm tích hợp được thực hiện.
Kiểm thử hệ thống là một phương pháp theo dõi và đánh giá hành vi của sản phẩm hoặc hệ thống phần mềm hoàn chỉnh và đã được tích hợp đầy đủ, dựa vào đặc tả và các yêu cầu chức năng đã được xác định trước Đó là giải pháp cho câu hỏi
"Liệu hệ thống hoàn chỉnh có hoạt động đúng với yêu cầu hay không?" Ưu điểm:
- Đảm bảo sản phẩm đáp ứng các tiêu chuẩn chất lượng.
- Xác minh hệ thống phần mềm đáp ứng các yêu cầu chức năng, kỹ thuật và kinh doanh theo yêu cầu của khách hàng.
- Thực hiện kiểm tra từ đầu đến cuối của sản phẩm phần mềm giúp ngăn ngừa lỗi hệ thống và sự cố trong quá trình thực hiện với môi trường thật.
- Được thực hiện trong một môi trường tương tự như môi trường production, cho phép các nhà phát triển cũng như các bên liên quan có được ý tưởng về phản ứng của người dùng đối với sản phẩm.
- Đóng một vai trò quan trọng trong việc cung cấp một sản phẩm chất lượng cho người dùng cuối.
Kiểm thử chấp nhận là một kiểm thử nhằm xác định hệ thống phần mềm có đạt yêu cầu kỹ thuật hay không Bằng việc kiểm tra các hành vi của hệ thống qua dữ liệu thực tế, kiểm thử chấp nhận sẽ xác định có hay không việc hệ thống đáp ứng được các tiêu chí lẫn yêu cầu của khách hàng Một số kỹ thuật được sử dụng trong Acceptance Testing đó là phân tích giá trị biên giới, phân vùng tương đương và sử dụng bảng quyết định. Điều kiện tiên quyết :
- Phải đảm bảo các yêu cầu nghiệp vụ chính của ứng dụng hoạt động
- Phần mềm đã được hoàn thiện nhất
- Các khâu kiểm thử Unit testing, integration testing, system testing đã được hoàn thành
- Không có lỗi quan trọng còn tồn tại trong hệ thống
- Lỗi về thẩm mỹ được chấp nhận trước UAT
- Regression testing phải được hoàn thành và không có lỗi lớn
- Tất cả các lỗi đã phát hiện phải được sửa và kiểm tra trước khi UAT
- Môi trường Acceptance Testing phải được chuẩn bị sẵn sàng
- Nhà phát triển phải chắc chắn rằng hệ thống đã sẵn sàng thực hiện AcceptanceTesting thử nào khi bắt đầu vào việc.
Kiểm thử dựa vào đồ thị nguyên nhân - kết quả (Cause Effect Graphing): là một kỹ thuật thiết kế kiểm thử phần mềm liên quan đến việc xác định các trường hợp (điều kiện đầu vào) và các hiệu ứng (điều kiện đầu ra) Vì các hệ thống hiện nay đều được phát triển trên nền tảng OOP, do đó, chúng ta có thể có được một đồ thị các đối tượng mà hệ thống định nghĩa và kết nối Từ đồ thị này, chúng ta dễ dàng biết các mối quan hệ của những đối tượng mà hệ thống xử lý, từ đó sẽ cho chúng ta các kịch bản kiểm thử phù hợp.
Phân vùng tương đương (Equivalence Class): là một kỹ thuật kiểm thử phần mềm có liên quan đến phân chia các giá trị đầu vào thành các phân vùng hợp lệ và không hợp lệ, sau đó chúng ta sẽ viết ra các kịch bản kiểm thử cho từng phần, chọn giá trị đại diện từ mỗi phân vùng làm dữ liệu thử nghiệm.
Phân vùng tương đương: là kỹ thuật thực hiện test theo từng class đồng giá trị (tập hợp điều kiện cùng một thao tác).
Tập hợp giá trị input có cùng một kết quả xử lý, tập hợp thời gian có cùng một kết quả xử lý, tập hợp kết quả export được xử lý cùng một giá trị nhập.
Mục đích: Giảm đáng kể số lượng test case cần phải thiết kế vì với mỗi lớp tương đương ta chỉ cần test trên các phần tử đại diện.
Chọn tối thiểu một giá trị đại diện từ các class đồng giá trị để tiến hành test. Phân tích giá trị biên (Boundary Value Analysis): là một kỹ thuật kiểm thử phần mềm có liên quan đến việc xác định biên (ranh giới) của điều kiện mô tả cho các giá trị đầu vào và chọn giá trị ở biên và bên cạnh giá trị biên làm dữ liệu kiểm thử Phương pháp phân tích giá trị biên sẽ đưa ra các giá trị đặc biệt, bao gồm loại dữ liệu, giá trị lỗi, bên trong, bên ngoài biên giá trị, lớn nhất và nhỏ nhất.
Sử dụng bảng quyết định (Decision Tables)
- Là dùng bảng để hiển thị danh sách các thao tác phần mềm được quyết định trên các điều kiện khác nhau.
- Decision table testing chú trọng vào nhiều điều kiện để thực hiện test.
Ngoài ra, kiểm thử hộp đen còn có một số kỹ thuật như: Domain Tests,Orthogonal Arrays, State Models, Exploratory Testing (kiểm thử chủ yếu dựa vào kinh nghiệm và khả năng focus vào việc test các chức năng của tester), All-pairs testing (kiểm thử tất cả các cặp),