Xây dựng ứng dụng mạng xã hội

GIỚI THIỆU VỀ ĐỀ TÀI

Trong thời đại công nghệ thông tin hiện nay, nhu cầu kết nối và chia sẻ khoảnh khắc cũng như ý kiến cá nhân với mọi người ngày càng trở nên quan trọng.

Nhóm đã quyết định xây dựng một trang web mạng xã hội trực tuyến, cho phép người dùng dễ dàng kết nối và chia sẻ kiến thức cũng như khoảnh khắc cá nhân thông qua giao diện thân thiện Ứng dụng này giúp người dùng xây dựng mối quan hệ với những người có chung sở thích và tính cách, đồng thời kết nối với bạn bè và người thân Đây là giải pháp hiệu quả cho hai nhu cầu chính của người dùng: kết nối và chia sẻ.

MỤC TIÊU CỦA ĐỀ TÀI

Người dùng có thể xây dựng một mạng xã hội để kết nối với nhau, nhắn tin, tạo phòng nhắn tin, đăng bài viết và tương tác với nội dung qua website và thiết bị di động.

Quản trị xây dựng là quá trình quản lý và theo dõi các tài nguyên, dữ liệu của hệ thống, bao gồm thống kê, quản lý tài khoản người dùng, quản lý nội dung bài viết, quản lý phòng nhắn tin và quản lý bình luận.

Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN

Mục tiêu của đề tài là phát triển một mạng xã hội giúp người dùng kết nối, nhắn tin và chia sẻ thông tin qua một trang web thân thiện và dễ sử dụng Nền tảng này tạo điều kiện cho mọi người xây dựng mối quan hệ với những người có chung sở thích, nghề nghiệp hoặc đơn giản là để bạn bè và gia đình kết nối với nhau.

CƠ SỞ LÝ THUYẾT

Redis

2 Chương 2: KHẢO SÁT HIỆN TRẠNG VÀ MÔ HÌNH HÓA YÊU CẦU

2.3.Mô hình hóa yêu cầu

3 Chương 3: THIẾT KẾ PHẦN MỀM

4 Chương 4: CÀI ĐẶT VÀ KIỂM THỬ

4.1.Công cụ dùng trong dự án

Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

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

- Tìm hiểu về JSON Web Token, Redis

- Tìm hiểu về MongoDB để áp dụng vào lưu trữ dữ liệu

- Tiến hành phát triển API dựa trên các kiến thức đã tìm hiểu được và các tài liệu

- Tiến hành xây dựng giao diện người dùng cho hệ thống

- Tìm hiểu Flutter và và xây dựng phiên bản di dộng

Kết hợp các phần đã xây dựng lại với nhau (giao diện, API, cơ sở dữ liệu)

Kiểm thử chương trình và tiến hành sửa lỗi

07/07/2022 Viết và hoàn thiện báo cáo Ý kiến của giảng viên hướng dẫn

(Ký và ghi rõ họ tên)

Người viết đề cương (Ký và ghi rõ họ tên)

Nhóm thực hiện đồ án xin chân thành cảm ơn thầy Nguyễn Trần Thi Văn, giảng viên hướng dẫn, vì đã tận tâm chỉ dẫn, hỗ trợ và giải đáp mọi thắc mắc của nhóm trong suốt quá trình thực hiện đồ án.

Em cũng xin chân thành cảm ơn các thầy cô giáo trong trường Đại học sư Phạm

Kỹ Thuật TP.HCM và các giảng viên khoa CNTT đã trang bị cho chúng em kiến thức vững chắc về các môn đại cương và chuyên ngành, tạo nền tảng lý thuyết vững vàng và hỗ trợ chúng em trong suốt quá trình học tập.

Với thời gian và kinh nghiệm hạn chế, đồ án này không thể tránh khỏi những thiếu sót Nhóm em rất mong nhận được sự góp ý chân thành từ thầy cô và các bạn Những ý kiến đóng góp về đề tài sẽ giúp nhóm em tích lũy thêm kinh nghiệm cho các nghiên cứu sau này Xin chân thành cảm ơn thầy Nguyễn Trần Thi Văn và các bạn đã hỗ trợ.

Cuối cùng, em xin gửi lời cảm ơn chân thành đến gia đình và bạn bè, những người đã luôn hỗ trợ, quan tâm và động viên chúng em trong suốt quá trình học tập và hoàn thành khóa luận.

1 GIỚI THIỆU VỀ ĐỀ TÀI 9

4 MỤC TIÊU CỦA ĐỀ TÀI 10

5 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 11

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 12

1.4.1 Giới thiệu về Flutter và Dart 16

1.5.4 Lý do sử dụng MongoDB 19

CHƯƠNG 2 KHẢO SÁT HIỆN TRẠNG 20

2.3 Mô hình hóa hệ thống 25

2.3.3 Mô tả sơ đồ Usecase 27

2.4 Đặc tả một số usecase chính 33

CHƯƠNG 3 THIẾT KẾ PHẦN MỀM 63

CHƯƠNG 4 CÀI ĐẶT VÀ KIỂM THỬ 107

4.4 Các bước chạy hệ thống 107

4 HƯỚNG PHÁT TRIỂN 118DANH MỤC THAM KHẢO 119

Hình 2 Khảo sát hiện trạng Facebook (1) 21

Hình 4 Khảo sát hiện trạng Twitter (1) 21

Hình 6 Khảo sát hiện trạng Zalo (1) 22

Hình 7 Khảo sát hiện trạng Linkedin (1) 23

Hình 8 Usecase tổng quát cho người dùng 26

Hình 9 Use case tổng quát cho Quản trị viên 27

Hình 10 Mô tả hệ thống 63

Hình 12 Lược đồ tuần tự chức năng Đăng ký 65

Hình 13 Lược đồ tuần tự chức năng Đăng nhập 65

Hình 14 Lược đồ tuần tự chức năng user xem danh sách bài viết 66

Hình 15 Lược đồ tuần tự chức năng User xem tin nhắn 66

Hình 16 Lược đồ tuần tự chức năng thêm bài viết 67

Hình 17 Lược đồ tuần tự chức năng tạo phòng nhắn tin 67

Hình 18 Lược đồ thực thể ERD 68

Hình 19 Màn hình đăng nhập 74

Hình 20 Màn hình đăng ký 75

Hình 23 Màn hình trang chủ 78

Hình 26 Trang nhắn tin chào mừng 80

Hình 27 Trang nhắn tin phòng chat 81

Hình 28 Trang nhắn tin thông tin 82

Hình 31 Trang chi tiết bài viết 86

Hình 32 Hộp thoại thêm bài viết 87

Hình 33 Trang chỉnh sửa thông tin cá nhân 88

Hình 35 Trang đăng ký các bước 1, 2, 3- Di dộng 90

Hình 36 Trang đăng nhập - Di dộng 91

Hình 37 Trang chủ - Di động 92

Hình 38 Trang tìm kiếm Bước 1 và Bước 2(Kết quả) - Di động 93

Hình 39 Trang chi tiết người dùng 94

Hình 40 Trang chi tiết bài viết - Di động 95

Hình 41 Trang tạo bài viết - Di động 96

Hình 42 Trang liên hệ - Di dộng 97

Hình 43 Trang nhắn tin - Di động 98

Hình 44 Trang phòng nhắn tin - Di động 99

Hình 45 Trang cá nhân - Di động 100

Hình 46 Trang chỉnh sửa hồ sơ - Di dộng 101

Hình 49 Trang quản lý người dùng 104

Hình 50 Trang quản lý bài viết 105

Hình 51 Trang quản lý phòng nhắn tin 105

Hình 52 Trang quản lý bình luận 106

Hình 53 Unit test cho các API chỉnh của xác thực 108

Hình 54 Unit test cho các API chính của người dùng 108

Hình 55 Unit test cho các API chính của bài viết 109

Hình 56 Unit test cho các API chính của bình luận 109

Hình 57 Kết quả Unit test cho các API chính của thông báo 109

Hình 58 Unit test cho các API chính của phòng nhắn tin 110

Hình 59 Unit test cho các API chính của admin cho xác thực 110

Hình 60 Unit test cho các API chính của admin cho thống kê 111

Hình 61 Unit test cho các API chính của admin về người dùng 111

Hình 62 Unit test cho các API chính của admin về bài viết 111

Hình 63 Unit test cho các API chính của admin về phòng nhắn tin 112

Bảng 1 Mô tả sơ đồ Use case 32

