đồ án 2 xây dựng mạng xã hội chia sẻ ảnh và video

- Vẽ Sequence Diagram • Bước 3: Thiết kế dữ liệu - Thiết kế dữ liệu tương ứng với từng loại yêu cầu của phần mềm để đảm bảo được tính đúng đắn và tính tiến hóa với phần mềm, có hiệu quả

BỘ GIÁO DỤC VÀ ĐÀO TẠO

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM

ĐỒ ÁN 2

XÂY DỰNG MẠNG XÃ HỘI CHIA SẺ ẢNH VÀ VIDEO

Giảng viên hướng dẫn : TS Đỗ Thị Thanh Tuyền Sinh viên thực hiện 1 : Phạm Thị Thu Trang

LỜI CẢM ƠN

Đầu tiên, chúng em xin gửi lời cảm ơn chân thành đến TS Đỗ Thị Thanh Tuyền – giảng viên hướng dẫn môn Đồ án 2 – khoa Công nghệ Phần mềm Cô đã trực tiếp giảng dạy, tận tình chia sẻ những kiến thức, hỗ trợ và đóng góp những ý kiến quý báu để giúp chúng em hoàn thành thật tốt đồ án và báo cáo của mình

Trong thời đại công nghệ phát triển mạnh mẽ vượt bậc ngày nay nhu cầu sử dụng mạng xã hội ngày càng tăng Đối với nhiều người, việc này không chỉ là một hình thức giải trí mà còn là cách để kết nối và chia sẻ trải nghiệm với cộng đồng Nhận thức được sự quan trọng của điều này, chúng em quyết định nghiên cứu và thực hiện đồ án “Xây dựng mạng xã hội chia sẻ ảnh và video” Mục tiêu là tạo ra một nền tảng mạng xã hội thân thiện, thuận tiện và đáp ứng đầy đủ các nhu cầu của người sử dụng Tuy nhiên, trong quá trình thực hiện đồ án vẫn còn những sai sót khó tránh khỏi nên nhóm chúng em rất mong nhận được sự thông cảm và góp ý chân thành từ phía Cô để nhằm trau dồi, khắc phục và ngày càng hoàn thiện tốt hơn đồ án mà chúng em đang xây dựng Đồng thời chúng em sẽ có thêm nhiều kinh nghiệm quý giá để thực hiện các đề tài khác trong tương lai

TP.HCM, ngày 31 tháng 12 năm 2023 Nhóm sinh viên thực hiện

Phạm Thị Thu Trang – Nguyễn Trần Cẩm Tiên

1.2 Case-study tham khảo: 13

1.3 Môi trường phát triển: 13

1.4 Mô tả quy trình thực hiện các công việc chính: 13

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

2.6.3 So sánh với các cơ sở dữ liệu khác: 23

Chương 3: PHÂN TÍCH THIẾT KẾ HỆ THỐNG 24

3.1 Yêu cầu nghiệp vụ: 24

3.1.1 Mục đích hệ thống 24

3.1.2 Mô tả quy trình: 24

3.2 Yêu cầu chức năng: 25

3.3 Yêu cầu phi chức năng: 25

3.4 Yêu cầu hiệu suất: 25

3.5 Yêu cầu tiện dụng: 26

3.6 Yêu cầu tương thích: 26

3.7 Yêu cầu bảo mật: 27

3.8 Yêu cầu an toàn: 27

3.9 Yêu cầu công nghệ: 28

3.10 Sơ đồ Use-case: 28

3.10.1 Sơ đồ Use-case: 28

3.10.2 Danh sách các actor: 29

3.10.3 Danh sách các Use-case: 29

3.11 Thiết kế Activity Diagram: 30

3.11.1 Activity Diagram “Đăng nhập”: 30

3.11.2 Activity Diagram “Quản lý hồ sơ cá nhân”: 31

3.11.3 Activity Diagram “Tương tác với bài đăng”: 32

3.11.4 Activity Diagram “Tạo bài đăng”: 33

3.11.5 Activity Diagram “Xóa bài đăng”: 33

3.11.6 Activity Diagram “Theo dõi người dùng”: 34

3.11.7 Activity Diagram “Nhắn tin”: 34

3.11.8 Activity Diagram “Báo cáo tài khoản”: 35

3.11.9 Activity Diagram “Báo cáo bài đăng”: 35