Bảng 2 Mô tả Use case Đăng nhập 33

Bảng 3 Mô tả Use case Đăng xuất 34

Bảng 4 Mô tả Use case Xem danh sách người dùng 35

Bảng 5 Mô tả Use case Xóa người dùng – Không hoàn toàn 37

Bảng 6 Mô tả Use case Xem danh sách bài đăng 38

Bảng 7 Mô tả Use case Xóa bài đăng – Không hoàn toàn 40

Bảng 8 Mô tả Use case Quản lý phòng chat 41

Bảng 9 Mô tả Use case Xóa phòng chat – Không hoàn toàn 42

Bảng 10 Mô tả Use case Quản lý bình luận 43

Bảng 11 Mô tả Use case Xóa bình luận – Không hoàn toàn 44

Bảng 12 Mô tả Use case User Đăng nhập 45

Bảng 13 Mô tả Use case User Đăng xuất 47

Bảng 14 Mô tả Use case User Đăng ký 48

Bảng 15 Mô tả Use case User quên mật khẩu 49

Bảng 16 Mô tả Use case Người dùng tạo phòng chat 50

Bảng 18 Mô tả Use case Gửi tin nhắn 53

Bảng 19 Mô tả Use case User Theo dõi người dùng 54

Bảng 20 Mô tả Use case User Tạo một bài viết 55

Bảng 21 Mô tả Use case User Xem bảng tin 56

Bảng 22 Mô tả Use case User Tìm kiếm 57

Bảng 23 Mô tả Use case User Thích bài viết 58

Bảng 24 Mô tả Use case User Bình luận bài viết 59

Bảng 25 Mô tả Use case User Xem thông tin bài viết cá nhân 61

Bảng 26 Mô tả Use case User Xóa bài viết cá nhân 62

Bảng 27 Mô tả chi tiết bảng User 69

Bảng 28 Mô tả chi tiết bảng Post 70

Bảng 29 Mô tả chi tiết bảng Comment 71

Bảng 30 Mô tả chi tiết bảng Room 71

Bảng 31 Mô tả chi tiết bảng Message 72

Bảng 32 Mô tả Use case User Danh sách giao diện 74

Bảng 33 Mô tả giao diện trang đăng nhập bước 1 74

Bảng 34 Mô tả giao diện trang đăng ký 75

Bảng 35 Mô tả giao diện thanh menu 76

Bảng 36 Mô tả giao diện trang card bài viết 78

Bảng 37 Mô tả giao diện trang chủ 78

Bảng 38 Mô tả giao diện trang thông báo 80

Bảng 39 Mô tả giao diện trang nhắn tin chào mừng 81

Bảng 40 Mô tả giao diện trang nhắn tin phòng chat 82

Bảng 41 Mô tả giao diện trang nhắn tin thông tin 83

Bảng 42 Mô tả giao diện trang danh bạ 84

Bảng 43 Mô tả giao diện trang cá nhân 86

Bảng 44 Mô tả giao diện trang chi tiết bài viết 87

Bảng 45 Mô tả giao diện hộp thoại đăng bài viết 88

Bảng 46 Mô tả giao diện trang chỉnh sửa thông tin cá nhân 89

Bảng 47 Mô tả giao diện trang tìm kiếm 89

Bảng 48 Mô tả giao diện trang đăng ký các bước- Di động 91

Bảng 49 Mô tả giao diện trang đăng nhập - Di động 91

Bảng 50 Mô tả giao diện trang chủ - Di động 93

Bảng 51 Mô tả giao diện trang tìm kiếm bước 2 - Di động 93

Bảng 53 Mô tả giao diện chi tiết người dùng - Di động 95

Bảng 54 Mô tả giao diện chi tiết bài viết - Di động 96

Bảng 56 Mô tả giao diện trang liên hệ - Di động 97

Bảng 57 Mô tả giao diện trang nhắn tin - Di động 98

Bảng 59 Mô tả giao diện trang cá nhân - Di động 100

Bảng 60 Mô tả giao diện trang cá nhân chi tiết- Di động 101

Bảng 61 Mô tả giao diện trang đăng nhập 102

Bảng 62 Mô tả giao diện trang thống kê 103

Bảng 63 Mô tả giao diện trang quản lý người dùng 104

Bảng 64 Mô tả giao diện trang quản lý bài viết 105

Bảng 65 Mô tả giao diện quản lý phòng nhắn tin 105

Bảng 66 Mô tả giao diện trang quản lý bình luận 106

Bảng 67 Testcase User - Chức năng đăng nhập tài khoản 112

Bảng 68 Testcase User - Chức năng đăng ký tài khoản 113

Bảng 69 Testcase User - Chức năng xem bài viết 113

Bảng 70 Testcase User - Chức năng thích bài viết 114

Bảng 71 Testcase User - Chức năng bình luận bài viết 114

Bảng 72 Testcase User - Chức năng thêm bài viết 114

Bảng 73 Testcase User - Chức năng tạo phòng nhắn tin 115

Bảng 74 Testcase User - Chức năng gửi tin nhắn 115

Bảng 75 Testcase User - Chức năng theo dõi 115

Bảng 76 Testcase User - Chức năng bỏ theo dõi 115

1 GIỚI THIỆU VỀ ĐỀ TÀI

Trong thời đại công nghệ thông tin hiện nay, nhu cầu kết nối và chia sẻ khoảnh khắc cũng như ý kiến giữa mọi người ngày càng trở nên quan trọng.

Nhóm đã quyết định phát triển một trang web mạng xã hội trực tuyến, cho phép người dùng dễ dàng kết nối và chia sẻ kiến thức, khoảnh khắc của mình thông qua giao diện thân thiện Ứng dụng này giúp xây dựng mối quan hệ với những người có sở thích và tính cách tương đồng, đồng thời là phương tiện kết nối với bạn bè và người thân Nó giải quyết hai vấn đề chính của người dùng: kết nối bạn bè và chia sẻ những khoảnh khắc, ý kiến cá nhân.

2 ĐỐI TƯỢNG NGHIÊN CỨU Đối với đề tài “Xây dựng mạng xã hội nhắn tin”, đối tượng nghiên cứu dựa trên những nhu cầu kết nối, tương tác với người khác với nhau, mọi người có thể nhắn tin với một người dùng hay tạo một nhóm để chia sẻ niềm vui

Đề tài này giúp người dùng chia sẻ thông tin và khoảnh khắc với bạn bè, cho phép họ thích và bình luận trên bài viết Đồng thời, nó cũng áp dụng các công nghệ tiên tiến để tạo ra sản phẩm.

- Áp dụng cơ sở dữ liệu MongoDB để lưu trữ dữ liệu từ người dùng

- Nghiên cứu APIs xây dựng nên hệ thống các APIs hỗ trợ lấy dữ liệu một cách chính xác và nhanh chóng bằng NodeJS và ExpressJS

Nghiên cứu và ứng dụng ReactJs, Flutter cùng với các thư viện hỗ trợ là yếu tố quan trọng trong việc xây dựng và tối ưu hóa giao diện người dùng cũng như hệ thống quản trị hiệu quả.

Để đảm bảo bảo mật hệ thống, chúng tôi sử dụng Json Web Token (JWT) để xác thực tài khoản đăng nhập cho cả khách hàng Ngoài ra, mã OTP được áp dụng để người dùng có thể khôi phục tài khoản thông qua email đã đăng ký.

3 PHẠM VI NGHIÊN CỨU Đề tài “Xây dựng mạng xã hội nhắn tin” chủ yếu tập trung khai thác vào vấn đề nhắn tin và chia sẻ các bài viết Website được chia thành 2 phần là phần Quản trị và phần Người dùng Trong phần Quản trị bao gồm các nghiệp vụ chính như:

- Quản lý người dùng (xem, xóa, phục hồi và xóa vĩnh viễn)

- Quản lý bài đăng (xem, xóa, phục hồi và xóa vĩnh viễn)

- Quản lý phòng chat (xem, xóa, phục hồi và xóa vĩnh viễn)

- Quản lý bình luận (xem, xóa, phục hồi và xóa vĩnh viễn)

Trong phần Người dùng bao gồm các nghiệp vụ chính như:

- Đăng nhập/ Đăng ký/ Quên mật khẩu

- Quản lý thông tin cá nhân / Thay đổi thông tin cá nhân

- Nhắn tin/ Thu hồi tin nhắn

- Tạo phòng chat/ Quản lý phòng chat