3.12 Thiết kế Sequence Diagram: 36

3.12.1 Sequence Diagram “Đăng nhập”: 36

3.12.2 Sequence Diagram “Quản lý hồ sơ cá nhân”: 37

3.12.3 Sequence Diagram “Tương tác với bài đăng”: 38

3.12.4 Sequence Diagram “Tạo bài đăng”: 39

3.12.5 Sequence Diagram “Xóa bài đăng”: 40

3.12.6 Sequence Diagram "Theo dõi người dùng”: 40

3.12.7 Sequence Diagram "Nhắn tin”: 41

3.12.8 Sequence Diagram “Báo cáo tài khoản”: 42

3.12.9 Sequence Diagram “Báo cáo bài đăng”: 42

3.13 Thiết kế Class Diagram: 43

3.13.1 Tổng quan Class Diagram: 43

3.13.2 Đặc tả chi tiết Class Diagram: 44

4.10.2 Chia sẻ bài đăng: 60

4.11 Màn hình Tạo bài đăng: 60

4.19 Màn hình của quản trị viên: 73

4.19.1 Màn hình thông báo về báo cáo: 73

4.19.2 Màn hình bài đăng bị báo cáo: 73

4.19.3 Màn hình tài khoản bị báo cáo: 74

4.19.4 Màn hình danh sách các báo cáo: 74

4.19.5 Màn hình thông báo duyệt báo cáo: 75

4.19.5.1 Màn hình duyệt báo cáo bài đăng: 75

4.19.5.2 Màn hình duyệt báo cáo tài khoản: 75

4.19.6 Màn hình kết quả báo cáo: 75

5.2 Kết quả đạt được của đồ án: 79

5.3 Hướng phát triển của đồ án: 79

TÀI LIỆU THAM KHẢO 81

Hình 3.2 Activity Diagram “Đăng nhập” 30

Hình 3.3 Activity Diagram “Quản lý hồ sơ cá nhân” 31

Hình 3.4 Activity Diagram “Tương tác với bài đăng” 32

Hình 3.5 Activity Diagram “Tạo bài đăng” 33

Hình 3.6 Activity Diagram “Xóa bài đăng” 33

Hình 3.7 Activity Diagram “Theo dõi người dùng” 34

Hình 3.8 Activity Diagram “Nhắn tin” 34

Hình 3.9 Activity Diagram “Báo cáo tài khoản” 35

Hình 3.10 Activity Diagram “Báo cáo bài đăng” 35

Hình 3.11 Sequence Diagram “Đăng nhập” 36

Hình 3.12 Sequence Diagram “Quản lý hồ sơ cá nhân” 37

Hình 3.13 Sequence Diagram “Tương tác với bài đăng” 38

Hình 3.14 Sequence Diagram “Tạo bài đăng” 39

Hình 3.15 Sequence Diagram “Xóa bài đăng” 40

Hình 3.16 Sequence Diagram “Theo dõi người dùng” 40

Hình 3.17 Sequence Diagram “Nhắn tin” 41

Hình 3.18 Sequence Diagram “Báo cáo tài khoản” 42

Hình 3.19 Sequence Diagram “Báo cáo bài đăng” 42

Hình 3.20 Tổng quan Class Diagram 43

Hình 3.21 Tổng quan kiến trúc hệ thống 50

Hình 4.1 Màn hình Đăng nhập 52

Hình 4.2 Màn hình Đăng ký 52

Hình 4.8 Màn hình bài đăng trên trang chủ 55

Hình 4.9 Khung chat và màn hình nhắn tin trên trang chủ 56

Hình 4.10 Menu chính của người dùng – của quản trị viên 56

Hình 4.11 Các tùy chọn thêm 57

Hình 4.12 Khung tìm kiếm 57

Hình 4.13 Khung Thông báo 58

Hình 4.14 Màn hình Đổi mật khẩu 59

Hình 4.15 Tổng quan màn hình Bài đăng chi tiết 59

Hình 4.16 Màn hình Chia sẻ bài đăng 60

Hình 4.17 Màn hình Tạo bài đăng 60

Hình 4.24 Giao diện màn hình Hồ sơ cá nhân của bản thân 64

Hình 4.25 Giao diện màn hình Hồ sơ cá nhân của người khác 65