- Theo dõi người dùng/ Hủy theo dõi người dùng

- Đăng bài / Quản lý bài viết / Xem các bài viết

- Thích bài viết/ Hủy thích bài viết /Bình luận các bài viết

- Tìm kiếm người dùng và bài viết

Về phần cốt lõi xử lý, xây dựng đầy đủ các APIs phục vụ cho phần hiển thị cuối cùng

4 MỤC TIÊU CỦA ĐỀ TÀI

Người dùng có thể xây dựng một mạng xã hội để kết nối và nhắn tin với nhau, tạo các phòng nhắn tin, đăng bài viết và tương tác với nội dung thông qua website và thiết bị di động.

Quản trị xây dựng hệ thống bao gồm việc quản lý và theo dõi các tài nguyên và dữ liệu, như thống kê, quản lý tài khoản người dùng, quản lý bài viết, quản lý phòng nhắn tin và quản lý bình luận.

5 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN

Mục đích của đề tài là phát triển một mạng xã hội giúp người dùng kết nối, nhắn tin và chia sẻ thông tin qua một giao diện thân thiện và dễ sử dụng Nền tảng trực tuyến này cho phép mọi người xây dựng mối quan hệ với những người có chung sở thích, nghề nghiệp, hoặc đơn giản là để bạn bè và gia đình dễ dàng kết nối với nhau.

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 1.1.ReactJs

ReactJs là thư viện JavaScript mã nguồn mở do Facebook phát triển, ra mắt năm 2013, cho phép tạo giao diện người dùng (UI) từ các đoạn mã nhỏ gọi là “components” Thư viện này hiện đang rất phổ biến, giúp lập trình viên xây dựng UI một cách hiệu quả và linh hoạt.

KHẢO SÁT HIỆN TRẠNG

Xác định yêu cầu

Chúng tôi xin chân thành cảm ơn thầy Nguyễn Trần Thi Văn, giảng viên hướng dẫn, vì đã tận tâm chỉ bảo, hỗ trợ và giải đáp mọi thắc mắc của nhóm trong suốt quá trình thực hiện đồ án.

Khoa CNTT tại Kỹ Thuật TP.HCM đã cung cấp cho chúng em kiến thức vững chắc về các môn đại cương và chuyên ngành, tạo nền tảng lý thuyết vững vàng và hỗ trợ chúng em trong suốt quá trình học tập.

Với thời gian và kinh nghiệm hạn chế, nhóm em nhận thấy đồ án này không thể tránh khỏi những thiếu sót Chúng em rất mong nhận được sự góp ý chân thành từ thầy cô và các bạn Những ý kiến đóng góp về đề tài sẽ giúp nhóm em tích lũy thêm kinh nghiệm cho các nghiên cứu sau này Xin chân thành cảm ơn thầy Nguyễn Trần Thi Văn và các bạn đã hỗ trợ nhóm.

Cuối cùng, tôi xin gửi lời cảm ơn chân thành đến gia đình và bạn bè, những người đã luôn ủng hộ, quan tâm và giúp đỡ chúng tôi trong suốt quá trình học tập và hoàn thành khóa luận.

Trong thời đại công nghệ thông tin hiện nay, nhu cầu kết nối và chia sẻ khoảnh khắc, ý kiến giữa mọi người ngày càng trở nên quan trọng.

Nhóm đã quyết định phát triển một trang web mạng xã hội trực tuyến, cho phép người dùng dễ dàng kết nối và chia sẻ kiến thức, khoảnh khắc của mình thông qua giao diện thân thiện Ứng dụng này giúp người dùng xây dựng mối quan hệ với những người có sở thích và tính cách tương đồng, đồng thời kết nối với bạn bè và người thân Đây là giải pháp hiệu quả cho nhu cầu kết nối và chia sẻ của người dùng.

Đề tài này giúp người dùng chia sẻ thông tin và khoảnh khắc với bạn bè, cho phép họ thích và bình luận trên bài viết Bên cạnh đó, nó cũng áp dụng các công nghệ hiện đại để tạo ra sản phẩm chất lượng.

Nghiên cứu và áp dụng ReactJs, Flutter cùng với các thư viện bổ trợ là cách hiệu quả để xây dựng và xử lý giao diện người dùng cũng như hệ thống quản trị.

Để đảm bảo bảo mật hệ thống, chúng tôi sử dụng Json Web Token (JWT) cho việc xác thực tài khoản đăng nhập của khách hàng, đồng thời áp dụng mã OTP để người dùng có thể khôi phục tài khoản thông qua email đã đăng ký.

Người dùng có thể xây dựng một mạng xã hội kết nối mọi người, cho phép nhắn tin, tạo phòng nhắn tin, đăng bài viết và tương tác với các bài viết thông qua website và thiết bị di động.

Quản trị xây dựng là quá trình quản lý và theo dõi các tài nguyên và dữ liệu của hệ thống, bao gồm thống kê, quản lý tài khoản, bài viết, phòng nhắn tin và bình luận.

Mục đích của đề tài là phát triển một mạng xã hội giúp người dùng kết nối, nhắn tin và chia sẻ thông tin qua một trang web dễ sử dụng Nền tảng này tạo cơ hội cho mọi người xây dựng mối quan hệ với những người có cùng sở thích, nghề nghiệp, hoặc đơn giản là để bạn bè và gia đình gắn kết với nhau.

ReactJs là thư viện JavaScript mã nguồn mở do Facebook phát triển, ra mắt năm 2013, cho phép xây dựng giao diện người dùng (UI) từ các đoạn mã nhỏ gọi là “components” Thư viện này hiện đang rất phổ biến, giúp lập trình viên xây dựng UI một cách hiệu quả và linh hoạt.

Mô hình hóa hệ thống

- User: người đã đăng nhập vào hệ thống, có các quyền của Guest

- Admin: người quản trị, có quyền quản trị hệ thống

Hình 8 Usecase tổng quát cho người dùng

Hình 9 Use case tổng quát cho Quản trị viên

2.3.3 Mô tả sơ đồ Usecase

Use Case Id Tên chức năng Mô tả

Chức năng đăng nhập cho vai trò Admin (UC-A-1.1) cho phép người quản trị truy cập vào hệ thống quản trị, trong khi chức năng đăng xuất (UC-A-1.2) cho phép Admin kết thúc phiên làm việc của mình trong hệ thống.

UC-A-1.3.1 Quản lý người dùng-

Xem danh sách người dùng

Chức năng Người quản trị xem danh sách của người dùng

Xem thông tin chi tiết người dùng

Chức năng Người quản trị Xem thông tin chi tiết của người dùng

UC-A-1.3.3 Quản lý người dùng- Xóa người dùng chưa hoàn toàn

Chức năng của người quản trị cho phép xóa người dùng, nhưng không xóa hoàn toàn ngay lập tức Sau một tháng, người dùng sẽ bị xóa hoàn toàn cùng với tất cả các tài nguyên liên quan.

UC-A-1.3.4 Quản lý người dùng- Xóa người dùng hoàn toàn

Chức năng Người quản trị xóa người dùng hoàn toàn khỏi hệ thống Khi này các tài nguyên tương ứng của người dùng sẽ trực tiếp bị xóa theo

Chức năng Người quản trị khôi phục người dùng đã xóa không hoàn toàn

UC-A-1.4.1 Quản lý các bài đăng-

Xem danh sách các bài đăng

Chức năng Người quản trị Xem danh sách các bài đăng đang có trên hệ thống

Xem thông tin chi tiết bài đăng

Chức năng Người quản trị Xem thông tin chi tiết của bài đăng đang có trên hệ thống

Chức năng Người quản trị Xóa bài viết trên hệ thống nhưng chưa xóa hoàn toàn

Xóa bài đăng một cách hoàn toàn

Chức năng Người quản trị Xóa bài viết hoàn toàn trên hệ thống

Khôi phục bài đăng đã xóa chưa hoàn toàn

Chức năng Người quản trị khôi phục bài đăng đã xóa không hoàn toàn

UC-A-1.5.1 Quản lý phòng chat -

Xem danh sách các phòng chat

Chức năng Người quản trị Xem danh sách các phòng chat đang có trên hệ thống

UC-A-1.5.2 Quản lý phòng chat -

Xem thông tin chi tiết phòng chat

Chức năng Người quản trị Xem thông tin chi tiết phòng chat đang có trên hệ thống

UC-A-1.5.3 Quản lý phòng chat –

Xóa phòng chat nhưng chưa hoàn toàn

Chức năng Người quản trị Xóa phòng chat nhưng chưa hoàn toàn

Xóa phòng chat hoàn toàn

Chức năng Người quản trị Xóa phòng chat hoàn toàn

Khôi phục phòng chat đã xóa chưa hoàn toàn

Chức năng Người quản trị khôi phục phòng chat đã xóa không hoàn toàn

UC-A-1.6.1 Quản lý bình luận - Xem danh sách các bình luận

Chức năng Người quản trị xem danh sách các bình luận

UC-A-1.6.2 Quản lý bình luận – Xóa bình luận chưa hoàn toàn

Chức năng Người quản trị xóa bình luận chưa hoàn toàn

UC-A-1.6.3 Quản lý bình luận – Xóa bình luận hoàn toàn

Chức năng Người quản trị xóa bình luận hoàn toàn

UC-A-1.6.4 Quản lý bình luận – Khôi phục bình luận

Chức năng Người quản trị khôi phục bình luận chưa xóa hoàn toàn

UC-A-1.7.1 Xem các thông tin thống kê

Chức năng Người quản trị xem các thông tin thống kê ở hệ thống

UC-U-1.1 Đăng nhập role user Chức năng người dùng đăng nhập để sử dụng ứng dụng

UC-U-1.2 Đăng xuất role user Chức năng người dùng đăng xuất sau khi đã đăng nhập vào ứng dụng

UC-U-2 Đăng ký role user Chức năng người dùng đăng ký tài khoản để sử dụng ứng dụng

UC-U-3 Quên mật khẩu Chức năng người dùng thay đổi mật khẩu khi quên

UC-U-4.1 Quản lý thông tin cá nhân

Chức năng người xem thông tin cá nhân của mình

– Sửa thông tin cá nhân – Đổi ảnh bìa

Chức năng người dùng thay đổi ảnh bìa

– Sửa thông tin cá nhân – Đổi ảnh ảnh đại diện

Chức năng người dùng thay đổi ảnh đại diện

– Sửa thông tin cá nhân – Đổi username

Chức năng người dùng thay đổi ảnh username

– Sửa thông tin cá nhân – Đổi các thông tin khác

Chức năng người dùng thay đổi các thông tin khác như tên, ngày sinh, địa chỉ, mô tả bản thân

UC-U-5 Theo dõi người dùng Chức năng người dùng theo dõi người dùng khác

UC-U-6 Hủy theo dõi người dùng Chức năng người dùng hủy theo dõi người dùng khác UC-U-7 Tạo bài viết Chức năng người dùng tạo bài viết

UC-U-8 Chia sẻ bài viết Chức năng người dùng có thể chia sẻ bài viết của người khác

UC-U-9.1 Xem bảng tin Chức năng người dùng xem các tin tức thông qua các người dùng đã theo dõi

UC-U-9.2 Xem xem tin nổi bật Chức năng người xem các bài đăng có lượt thích nhiều nhất

UC-U-10 Xem chi tiết bài viết Chức năng người xem chi tiết bài viết

UC-U-11 Tìm kiếm Chức năng người dùng tìm kiếm bài viết hoặc người dùng khác

UC-U-12.1 Tương tác bài viết -

Chức năng người dùng thêm thích bài viết

UC-U-12.2 Tương tác bài viết - Hủy thích bài viết

Chức năng người dùng hủy thích bài viết

UC-U-12.3 Tương tác bài viết - Bình luận bài viết

Chức năng người dùng bình luận bài viết

UC-U-12.4 Tương tác bài viết - Trả lời bình luận bài viết

Chức năng người dùng trả lời bình luận

UC-U-12.5 Tương tác bài viết -

Thích bình luận bài viết

Chức năng người dùng thích một bài viết

UC-U-12.6 Tương tác bài viết - Hủy thích bình luận bài viết

Chức năng người dùng hủy thích một bài viết

UC-U-13.1 Quản lý bài viết các nhân

– Xem các bài viết đã đăng

Chức năng người dùng xem các bài viết đã đăng của mình

– Xem các bài viết đã thích

Chức năng người dùng xem các bài viết đã thích của mình

– Xóa bài viết của mình

Chức năng người dùng xóa bài viết của mình

Chức năng người dùng sửa bài viết của mình

UC-U-14 Gửi tin nhắn Chức năng người dùng gửi tin nhắn trong phòng chat

UC-U-15 Trả lời tin nhắn Chức năng người dùng gửi tin nhắn trong phòng chat

UC-U-16 Thu hồi tin nhắn Chức năng người dùng thu hồi tin nhắn đã gửi

UC-U-17 Tạo phòng chat Chức năng người dùng tạo một phòng chat mới

UC-U-18 Thêm thành viên vào phòng chat

Chức năng người dùng thêm thành viên mới vào phòng chat

UC-U-19 Xóa bớt thành viên khỏi phòng chat

Chức năng người dùng xóa bớt thành viên ra khỏi phòng chat

UC-U-20 Xem các phòng chat của bản thân

Chức năng người dùng xem các phòng chat mình mình tham gia

UC-U-21 Xóa phòng chat Chức năng người dùng xóa các phòng chat mà mình có quyền quản trị

Bảng 1 Mô tả sơ đồ Use case

Đặc tả một số usecase chính

Use Case Name Đăng nhập

Description Là người quản trị thì phải đăng nhập vào ứng dụng để sử dụng các tính năng của ứng dụng

Trigger Quản trị viên có nhu cầu đăng nhập và sử dụng ứng dụng

Pre-Condition(s) Tài khoản người dùng đã được tạo sẵn

Thiết bị sử dụng ứng dụng phải được kết nối với Internet Post-Condition(s) Quản trị viên đăng nhập thành công

Basic Flow 1 Quản trị viên truy cập vào trang web

2 Quản trị viên chọn đăng nhập

3 Quản trị viên nhập username và password

4 Hệ thống xác thực thông tin đăng nhập thành công và cho phép Quản trị viên truy cập vào ứng dụng

Hệ thống xác thực thông tin đăng nhập sẽ xử lý trường hợp không thành công bằng cách hiển thị thông báo lỗi Người dùng cần nhập lại tên người dùng và mật khẩu để thực hiện thao tác đăng nhập lần nữa.

Mật khẩu phải được hash bằng MD5

Bảng 2 Mô tả Use case Đăng nhập

Use Case name Đăng xuất

Description Quản trị viên đã đăng nhập vào hệ thống, muốn đăng xuất ra khỏi hệ thống và không dùng các dịch vụ của hệ thống

Trigger Là người dùng đã đăng nhập vào hệ thống muốn đăng xuất ra khỏi hệ thống

Pre-Condition(s): Đã đăng nhập vào hệ thống với quyền là một admin

Thiết bị có kết nối Internet để thực hiện chức năng đăng xuất

Post-Condition(s): Người dùng đăng xuất khỏi hệ thống thành công

Hệ thống xóa phiên đăng nhập (các token) của người dùng

Basic Flow 1 Người dùng nhấn vào button Sign Out bên Side bar

2 Hệ thống thực hiện đăng xuất người dùng khỏi hệ thống, màn hình chuyển về màn hình Đăng nhập Hệ thống xóa phiên đăng nhập của người dùng

Bảng 3 Mô tả Use case Đăng xuất

2.4.1.3.1 Xem danh sách người dùng

Use Case name Xem danh sách người dùng

Description Là người quản trị, tôi muốn xem danh sách các user đang có trên hệ thống

Trigger Quản trị viên muốn xem danh sách bài đăng

Để thực hiện việc lấy và hiển thị danh sách danh mục bài đăng, quản trị viên cần đăng nhập vào hệ thống với quyền Admin trên trang dành cho admin Ngoài ra, thiết bị phải có kết nối Internet để đảm bảo quá trình này diễn ra suôn sẻ.

Post-Condition(s): Hệ thống lấy thành công danh sách người dùng và hiển thị ra màn hình dưới dạng list và có phân trang

Basic Flow 1 Tại màn hình Home, Người quản lý chọn vào button chức năng

Quản lý người dùng tại Side bar

2 Hệ thống chuyển sang màn hình Quản lý người dùng

3 Hệ thống hiển thị ra màn hình danh sách người dùng dạng danh sách

Bảng 4 Mô tả Use case Xem danh sách người dùng

2.4.1.3.2 Xóa người dùng – Không hoàn toàn