Hình 4.35 Màn hình Cắt ảnh story 70

Mình 4.36 Màn hình sửa màu ảnh story 70

Hình 4.37 Màn hình thêm bộ lọc story 71

Hình 4.38 Màn hình Thêm chữ khi đã thêm chữ 71

Hình 4.39 Màn hình Thêm chữ khi chỉnh sửa chữ 72

Hình 4.40 Bảng chọn font 72

Hình 4.41 Màn hình thông báo về báo cáo bài đăng – tài khoản 73

Hình 4.42 Màn hình bài đăng bị báo cáo 73

Hình 4.43 Màn hình tài khoản bị báo cáo 74

Hình 4.44 Màn hình danh sách các báo cáo 74

Hình 4.45 Màn hình duyệt báo cáo bài đăng 75

Hình 4.46 Màn hình duyệt báo cáo tài khoản 75

MỤC LỤC BẢNG

Bảng 2.1 So sánh Redis với các cơ sở dữ liệu khác 23

Bảng 3.1 Yêu cầu hiệu suất 25

Bảng 3.2 Yêu cầu tiện dụng 26

Bảng 3.3 Yêu cầu tương thích 26

Bảng 3.4 Yêu cầu bảo mật 27

Bảng 3.5 Yêu cầu an toàn 27

Bảng 3.6 Yêu cầu công nghệ 28

Chương 1: GIỚI THIỆU ĐỀ TÀI

1.1 Tổng quan:

InStare là một trang web mạng xã hội tập trung vào nội dung trực quan như hình ảnh và video, là một nơi để mọi người kết nối, thể hiện bản thân, lan tỏa nguồn cảm hứng đến với mọi người xung quanh Với giao diện thân thiện và công cụ chỉnh sửa ảnh, InStare cho phép bạn chia sẻ những khoảnh khắc, sự sáng tạo và sở thích của mình với người theo dõi

1.1 Mục đích: 1.1.1 Khái niệm:

Mạng xã hội là một nền tảng trực tuyến cho phép các cá nhân và tổ chức tương tác với nhau thông qua việc chia sẻ thông tin, ý kiến, nội dung, hình ảnh và video Nó cho phép người dùng kết nối với những người khác, đồng thời tạo ra một cộng đồng trực tuyến với những người có cùng sở thích, quan điểm và hoạt động Mạng xã hội cũng cung cấp các công cụ để quản lý mối quan hệ, tạo thương hiệu, quảng cáo và kinh doanh trực tuyến

1.1.3 Đối tượng sử dụng:

Đối tượng sử dụng của mạng xã hội có thể là bất kỳ ai (thông thường là từ 13 tuổi trở lên), bao gồm các cá nhân, tổ chức, doanh nghiệp hoặc cộng đồng Mạng xã hội đã trở thành một phương tiện truyền thông mạnh mẽ để kết nối và tương tác với những người có cùng sở thích, hoạt động và quan điểm Nó được sử dụng để chia sẻ thông tin, đưa ra ý kiến, giải trí, tạo mối quan hệ kinh doanh, quảng cáo và nhiều mục đích khác Người dùng có thể tùy chỉnh trang cá nhân của mình và lựa chọn những người bạn muốn kết nối với để xây dựng một mạng lưới cá nhân hoặc cộng đồng trực tuyến

1.2 Case-study tham khảo:

- Instagram - Facebook - Twitter

1.3 Môi trường phát triển:

- Hệ điều hành: Windows 10 - Cơ sở dữ liệu: MongoDB, Redis

- Công cụ phân tích, thiết kế: Figma, draw.io, StarUML,… - IDE: Visual Studio Code

- Môi trường làm việc nhóm: Notion, Google Drive, Microsoft Teams, Facebook Messenger

- Các framework sử dụng: NodeJS, NestJS, ReactJS - Ngôn ngữ lập trình: JavaScript, TypeScript

- Quản lý phiên bản: Git

- Thư viện hỗ trợ: Socket.io, SRS

1.4 Mô tả quy trình thực hiện các công việc chính:

• Bước 1: Xác định các yêu cầu: - Phân tích khả thi quy mô thực hiện - Tìm hiểu quy trình nghiệp vụ

- Tham khảo và trải nghiệm các ứng dụng liên quan - Khảo sát người dùng qua mạng

- Thu thập thông tin yêu cầu

• Bước 2: Thiết kế hệ thống:

- Vẽ sơ đồ Use-case: phân tích nghiệp vụ tổng quan - Vẽ Sequence Diagram

• Bước 3: Thiết kế dữ liệu

- Thiết kế dữ liệu tương ứng với từng loại yêu cầu của phần mềm để đảm bảo được tính đúng đắn và tính tiến hóa với phần mềm, có hiệu quả về mặt truy xuất và lưu trữ

- Xác định và lập danh sách các bảng dữ liệu cần thiết cho các yêu cầu của phần mềm

- Xây dựng sơ đồ logic cụ thể của phần mềm • Bước 4: Thiết kế giao diện

- Lập ra danh sách các màn hình khi người dùng tương tác với phần mềm - Mô tả các đối tượng trên từng màn hình

- Xác định những chức năng hiển thị trên từng màn hình • Bước 5: Code và kiểm thử

- Code trình bày theo mô hình 3 lớp và được phân chia theo các nhiệm vụ yêu cầu - Testcase rõ ràng để kiểm tra tính hiệu quả của hệ thống

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

2.1 Ngôn ngữ lập trình Javascript: 2.1.1 Javascript là gì?

Hình 2.1 Logo JavaScript

JavaScript là ngôn ngữ lập trình phổ biến dùng để tạo trang web tương tác, tích hợp và nhúng vào HTML để làm cho trang web sống động hơn Đóng vai trò như một phần của trang web, JavaScript thực thi Client-Side Script từ phía người dùng và máy chủ (Nodejs), tạo ra các trang web động Nó là ngôn ngữ thông dịch hướng đối tượng, chiếm một trong 3 ngôn ngữ chính trong lập trình web Trong quá trình xây dựng trang web chuyên nghiệp, HTML cung cấp cấu trúc cơ bản, CSS kiểm soát và định dạng thiết kế, trong khi JavaScript tạo nội dung động trên trang web (Vietnix, JavaScript là gì? Kiến thức chi tiết về JavaScript cơ bản, 2021)

2.1.2 Cách thức hoạt động của Javascript trên trang web:

JavaScript thường sẽ được nhúng trực tiếp vào một trang web hoặc được tham chiếu qua file js riêng JavaScript là ngôn ngữ từ phía client nên script sẽ được tải về máy client khi truy cập và được xử lý tại đó Thay vì tải về máy server và sau khi xử lý xong mới phản hồi kết quả đến client

2.1.3 Ưu điểm:

JavaScript có các ưu điểm được xem là vượt trội so với các đối thủ khác trong các trường hợp thực tế như:

- Chương trình JavaScript rất dễ học

- Lỗi JavaScript dễ phát hiện và sẽ giúp bạn sửa lỗi nhanh hơn

- Các trình duyệt web có thể dịch nó bằng HTML mà không cần một compiler - JS hoạt động trên rất nhiều nền tảng và trình duyệt khác nhau

- Dễ bị khai thác từ những hacker và scammer

- Có thể được dụng để thực thi mã độc trên máy tính của người dùng - JS code snippet lớn

- Các thiết bị khác nhau có thể thực hiện JS khác nhau dẫn đến không đồng nhất - Vì tính bảo mật nên client-side JavaScript không cho phép đọc và ghi các file - JS không được hỗ trợ khi sử dụng trong kết nối mạng

- JavaScript không có khả năng đa luồng hoặc đa xử lý

2.2 Ngôn ngữ lập trình TypeScript: 2.2.1 TypeScript là gì?

Hình 2.2 Logo TypeScript

TypeScript, do Microsoft phát triển, là một mã nguồn mở nâng cấp từ JavaScript, tăng tính kiểu tĩnh và hướng đối tượng để phát triển nhanh chóng và ổn định Được sử dụng rộng rãi trong các ứng dụng client-side như Angular và NodeJS, TypeScript tích hợp đầy đủ tính năng của ECMAScript 2015 - ES6 và liên tục cập nhật để áp

dụng kỹ thuật mới từ ECMAScript Người phát triển chính là Anders Hejlsberg, có đóng góp lớn trong nhiều ngôn ngữ lập trình hàng đầu như Delphi, Turbo Pascal, và C# (Vietnix, TypeScript là gì? Toàn bộ kiến thức cơ bản về TypeScript dành cho người mới, 2022)