Use Case name Xóa người dùng – Không hoàn toàn

Description Là quản trị viên, tôi muốn xem thông tin chi tiết của người dùng

Trigger Là quản trị viên, tôi muốn xóa người dùng khỏi hệ thống nhưng có thể khôi phục lại

Pre-Condition(s): Quản trị viên phải đăng nhập vào hệ thống với quyền user là Admin-

Thiết bị có kết nối Internet để thực hiện việc thêm danh mục người dùng

Post-Condition(s): Hệ thống hiển thị thông tin chi tiết của người dùng

Basic Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng Quản lý người dùng

3 Tại màn hình Quản lý người dùng, chọn nút delete tại người dùng muốn xóa

4 Hệ thống thông báo xóa thành công

Alternative Flow 1 Tại màn hình Home, Quản trị viên chọn vào nút chức năng Quản lý người dùng

3 Tại màn hình Quản lý người dùng, chọn nút view tại người dùng muốn xem thông tin chi tiết

4 Hệ thống hiển thị thông tin chi tiết của người dùng

6 Hệ thống thông báo đã xóa người dùng thành công

Bảng 5 Mô tả Use case Xóa người dùng – Không hoàn toàn

2.4.1.4.1 Xem danh sách bài đăng

Use Case name Xem danh sách bài đăng

Description Là người quản trị, tôi muốn xem danh sách các bài đăng đang có trên hệ thống

Trigger Quản trị viên muốn xem danh sách bài đăng

Để thực hiện việc lấy và hiển thị danh sách bài đăng, quản trị viên cần đăng nhập vào hệ thống với quyền Admin tại trang dành cho admin Ngoài ra, thiết bị phải có kết nối Internet.

Basic Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng

3 Hệ thống hiển thị ra màn hình danh sách bài đăng dạng danh sách

Bảng 6 Mô tả Use case Xem danh sách bài đăng

2.4.1.4.2 Xóa bài đăng – Không hoàn toàn

Use Case name Xóa bài đăng – Không hoàn toàn

Description Quản trị viên muốn xóa một bài đăng nhưng không hoàn toàn

Trigger Là quản trị viên, tôi muốn xóa bài đăng nhưng có thể khôi phục lại

Pre-Condition(s): Quản trị viên phải đăng nhập vào hệ thống với quyền user là

Thiết bị có kết nối Internet để thực hiện việc xóa bài đăng

Post-Condition(s): Hệ thống hiển thị thông tin chi tiết của bài đăng

2 Hệ thống chuyển sang màn hình Quản lý bài đăng

3 Tại màn hình Quản lý bài đăng, chọn nút delete tại bài đăng muốn xóa

Alternative Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng

2 Hệ thống chuyển sang màn hình Quản lý danh bài đăng

3 Tại màn hình Quản lý danh bài đăng, chọn nút view tại bài đăng muốn xem thông tin chi tiết

4 Hệ thống hiển thị thông tin chi tiết của bài đăng

6 Hệ thống thông báo đã xóa người dùng thành công

Bảng 7 Mô tả Use case Xóa bài đăng – Không hoàn toàn

2.4.1.5.1 Xem danh sách phòng chat

Use Case name Xem danh sách phòng chat

Description Là người quản trị, tôi muốn xem danh sách các phòng chat đang có trên hệ thống

Trigger Quản trị viên muốn xem danh sách phòng chat

Pre-Condition(s): Quản trị viên phải đăng nhập vào hệ thống với quyền Admin tại trang dành cho admin

2 Hệ thống chuyển sang màn hình Quản lý phòng chat

3 Hệ thống hiển thị ra màn hình danh sách phòng chat dạng danh sách

Bảng 8 Mô tả Use case Quản lý phòng chat

2.4.1.5.2 Xóa phòng chat – Không hoàn toàn

Use Case name Xóa phòng chat– Không hoàn toàn

Description Quản trị viên muốn xóa một phòng chat nhưng không hoàn toàn

Trigger Là quản trị viên, tôi muốn xóa phòng chat nhưng có thể khôi phục lại

Thiết bị có kết nối Internet

Basic Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng Quản lý phòng chat

3 Tại màn hình Quản lý phòng chat, chọn nút delete tại phòng chat muốn xóa

Alternative Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng Quản lý phòng chat

3 Tại màn hình Quản lý phòng chat, chọn nút view tại phòng chat muốn xem thông tin chi tiết

4 Hệ thống hiển thị thông tin chi tiết của phòng chat

6 Hệ thống thông báo đã xóa phòng chat thành công Exception Flow

Bảng 9 Mô tả Use case Xóa phòng chat – Không hoàn toàn

2.4.1.6.1 Xem danh sách bình luận

Use Case name Xem danh sách bình luận

Description Là người quản trị, tôi muốn xem danh sách các bình luận đang có trên hệ thống

Trigger Quản trị viên muốn xem danh sách bình luận

Pre-Condition(s): Quản trị viên phải đăng nhập vào hệ thống với quyền Admin tại trang dành cho admin

Basic Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng Quản lý người dùng tại Side bar

2 Hệ thống chuyển sang màn hình Quản lý bình luận

3 Hệ thống hiển thị ra màn hình danh sách bình luận dạng danh sách Alternative Flow

Bảng 10 Mô tả Use case Quản lý bình luận

2.4.1.6.2 Xóa bình luận – Không hoàn toàn

Use Case name Xóa bình luận– Không hoàn toàn

Description Quản trị viên muốn xóa một bình luận nhưng không hoàn toàn

Trigger Là quản trị viên, tôi muốn xóa bình luận nhưng có thể khôi phục lại

Thiết bị có kết nối Internet

Basic Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng Quản lý bình luận

3 Tại màn hình Quản lý bình luận, chọn nút delete tại bình luận muốn xóa

Alternative Flow 1 Tại màn hình Home, Quản trị viên chọn vào button chức năng Quản lý bình luận

3 Tại màn hình Quản lý bình luận, chọn nút view tại bình luận muốn xem thông tin chi tiết

4 Hệ thống hiển thị thông tin chi tiết của bình luận

6 Hệ thống thông báo đã xóa bình luận thành công Exception Flow

Bảng 11 Mô tả Use case Xóa bình luận – Không hoàn toàn

Use Case Name Đăng nhập

Description Là người dùng thì phải đăng nhập vào ứng dụng để sử dụng các tính năng của ứng dụng

Trigger Người dùng có nhu cầu đăng nhập và sử dụng ứng dụng

Pre-Condition(s) Tài khoản người dùng đã được tạo sẵn

Thiết bị sử dụng ứng dụng phải được kết nối với Internet

Post-Condition(s) Người dùng đăng nhập ứng dụng thành công

Basic Flow 1 Người dùng truy cập vào ứng dụng

2 Người dùng chọn đăng nhập

3 Người dùng nhập username(email hoặc phone) và password

4 Hệ thống xác thực thông tin đăng nhập thành công và cho phép người dùng truy cập vào ứng dụng

5 Hệ thống ghi nhận lại hoạt động đăng nhập thành công

Exception Flow Hệ thống xác thực thông tin đăng nhập không thành công và hiển thị thông báo Người dùng nhập lại username và password và đăng nhập lại

Bảng 12 Mô tả Use case User Đăng nhập

Use Case Name Đăng xuất

Description Người dùng đăng xuất khỏi tài khoản khỏi trình duyệt

Trigger Người dùng có nhu cầu đăng xuất sau khi không còn nhu cầu sử dụng nữa

Pre-Condition(s) Người dùng đã đăng nhập

Post-Condition(s) Người dùng đăng nhập ứng dụng thành công

Basic Flow 1 Người dùng truy cập vào trang web sau khi đã đăng nhập

2 Người dùng bấm vào tab Cài đặt

3 Hệ thống hiển thị thông tin cài đặt

4 Người dùng lăn xuống dưới cùng thanh tab, bấm dấu 3 chấm và bấm đăng xuất

5 Hệ thống xóa token của người dùng và chuyển người dùng về trang chào mừng

Bảng 13 Mô tả Use case User Đăng xuất

Use Case Name Đăng ký tài khoản

Description Là người dùng, để đăng nhập vào hệ thống thì phải đăng ký tài khoản sử dụng

Trigger Người dùng có nhu cầu đăng ký tài khoản và sử dụng ứng dụng

Pre-Condition Tài khoản người dùng chưa được tạo sẵn

Post-Condition Người dùng đăng ký tài khoản ứng dụng thành công