- Vận hành miễn phí, tiết kiệm thời gian sử dụng nhờ vào IDE và trình biên dịch vượt trội

- Giảm thiểu phần trăm va chạm lỗi trong suốt quá trình vận hành - Đảm bảo tính hoạt động ổn định – thuận tiện

- Thao tác mượt mà, nhanh chóng, vô cùng đơn giản, dễ sử dụng

- TypeScript hỗ trợ các bước chỉnh sửa code tiện lợi hơn nhờ vào lệnh Rename Symbol, Find All Occurrences và RegEx

- Giúp người dùng tái cấu trúc, nâng cấp hệ thống, phần mềm và ứng dụng vượt trội hơn nhờ vào tính xử lý thông minh

- Hạn chế thử nghiệm Boilerplate rất hiệu quả, gia tăng xác suất hoàn thành công việc

- TypeScript còn hợp nhất mã code và đánh giá chính xác khi biên dịch cực kỳ dễ dàng, đơn giản

- Hỗ trợ tối ưu hóa quy trình làm việc của người dùng, hạn chế tính nhảy bước rồi thực hiện sai thao tác

2.2.4 Nhược điểm:

Bên cạnh những ưu điểm đầy nổi bật, tuy nhiên TypeScript vẫn còn tồn tại một số nhược điểm nhất định trong suốt quá trình lập trình viên thao tác, ứng dụng như sau: - Người dùng cần biên dịch đuôi js tệp TypeScript tại nền tảng Node.js

- TypeScript cần đảm bảo máy chủ Node.js, webpack và trình thử nghiệm hoạt động ổn định

- Cần thêm Typedef mỗi khi apply Redux, Styled-Component và React

- TypeScript không vận hành độc lập hay thay thế bất kỳ vai trò chính nào của JavaScript

- TypeScript chỉ nâng cấp những nhược điểm còn hạn chế của JavaScript

2.3 Hệ quản trị cơ sở dữ liệu MongoDB: 2.3.1 MongoDB là gì?

2.3.2 Đặc điểm:

- MongoDB hoạt động dưới tiến trình ngầm, lắng nghe truy vấn trên cổng 27017 - Mỗi bản ghi có trường "_id" kiểu ObjectId để xác định tính duy nhất và được đánh

index

- Truy vấn dữ liệu được cache trong RAM để tăng tốc độ truy vấn

- Thay đổi dữ liệu chỉ được cập nhật xuống ổ cứng sau 60 giây để đảm bảo hiệu suất ứng dụng

Node.js ưu tiên sử dụng non-blocking, định tuyến đầu vào/đầu ra dữ liệu thông qua các tác vụ thời gian thực Sự kết hợp của luồng đơn và non-blocking I/O cho phép nó xử lý hàng nghìn kết nối đồng thời với thông lượng cao, giải quyết hiệu quả vấn đề tài nguyên hệ thống của các ứng dụng web truyền thống (FPT, NodeJS là gì? Những kiến thức cơ bản liên quan tới NodeJS, 2023)

2.4.2 Cấu trúc của NodeJS:

- Module: Các mô-đun JavaScript được sử dụng trong NodeJS để cung cấp chức năng cho ứng dụng Chèn mô-đun bằng cách sử dụng hàm require()

- Console: Bảng điều khiển giúp gỡ lỗi và in thông báo ra stdout và stderr, tương tự bảng điều khiển JavaScript trong trình duyệt

- Cluster: Mô-đun cho phép đa luồng bằng cách tạo các quy trình con chia sẻ cùng một cổng máy chủ và chạy đồng thời

- Global: Biến toàn cục tồn tại trong tất cả các module, bao gồm các biến như dirname, filename, exports, module, require

- Error Handling: Node.js xử lý lỗi thông qua exceptions, bao gồm Standard JavaScript errors, System errors, User-specific errors, và Assertion errors

- Streaming: Công cụ cho phép đọc và ghi dữ liệu liên tục, có 4 loại stream: Readable, Writable, Duplex, Transform Buffer được sử dụng để xử lý stream chứa dữ liệu nhị phân

- Domain: Mô-đun giúp chặn lỗi chưa được xử lý, có Internal Binding và External Binding

- DNS: Module hỗ trợ kết nối đến máy chủ DNS, phân giải tên miền thông qua dns.resolve() và dns.lookup()