Hệ thống ghi nhận lại hoạt động đăng nhập thành công

Basic Flow 1 Người dùng truy cập vào ứng dụng

2 Người dùng chọn đăng ký tài khoản

3 Người dùng nhập đầy đủ các thông sau

- Email hoặc số điện thoại

4 Hệ thống xác thực thông tin đăng ký thành công và tạo tài khoản mới cho người dùng

Exception Flow Hệ thống xác thực thông tin đăng ký không thành công

Người dùng nhập lại password và xác nhận password không chính xác

Bảng 14 Mô tả Use case User Đăng ký

Use Case Name Quên mật khẩu

Description Người dùng quên mật khẩu, muốn đặt lại mật khẩu

Trigger Người dùng quên mật khẩu, muốn đặt lại mật khẩu

Pre-Condition Người dùng chọn chức năng quên mật khẩu, nhập vào email hoặc số điện thoại của mình

Post-Condition Hệ thống gửi mã OTP đến email hoặc số điện thoại người dùng đã đăng ký

Basic Flow 1 Chọn quên mật khẩu và nhập email hoặc số điện thoại

2 Hệ thống gửi mã OTP

3 Người dùng nhập mã OTP

4 Hệ thống xác minh mã OTP

5 Mã OTP hợp lệ và người dùng nhập mật khẩu mới

6 Hệ thống thông báo đổi mật khẩu thành công và chuyển hướng về trang đăng nhập

Exception Flow Email hoặc số điện thoại không có trong hệ thống: Hệ thống thông báo tài khoản không tồn tại

Mã OTP không hợp lệ: Hệ thống thông báo mã OTP không hợp lệ

Mã OTP gồm 6 số và hết hạn sau 15 phút

Bảng 15 Mô tả Use case User quên mật khẩu

2.4.2.5 Xem danh sách các phòng chat mình tham gia

Use Case Name Xem danh sách các phòng chat mình tham gia

Description Người dùng muốn xem danh sách các phòng chat mình tham gia

Trigger Người dùng có nhu cầu muốn xem danh sách các phòng chat mình tham gia tạo phòng chat

Pre-Condition Người dùng đăng nhập ứng dụng thành công

Post-Condition Hệ thống hiển thị các phong chat mà người dùng tham gia

Basic Flow 1 Truy cập vào tab Chat

2 Hệ thống hiển thị danh sách các phòng chat người dùng tham gia

Business Rules Phòng chat khi tạo cần có ít nhất 3 người, gồm người dùng hiện tại và 2 người dùng khác

Bảng 16 Mô tả Use case Người dùng tạo phòng chat

Use Case Name Tạo phòng chat

Description Người dùng muốn tạo phòng chat

Trigger Người dùng có nhu cầu tạo phòng chat

Thiết bị sử dụng ứng dụng phải được kết nối với Internet Người dùng có một số bạn bè

Post-Condition Người dùng tạo được phòng chat theo những người dùng đã chọn

2 Hệ thống hiển thị danh sách các phòng chat người dùng tham gia

3 Người dùng chọn tạo phòng chat

4 Hệ thống hiển thị danh sách bạn bè

5 Người dùng chọn các bạn bè cần thêm vào phòng chat

6 Hệ thống hiển thị thông báo tạo phòng chat thành công và chuyển hướng tới phòng chat mới

Business Rules Phòng chat khi tạo cần có ít nhất 3 người, gồm người dùng hiện tại và 2 người dùng khác

Bảng 17 Mô tả Use case Người dùng tạo phòng chat

Use Case Name Gửi tin nhắn

Description Người dùng muốn gửi tin nhắn

Trigger Người dùng có nhu cầu gửi tin nhắn

Post-Condition Người dùng xem được danh mục muốn xem

2 Hệ thống hiển thị danh sách phòng chat

3 Người dùng chọn một phòng chat

4 Người dùng nhập tin nhắn và có thể gửi kèm File

6 Hệ thống thông báo đã gửi Alternative Flow

Một tin nhắn có độ dài tối đa là 1000 ký tự Một tin nhắn có thể gửi kèm tối đa 5 file

Bảng 18 Mô tả Use case Gửi tin nhắn

Use Case Name Theo dõi người dùng

Description Người dùng muốn theo dõi một người dùng khác

Trigger Người dùng có nhu cầu theo dõi người dùng khác

Post-Condition Người dùng theo dõi người dùng khác thành công

Basic Flow 1 Ở trang chủ phía bên tay phải có một số người dùng đề xuất để theo dõi

2 Người dùng chọn theo dõi vào user muốn theo dõi

3 Hệ thống hiển thị theo dõi thành công

Bảng 19 Mô tả Use case User Theo dõi người dùng

Use Case Name Tạo một bài viết

Description Người dùng muốn tạo một bài viết

Trigger Người dùng có tạo bài viết

Post-Condition Người dùng tạo được bài viết mới

Basic Flow 1 Truy cập vào tab Trang chủ

2 Tại đây có một chỗ để tạo bài viết

3 Người dùng nhập nội dung và nhấn Gửi

4 Hệ thống thông báo bài viết đã được tạo

Bảng 20 Mô tả Use case User Tạo một bài viết

Use Case Name Xem bảng tin

Description Người dùng muốn xem bảng tin gồm các bài viết của các tài khoản mà mình đã theo dõi

Trigger Người dùng xem bảng tin

Post-Condition Người dùng xem được chi tiết bảng tin

2 Hệ thống hiển thị danh sách các tin từ các tài khoản mà mình đã theo dõi

Bảng 21 Mô tả Use case User Xem bảng tin

Use Case Name Tìm kiếm

Description Người dùng muốn tìm kiếm bài viết, hoặc người dùng

Trigger Người dùng có nhu cầu tìm kiếm các bài viết và người dùng khác

Post-Condition Người dùng xem được các bài viết và người dùng cần tìm

Basic Flow 1 Người dùng nhấn vào thanh tìm kiếm và nhập thông tin, sau đó nhấn đi

2 Hệ thống trả ra danh sách người dùng bài viết ở các tab khác nhau

Bảng 22 Mô tả Use case User Tìm kiếm

2.4.2.12 Tương tác với bài viết

2.4.3.22.1 Tương tác với bài viết - Thích bài viết

Use Case Name Tương tác với bài viết - Thích bài viết

Description Người dùng muốn thích muốn bài viết

Trigger Người dùng có nhu cầu thích bài viết

Post-Condition Người dùng xem được thông tin trong giỏ hàng

2 Hệ thống hiển thị các bài viết

3 Người dùng bấm vào biểu tượng trái tim trên bài viết với những bài viết chưa thích

4 Hệ thống ghi nhận người dùng đã thích bài viết

Bảng 23 Mô tả Use case User Thích bài viết

2.4.3.22.2 Tương tác với bài viết - Bình luận bài viết

Use Case Name Hủy thích bài viết

Description Người dùng muốn bình luận bài viết

Trigger Người dùng có nhu cầu bình luận bài viết

Post-Condition Người dùng truy cập ứng dụng web hay di động

2 Hệ thống hiển thị các bài viết

3 Người dùng bấm một bài viết

4 Hệ thống hiển thị chi tiết bài viết

5 Người dùng nhập bình luận và nhấn gửi

6 Hệ thống ghi nhận bình luận

Bảng 24 Mô tả Use case User Bình luận bài viết

2.4.3.24.1 Xem thông tin các bài viết cá nhân

Use Case Name Xem các bài viết cá nhân

Description Người dùng muốn xem các bài viết cá nhân

Trigger Người dùng có nhu cầu xem các bài viết cá nhân của mình

Post-Condition Người dùng xem được thông tin cá nhân

Basic Flow 1 Truy cập vào tab Cá nhân

2 Hệ thống hiển thị thông tin của người dùng, và các bài viết đã đăng

Bảng 25 Mô tả Use case User Xem thông tin bài viết cá nhân

Use Case Name Xóa các bài viết cá nhân

Description Người dùng muốn xóa các bài viết cá nhân

Trigger Người dùng có nhu cầu xóa các bài viết cá nhân của mình

Post-Condition Người dùng xem được thông tin cá nhân

Basic Flow 1 Truy cập vào tab Cá nhân

2 Hệ thống hiển thị thông tin của người dùng, và các bài viết đã đăng

3 Bấm vào dấu ba chấm của mỗi bài viết và nhấn xóa bài viết

4 Hệ thống ghi nhận bài viết đã bị xóa