- Debugger: Node.js có tính năng gỡ lỗi tích hợp, hỗ trợ các tính năng kiểm tra mã cơ bản bằng từ khóa "inspect" trong hộp lệnh

2.4.3 Ưu điểm:

- IO hướng sự kiện không đồng bộ, cho phép xử lý nhiều yêu cầu đồng thời - Sử dụng JavaScript – một ngôn ngữ lập trình dễ học

- Chia sẻ cùng code ở cả phía client và server

- NPM (Node Package Manager) và module Node đang ngày càng phát triển mạnh mẽ

- Cộng đồng hỗ trợ tích cực

- Cho phép stream các file có kích thước lớn

2.4.4 Nhược điểm:

- Không có khả năng mở rộng, vì vậy không thể tận dụng lợi thế mô hình đa lõi trong các phần cứng cấp server hiện nay

- Khó thao tác với cơ sử dữ liệu quan hệ

- Mỗi callback sẽ đi kèm với rất nhiều callback lồng nhau khác - Cần có kiến thức tốt về JavaScript

- Không phù hợp với các tác vụ đòi hỏi nhiều CPU

2.5.2 Những thành phần chính của ReactJS:

- Redux là một phần quan trọng của ReactJS, giúp quản lý dữ liệu trong ứng dụng ReactJS chia chế độ xem thành các thành phần nhỏ và sử dụng Redux để làm cho chúng liên quan chặt chẽ hơn

- Trong ReactJS, việc quản lý liên kết và mối quan hệ giữa các thành phần đòi hỏi sự chú ý đặc biệt, do luồng dữ liệu chỉ di chuyển một chiều từ cấp độ mẹ đến cấp độ con

- Virtual DOM là một phần quan trọng mà ReactJS sử dụng khi có thay đổi trong DOM Nó cho phép xem và thay đổi lượt xem mà không cần thao tác trực tiếp với DOM, giúp tăng tốc độ ứng dụng và là một lợi thế lớn của ReactJS

2.5.3 Ưu điểm:

- Thích hợp cho nhiều loại trang web - Tái sử dụng thành phần

- Có thể sử dụng cho các ứng dụng di động - Công cụ phát triển web hot nhất hiện nay - Thân thiện với SEO

2.5.4 Nhược điểm:

- Reactjs chỉ phục vụ cho tầng View

- Tích hợp Reactjs vào các framework MVC truyền thống yêu cầu cần phải cấu hình lại

- React khá nặng nếu so với các framework khác React có kích thước tương tương với Angular (Khoảng 35kb so với 39kb của Angular)

- Khó tiếp cận cho người mới học Web

- Redis là một in-memory CSDL được sử dụng như bộ nhớ cache trước một CSDL chính như MySQL hoặc PostgreSQL giúp cải thiện hiệu suất ứng dụng và giảm

- Hiệu suất cao

- Cấu trúc dữ liệu linh hoạt - Đơn giản, dễ sử dụng

- Khả năng sao chép và độ bền - Khả năng mở rộng

2.6.3 So sánh với các cơ sở dữ liệu khác:

Bảng 2.1 So sánh Redis với các cơ sở dữ liệu khác

Giao tác (Transaction)

Khóa tối ưu thực thi các tập lệnh

Multi-document ACID Transactions

với Snapshot isolation

3.1.2 Mô tả quy trình:

Một quy trình cơ bản của mạng xã hội chia sẻ ảnh và video gồm các bước như sau:

- Đăng ký: Người dùng đăng ký tài khoản trên mạng xã hội bằng cách cung cấp các thông tin cần thiết như username, email và mật khẩu, sau đó hệ thống sẽ gửi mã OTP về email để xác thực tài khoản Nếu người dùng nhập đúng OTP thì quy trình đăng ký tài khoản thành công.

- Đăng nhập: Sau khi đăng ký, người dùng đăng nhập vào tài khoản của mình bằng cách nhập username hoặc địa chỉ email và mật khẩu

- Tạo trang cá nhân: Người dùng có thể tạo trang cá nhân của mình trên mạng xã hội bằng cách cung cấp thông tin cá nhân, tiểu sử và ảnh đại diện Người dùng khác có thể thấy các thông tin trên, số lượng người theo dõi, đang theo dõi, và các bài đăng trên trang cá nhân của mình