Bảng 26 Mô tả Use case User Xóa bài viết cá nhân

THIẾT KẾ PHẦN MỀM

Thiết kế giao diện

Chúng tôi xin chân thành cảm ơn thầy Nguyễn Trần Thi Văn, giảng viên hướng dẫn, đã tận tâm chỉ bảo, hỗ trợ và giải đáp mọi thắc mắc của nhóm trong suốt quá trình thực hiện đồ án.

Khoa CNTT tại Kỹ Thuật TP.HCM đã trang bị cho chúng em kiến thức vững chắc về các môn đại cương và chuyên ngành, tạo nền tảng lý thuyết vững vàng và hỗ trợ chúng em trong suốt quá trình học tập.

Với thời gian và kinh nghiệm hạn chế, đồ án của nhóm em không tránh khỏi những thiếu sót Chúng em rất mong nhận được sự góp ý chân thành từ thầy cô và các bạn Những ý kiến đóng góp về đề tài sẽ giúp nhóm em tích lũy thêm kinh nghiệm cho các nghiên cứu sau này Xin chân thành cảm ơn thầy Nguyễn Trần Thi Văn và các bạn đã hỗ trợ nhóm.

Trong thời đại công nghệ thông tin hiện nay, nhu cầu kết nối và chia sẻ khoảnh khắc cũng như ý kiến cá nhân trở nên ngày càng quan trọng đối với mọi người.

Nhóm đã quyết định phát triển một trang web mạng xã hội trực tuyến, cho phép người dùng dễ dàng kết nối và chia sẻ kiến thức cũng như khoảnh khắc cá nhân thông qua giao diện thân thiện Ứng dụng này giúp xây dựng mối quan hệ với những người có chung sở thích và kết nối với bạn bè, đồng thời giải quyết hai vấn đề chính của người dùng: kết nối và chia sẻ.

Đề tài này giúp người dùng chia sẻ thông tin và khoảnh khắc cá nhân với bạn bè, cho phép mọi người thích và bình luận trên bài viết Bên cạnh đó, nó còn ứng dụng các công nghệ tiên tiến để tạo ra sản phẩm chất lượng.

Nghiên cứu và ứng dụng ReactJs, Flutter cùng với các thư viện hỗ trợ là rất quan trọng trong việc xây dựng và xử lý giao diện người dùng hiệu quả cho hệ thống quản trị.

Để đảm bảo bảo mật hệ thống, chúng tôi áp dụng Json Web Token (JWT) cho việc xác thực tài khoản đăng nhập của khách hàng Ngoài ra, mã OTP được sử dụng để người dùng có thể khôi phục tài khoản thông qua email đã đăng ký.

Người dùng có thể xây dựng một mạng xã hội giúp kết nối mọi người, cho phép nhắn tin, tạo phòng nhắn tin, đăng bài viết và tương tác với các bài viết trên cả website và thiết bị di động.

Quản trị xây dựng đóng vai trò quan trọng trong việc quản lý và theo dõi tài nguyên, dữ liệu của hệ thống, bao gồm thống kê, quản lý tài khoản, quản lý bài viết, quản lý phòng nhắn tin và quản lý bình luận.

Mục tiêu của đề tài là phát triển một mạng xã hội giúp người dùng kết nối, nhắn tin và chia sẻ thông tin qua một trang web thân thiện và dễ sử dụng Nền tảng này cho phép mọi người xây dựng mối quan hệ với những người có cùng sở thích, nghề nghiệp, hoặc đơn giản chỉ để kết nối với bạn bè và gia đình.

ReactJs là thư viện JavaScript mã nguồn mở do Facebook phát triển, ra mắt năm 2013, cho phép tạo giao diện người dùng (UI) từ các đoạn mã nhỏ và độc lập gọi là “components” Thư viện này hiện đang rất phổ biến, giúp lập trình viên xây dựng UI một cách hiệu quả và linh hoạt.

CÀI ĐẶT VÀ KIỂM THỬ