- Tạo bài đăng: Người dùng có thể tạo bài đăng chứa nhiều ảnh và video (tối đa 10), có thể chỉnh sửa từng ảnh/video, viết mô tả và đăng lên bảng tin Sau khi đăng thì bài đăng sẽ hiện lên bảng tin và thông báo đến người theo dõi

- Kết nối với bạn bè và các người dùng khác: Người dùng có thể kết nối với bạn bè của mình trên mạng xã hội bằng cách tìm kiếm và kết nối với họ trên trang cá nhân Ngoài ra người dùng có thể tìm kiếm và theo dõi các tài khoản ưa thích - Tương tác với bài đăng: Người dùng có thể tương tác với các bài đăng của bạn bè

và người được theo dõi bằng cách thả biểu tượng cảm xúc, bình luận và chia sẻ qua tin nhắn hoặc qua các trang mạng xã hội khác

- Tìm kiếm: Người dùng có thể tìm kiếm trang cá nhân của người dùng khác dựa theo tên, username hoặc email trên mạng xã hội

3.2 Yêu cầu chức năng:

- Truy cập và tải bảng tin - Quản lý hồ sơ cá nhân

- Tạo, xem, xóa và tương tác với bài đăng - Theo dõi và xem hồ sơ người dùng - Nhắn tin thời gian thực

- Tìm kiếm người dùng

- Quản lý báo cáo tài khoản, bài viết

3.3 Yêu cầu phi chức năng:

- Mã hóa mật khẩu - Phân quyền - Hiệu suất cao - Giao diện đẹp mắt - Chỉnh sửa ảnh và video

- Bố cục, cảm xúc và gắn thẻ trong bài viết - Phát trực tiếp (Livestream)

3.4 Yêu cầu hiệu suất:

Bảng 3.1 Yêu cầu hiệu suất

STT Nghiệp vụ Tốc độ xử lý Ghi chú

1 Truy cập và tải bảng tin 5-10 tin/lần 2 Tương tác bài đăng và thông báo tương tác Ngay tức thì 3 Nhắn tin và thông báo tin nhắn Ngay tức thì

7 Báo cáo bài viết hoặc hồ sơ Dưới 5 phút

3.5 Yêu cầu tiện dụng:

Bảng 3.2 Yêu cầu tiện dụng

STT Nghiệp vụ Mức độ dễ học Mức độ dễ sử dụng Ghi chú

1 Truy cập và tải bảng tin

Không cần hướng dẫn

Tỉ lệ phạm lỗi trung bình là 1%

2 Tương tác bài đăng và thông báo tương tác

Dưới 5 phút hướng dẫn

Tỉ lệ phạm lỗi trung bình là 1%

3 Nhắn tin và thông báo tin nhắn

Không cần hướng dẫn

Tỉ lệ phạm lỗi trung bình là 1%

hướng dẫn

Không nhớ rõ thông tin cần tìm

5 Đăng tải bài viết Dưới 5 phút hướng dẫn

Tỉ lệ phạm lỗi trung bình là 1%

6 Cập nhật hồ sơ cá nhân

Dưới 5 phút hướng dẫn

Tỉ lệ phạm lỗi trung bình là 1%

7 Báo cáo bài viết hoặc hồ sơ

Dưới 5 phút hướng dẫn

Tỉ lệ phạm lỗi trung bình là 1%

3.6 Yêu cầu tương thích:

Bảng 3.3 Yêu cầu tương thích

STT Nghiệp vụ Đối tượng liên quan Ghi chú

1 Chia sẻ bài đăng Chia sẻ sang trang mạng xã hội khác 2 Đăng ký tài khoản Xác nhận OTP qua email

3 Tính ổn định Tương thích với nhiều web browser và hệ điều hành

3.7 Yêu cầu bảo mật:

Bảng 3.4 Yêu cầu bảo mật

STT Nghiệp vụ Hệ thống Người dùng Quản trị viên

3.8 Yêu cầu an toàn:

Bảng 3.5 Yêu cầu an toàn

STT Nghiệp vụ Đối tượng Ghi chú

2 Hủy thật sự Bài đăng đã xóa, lịch sử tìm kiếm 3 Không cho phép xóa Người dùng, tin nhắn

3.9 Yêu cầu công nghệ:

Bảng 3.6 Yêu cầu công nghệ

STT Yêu cầu Mô tả chi tiết Ghi chú

1 Dễ sửa lỗi Xác định lỗi trong vòng 15 phút

Không ảnh hưởng đến module khác khi sửa module này

2 Dễ bảo trì Sửa lỗi trung bình trong vòng 1 giờ

3 Dễ nâng cấp Thêm mới tính năng hoặc nâng cấp tính năng có sẵn nhanh chóng

Khi có yêu cầu

4 Tính tái sử dụng Một số module có thể sử dụng ở dự án khác

Khi có yêu cầu

5 Hoàn thành nhanh chóng

Xây dựng ứng dụng mạng xã hội trung bình trong vòng 8-10 tuần

Khi có yêu cầu

6 Tính linh hoạt Chuyển đổi cơ sở dữ liệu trong vòng 2 ngày

Khi có yêu cầu

3.10 Sơ đồ Use-case: 3.10.1 Sơ đồ Use-case:

Hình 3.1 Sơ đồ Use-case

đăng

3 Quản lý hồ sơ cá nhân Người dùng có thể thực hiện các thao tác như

xem và chỉnh sửa thông tin cá nhân

4 Tương tác với bài đăng Người dùng có thể tương tác với bài đăng trên

bảng tin bằng cách thích, chia sẻ và bình luận 5 Tạo bài đăng Người dùng có thể tạo bài đăng bao gồm các

hình ảnh hoặc video kèm nội dung

6 Theo dõi người dùng Người dùng có thể theo dõi các người dùng khác

để bài đăng của họ hiện trên bảng tin của mình 7 Nhắn tin Người dùng có thể nhắn tin trực tiếp với người

dùng khác

8 Xem bài đăng Mọi người dùng đều có thể xem bài đăng nếu có

đường dẫn của bài đăng đó

9 Xem hồ sơ người dùng Mọi người dùng đều có thể truy cập đến hồ sơ

của người dùng bất kì và xem thông tin của họ

12 Quản lý bài đăng Quản trị viên có thể xóa bài đăng bị báo cáo

3.11 Thiết kế Activity Diagram:

3.11.1 Activity Diagram “Đăng nhập”:

Hình 3.2 Activity Diagram “Đăng nhập”

3.11.2 Activity Diagram “Quản lý hồ sơ cá nhân”:

Hình 3.3 Activity Diagram “Quản lý hồ sơ cá nhân”

3.11.3 Activity Diagram “Tương tác với bài đăng”:

Hình 3.4 Activity Diagram “Tương tác với bài đăng”

3.11.4 Activity Diagram “Tạo bài đăng”:

Hình 3.5 Activity Diagram “Tạo bài đăng”

3.11.5 Activity Diagram “Xóa bài đăng”:

Hình 3.6 Activity Diagram “Xóa bài đăng”

3.11.6 Activity Diagram “Theo dõi người dùng”:

Hình 3.7 Activity Diagram “Theo dõi người dùng”

3.11.7 Activity Diagram “Nhắn tin”:

Hình 3.8 Activity Diagram “Nhắn tin”

3.11.8 Activity Diagram “Báo cáo tài khoản”:

Hình 3.9 Activity Diagram “Báo cáo tài khoản”

3.11.9 Activity Diagram “Báo cáo bài đăng”:

Hình 3.10 Activity Diagram “Báo cáo bài đăng”

3.12 Thiết kế Sequence Diagram:

3.12.1 Sequence Diagram “Đăng nhập”:

Hình 3.11 Sequence Diagram “Đăng nhập”

3.12.2 Sequence Diagram “Quản lý hồ sơ cá nhân”:

Hình 3.12 Sequence Diagram “Quản lý hồ sơ cá nhân”

3.12.3 Sequence Diagram “Tương tác với bài đăng”:

Hình 3.13 Sequence Diagram “Tương tác với bài đăng”

3.12.4 Sequence Diagram “Tạo bài đăng”:

Hình 3.14 Sequence Diagram “Tạo bài đăng”

3.12.5 Sequence Diagram “Xóa bài đăng”:

Hình 3.15 Sequence Diagram “Xóa bài đăng”

3.12.6 Sequence Diagram "Theo dõi người dùng”:

Hình 3.16 Sequence Diagram “Theo dõi người dùng”