Cài đặt

 Cài đặt NodeJS phiên bản mới (LTS hoặc bản hiện tại là 18.12.1 https://nodejs.org/en/download/)

 Cài đặt Flutter bản mới nhất cùng với Android Toolkit

 Phiên bản di động hỗ trợ cho Android 10 trở lên

 Cài đặt Visual Studio Code Link cài đặt: https://code.visualstudio.com/download

 Tải project tại: https://gitlab.com/sg83/zola

Các bước chạy hệ thống

 git clone https://gitlab.com/sg83/zola

 npm run start hoặc yarn start

 np run test hoặc yarn test để chạy unit test

 Mở trình duyệt truy cập http://localhost:5173 (đối với client) và http://localhost:5175 (đối với admin)

 flutter run (chạy trên android)

Hoặc có thể truy cập trực tiếp trang web tại địa chỉ: https://zola- social.netlify.app/

Kiểm thử

Kiểm thử đơn vị(Unit test) các API với Jest và Suppertest:

- Dùng yarn test để chạy hết toàn bộ các unit test

- Các API liên quan đến xác thực, đăng ký, đăng nhập

Hình 53 Unit test cho các API chỉnh của xác thực

- Các API liên quan đến người dùng

Hình 54 Unit test cho các API chính của người dùng

- Các API liên quan đến bài viết

Hình 55 Unit test cho các API chính của bài viết

- Các API liên quan đến bình luận

Hình 56 Unit test cho các API chính của bình luận

- Các API liên quan đến thông báo

Hình 57 Kết quả Unit test cho các API chính của thông báo

- Các API liên quan đến phòng nhắn tin

Hình 58 Unit test cho các API chính của phòng nhắn tin

- Các API liên quan đến xác thực, đăng nhập

Hình 59 Unit test cho các API chính của admin cho xác thực

Hình 60 Unit test cho các API chính của admin cho thống kê

- Các API liên quan đến người dùng

Hình 61 Unit test cho các API chính của admin về người dùng

- Các API liên quan đến bài viết

Hình 62 Unit test cho các API chính của admin về bài viết

- Các API liên quan đến phòng nhắn tin

Hình 63 Unit test cho các API chính của admin về phòng nhắn tin

 Chức năng đăng nhập tài khoản

Title Test Steps Test Data Expected Result Actual

Result Status Đăng nhập Đăng nhập thành công

Chạy ứng dụng Bấm đăng nhập Nhập username và password Bấm đăng nhập username:

” Đăng nhập thành công và chuyển hướng đến màn hình trang chủ

Pass Đăng nhập Đăng nhập thất bại

Chạy ứng dụng Bấm bắt đầu Nhập username và password Bấm đăng nhập username:

“12345” Đăng nhập không thành công, thông báo “Mật khẩu sai”

Bảng 67 Testcase User - Chức năng đăng nhập tài khoản

 Chức năng đăng ký tài khoản

Title Test Steps Test Data Expected

Actual Result Status Đăng ký tài khoản Đăng ký thành công

Chạy ứng dụng Bấm đăng ký Nhập các trường thông tin sau: Họ và tên, email,

Họ và tên: “Le Sang”

“Sang2403@” Đăng ký thành công và chuyển hướng đến trang đăng nhập

113 ngày tháng năm sinh, mật khẩu, xác nhận mật khẩu Bấm đăng ký

“Sang2403@” Đăng ký tài khoản Đăng ký thất bại do xác nhận mật khẩu không khớp

Chạy ứng dụng Bấm đăng ký Nhập các trường thông tin sau: Họ và tên, email, ngày tháng năm sinh, mật khẩu, xác nhận mật khẩu Bấm đăng ký

Họ và tên: “Le Sang”

“123456” Đăng ký không thành công, thông báo

Bảng 68 Testcase User - Chức năng đăng ký tài khoản

 Chức năng xem bài viết

Chạy ứng dụng Bấm đăng nhập Nhập username và password Bấm đăng nhập Bấm vào một bài viết usernam e:

Đăng nhập thành công sẽ đưa bạn đến màn hình trang chủ, nơi hiển thị danh sách bài viết trên dòng thời gian của người dùng Khi nhấn vào bài viết, bạn sẽ được chuyển đến trang chi tiết, nơi thông tin của bài viết sẽ được hiển thị.

Bảng 69 Testcase User - Chức năng xem bài viết

 Chức năng thích bài viết

Nhấn vào biểu tượng trái tim trên bài viết

Biểu tượng trái tim sẽ chuyển thành màu đỏ và

114 số lượng lượt thích tăng lên

Bảng 70 Testcase User - Chức năng thích bài viết

 Chức năng bình luận bài viết

Bấm vào biểu tượng bình luận trên bài viết Nhập nội dung bình luân Bấm nút gửi

Thông báo bình luận thành công và hiển thị nội dung đã bình luận

Bảng 71 Testcase User - Chức năng bình luận bài viết

 Chức năng thêm bài viết

Bấm vào biểu tượng thêm bài viết trên thanh sidebar Nhập nội dung bài viết Bấm nút gửi

“Đây là nội dung bài viết”

Thông báo thêm bài viết thành công và thoát khỏi trang thêm bài viết

Bảng 72 Testcase User - Chức năng thêm bài viết

 Chức năng tạo phòng nhắn tin

Test case Test Title Test Steps Test

Bấm vào biểu tượng nhắn tin Bấm biểu tượng thêm bài viết Thêm user

Thoát khỏi trang thêm phòng, hiển thị phòng đã tạo

Bảng 73 Testcase User - Chức năng tạo phòng nhắn tin

 Chức năng gửi tin nhắn

Bấm vào phòng nhắn tin Nhập nội dung thanh input Bấm nút gửi

“Đây là nội dung chat”

Hiển thị tin nhắn đã nhập trong phòng chat, và nguời trong phòng chat sẽ thấy tin nhắn

Bảng 74 Testcase User - Chức năng gửi tin nhắn

Nút theo dõi chuyển thành nút đã theo dõi, và hiển thị user đó vào danh sách người đang theo dõi

Bảng 75 Testcase User - Chức năng theo dõi

 Chức năng bỏ theo dõi

Bấm nút bỏ theo dõi

Khi người dùng nhấn nút bỏ theo dõi, một popup xác nhận sẽ hiển thị Sau khi xác nhận, popup sẽ tự động tắt, nút bỏ theo dõi sẽ chuyển thành nút theo dõi, và người dùng đó sẽ không còn xuất hiện trong danh sách người đang theo dõi.

Bảng 76 Testcase User - Chức năng bỏ theo dõi

ƯU ĐIỂM

4 Đề nghị cho bảo vệ hay không?

(Ký & ghi rõ họ tên)

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN

Họ và tên Sinh viên 1: Võ Minh Trí MSSV 1: 19110483

Họ và tên Sinh viên 2: Lê Minh Sang MSSV 2: 19110446 Ngành: Công nghệ thông tin Tên đề tài: Xây dựng ứng dụng mạng xã hội ………

Họ và tên Giáo viên phản biện: TS Huỳnh Xuân Phụng

1 Về nội dung đề tài & khối lượng thực hiện: :

4 Đề nghị cho bảo vệ hay không?

(Ký & ghi rõ họ tên) ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP

Họ và Tên SV thực hiện 1: Võ Minh Trí Mã Số SV: 19110483

Họ và Tên SV thực hiện 2: Lê Minh Sang Mã Số SV: 19110446

Thời gian làm luận văn: Từ 14/03/2022 đến 05/07/2022

Chuyên ngành: Công nghệ phần mềm

Tên luận văn: Xây dựng mạng xã hội nhắn tin

Giảng viên hướng dẫn: ThS Nguyễn Trần Thi Văn

Nhiệm vụ của luận văn:

Tìm hiểu về các công nghệ: ReactJS, Flutter, Node Js, MongoDB, Socket IO, JSON WebToken

- Sử dụng NodeJs và ExpressJS để xây dựng Backend, viết API cho các module trong hệ thống

- Sử dụng MongoDB để lưu trữ dữ liệu người dùng của hệ thống

- Sử dụng JSON Web Token để xác thực và ủy quyền cho hệ thống API với Redis quản lý các token

- Sử dụng thư viện React để thiết kế và xử lý giao diện web cho người dùng thao tác cho phần web và Flutter cho phần mobile

- Sử dụng Socket IO cho tác vụ cần realtime là gửi tin nhắn Đề cương viết luận văn:

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

1.4.Mục tiêu của đề tài

1 Chương 1: CƠ SỞ LÝ THUYẾT

2 Chương 2: KHẢO SÁT HIỆN TRẠNG VÀ MÔ HÌNH HÓA YÊU CẦU

Chúng tôi xin gửi lời cảm ơn chân thành đến giảng viên hướng dẫn, thầy Nguyễn Trần Thi Văn, vì đã tận tình chỉ dẫn, hỗ trợ và giải đáp mọi thắc mắc của nhóm trong suốt quá trình thực hiện đồ án.

Khoa CNTT tại Kỹ Thuật TP.HCM đã cung cấp cho chúng em kiến thức vững chắc về các môn đại cương và chuyên ngành, tạo nền tảng lý thuyết vững vàng và hỗ trợ chúng em trong suốt quá trình học tập.

Dưới điều kiện thời gian và kinh nghiệm còn hạn chế, đồ án của nhóm em không tránh khỏi những thiếu sót Vì vậy, nhóm em rất mong nhận được sự góp ý chân thành từ thầy cô và các bạn Những ý kiến đóng góp về đề tài sẽ giúp nhóm em tích lũy thêm kinh nghiệm cho các nghiên cứu sau này Nhóm em xin chân thành cảm ơn thầy Nguyễn Trần Thi Văn và các bạn đã hỗ trợ.

Trong thời đại công nghệ thông tin hiện nay, nhu cầu kết nối và chia sẻ khoảnh khắc cùng ý kiến cá nhân giữa mọi người ngày càng gia tăng.

Nhóm đã quyết định xây dựng một trang web mạng xã hội trực tuyến, nơi mọi người có thể dễ dàng kết nối và chia sẻ kiến thức, khoảnh khắc của mình thông qua giao diện thân thiện Ứng dụng này giúp người dùng xây dựng mối quan hệ với những người có chung sở thích và kết nối với bạn bè, gia đình, đồng thời giải quyết nhu cầu chia sẻ ý kiến và khoảnh khắc cá nhân.

Đề tài này giúp người dùng chia sẻ thông tin và khoảnh khắc với bạn bè, cho phép mọi người thích và bình luận về bài viết Ngoài ra, nó còn ứng dụng các công nghệ tiên tiến để tạo ra sản phẩm.

Nghiên cứu và sử dụng ReactJs, Flutter cùng với các thư viện bổ trợ là rất quan trọng trong việc xây dựng và xử lý giao diện người dùng cũng như hệ thống quản trị.

Để đảm bảo bảo mật hệ thống, chúng tôi sử dụng Json Web Token (JWT) để xác thực tài khoản đăng nhập cho cả khách hàng Đồng thời, mã OTP được áp dụng để người dùng có thể khôi phục tài khoản thông qua email đã đăng ký.

Người dùng có thể xây dựng mạng xã hội để kết nối và nhắn tin với nhau, tạo phòng nhắn tin, đăng bài viết và tương tác với các nội dung thông qua website và thiết bị di động.

Quản trị xây dựng là quá trình quản lý và theo dõi tài nguyên, dữ liệu của hệ thống, bao gồm thống kê, quản lý tài khoản, bài viết, phòng nhắn tin và bình luận.

Mục đích của đề tài là xây dựng một mạng xã hội giúp mọi người kết nối, nhắn tin và chia sẻ thông tin qua một trang web thân thiện và dễ sử dụng Đây sẽ là nền tảng trực tuyến cho phép người dùng tạo dựng các mối quan hệ với những người có chung sở thích, nghề nghiệp, hoặc đơn giản là để bạn bè và gia đình có thể kết nối với nhau.

ReactJs là thư viện JavaScript mã nguồn mở do Facebook phát triển, ra mắt năm 2013, cho phép tạo giao diện người dùng (UI) từ các thành phần nhỏ gọi là “components” Thư viện này hiện rất phổ biến, giúp lập trình viên xây dựng UI một cách hiệu quả và linh hoạt.

Tiêu đề	Xây Dựng Ứng Dụng Mạng Xã Hội
Tác giả	Võ Minh Trí, Lê Minh Sang
Người hướng dẫn	ThS. Nguyễn Trần Thi Văn
Trường học	Đại học Sư phạm Kỹ thuật Thành phố Hồ Chí Minh
Chuyên ngành	Công nghệ thông tin
Thể loại	Đồ án tốt nghiệp
Năm xuất bản	2023
Thành phố	Tp. Hồ Chí Minh

Định dạng
Số trang	129
Dung lượng	6,72 MB