Khóa luận tốt nghiệp xây dựng hệ thống mạng xã hội

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC THĂNG LONG KHÓA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG MẠNG XÃ HỘI GIÁO VIÊN HƯỚNG DẪN TS Trần Đức Minh SINH VIÊN THỰC HIỆN Phạm Văn Nguyên_A36555_TT32H4 Ngành: Công nghệ thông tin Nguyễn Thị Tâm Anh_A34915_TT32E1 Ngành: Công nghệ thông tin HÀ NỘI – 2023 MỤC LỤC CHƯƠNG TỔNG QUAN HỆ THỐNG 1.1 Mô tả toán .6 1.2 Mô tả hệ thống 1.2.1 Sơ đồ tổng quan chức hệ thống 1.2.2 Các tác nhân (actor) tham gia hệ thống 1.2.3 Các chức hệ thống CHƯƠNG TỔNG THỂ 2.1 CƠNG NGHỆ SỬ DỤNG VÀ KIẾN TRÚC 11 Các cơng nghệ sử dụng .11 2.1.1 ReactJS 11 2.1.2 NodeJS 11 2.1.3 ExpressJS 13 2.1.4 MongoDB 13 2.1.5 JSON Web Tokens (JWT) 15 2.1.6 Firebase Cloud Messaging (FCM) 15 2.1.7 Cloudinary 16 2.1.8 Socket.io 17 2.1.9 Nodemailer 18 2.1.10 Redux 18 2.1.11 Hooks .19 2.1.12 NuxtJS 19 2.1.13 OpenCV 20 2.1.14 YOLO 20 2.1.15 gRPC .21 2.1.16 Python 21 2.2 Kiến trúc tổng thể .21 2.2.1 Mô tả kiến trúc tổng thể .21 2.2.2 Mơ hình hướng nghiệp vụ 22 2.2.3 Cấu trúc solution web app 25 2.2.4 API 25 CHƯƠNG THỐNG ĐẶC TẢ CHỨC NĂNG CHÍNH CỦA HỆ 27 3.1 Đăng ký 27 3.2 Đăng nhập 29 3.3 Trò chuyện 31 3.4 Tạo đăng 32 3.5 Tương tác viết .34 3.6 Chỉnh sửa thông tin cá nhân 36 3.7 Theo dõi .37 3.8 Hủy theo dõi 38 3.9 Gửi lời mời kết bạn 40 3.10 Xác nhận lời mời kết bạn 41 3.11 Tìm kiếm 43 3.12 Xem thông báo 45 3.13 Thống kê 46 3.14 Quản lý viết 48 3.15 Quản lý người dùng 50 3.16 Quản lý báo cáo 52 3.17 Đăng xuất 54 3.18 Tạo tin ngày 55 3.19 Tự động xóa vi phạm 56 3.20 Quản lý viết cá nhân 58 3.21 Quản lý danh sách bạn bè 59 3.22 Gửi thông báo tương tác viết .61 3.23 Gửi thông báo chờ kết bạn .62 3.24 Gửi thông báo kiểm duyệt đăng 64 3.25 Kiểm duyệt đăng 65 3.26 Gửi thông báo tin nhắn 66 3.27 Gửi thông báo xác nhận lời mời kết bạn 68 3.28 Gửi thông báo theo dõi .69 3.29 Quên mật 71 CHƯƠNG PHÂN TÍCH THIẾT KẾ Cơ sở liệu 73 4.1 Biểu đồ lớp thiết kế 73 4.2 Quan hệ lớp 74 4.3 Biểu đồ 77 4.3.1 Đăng ký 77 4.3.2 Đăng nhập .78 4.3.3 Đăng xuất 79 4.3.4 Trò chuyện 80 4.3.5 Tạo đăng 80 4.3.6 Chỉnh sửa thông tin cá nhân 82 4.3.7 Tương tác viết 82 4.3.8 Gửi yêu cầu kết bạn 83 4.3.9 Xác nhận lời mời kết bạn .83 4.3.10 Theo dõi/ hủy theo dõi 84 4.3.11 Xem thông báo 85 4.3.12 Quản lý viết .85 4.3.13 Quản lý người dùng 86 4.3.14 Quản lý báo cáo 86 4.3.15 Tự động xóa viết vi phạm 87 4.3.16 Tạo tin ngày 87 4.3.17 Tìm kiếm .88 4.3.18 Quản lý viết cá nhân 89 4.3.19 Quên mật .89 4.3.20 Thống kê 90 CHƯƠNG CÀI ĐẶt VÀ KẾT QUẢ .91 5.1 Các yêu cầu ứng dụng 91 5.2 Kết cài đặt mockup .91 5.2.1 Giao diện trang chủ 91 5.2.2 Chức đăng nhập 92 5.2.3 Chức đăng ký .93 5.2.4 Chức chỉnh sửa thông tin cá nhân .94 5.2.5 Chức tương tác 95 5.2.6 Chức nhắn tin 97 5.2.7 Chức tạo đăng .98 5.2.8 Chức tạo story .99 5.2.9 Chức xem thông báo 101 5.2.10 Chức quản lý bạn bè 102 5.2.11 Chức tạo nhóm chat 103 5.2.12 Giao diện trang admin .103 CHƯƠNG 6.1 KẾT LUẬN .104 Kết đạt 104 DANH MỤC MINH HỌA Hình 1.1 Sơ đồ chức hệ thống Hình 2.1 Cơng nghệ ReactJS 11 Hình 2.2 Cơng nghệ NodeJS 11 Hình 2.3 Công nghệ ExpressJS .13 Hình 2.4 Cơng nghệ MongoDB 14 Hình 2.5 Cơng nghệ JWT 15 Hình 2.6 Cơng nghệ FCM .16 Hình 2.7 Công nghệ Cloudinary 17 Hình 2.8 Cơng nghệ socket.io .17 Hình 2.9 Cơng nghệ Redux 19 Hình 2.10 Cơng nghệ NuxtJS 20 Hình 2.11 Công nghệ OpenCV .20 Hình 2.12 Cơng nghệ gRPC 21 Hình 2.13 Cơng nghệ Python 21 Hình 2.14 Kiến trúc Client-Server 22 Hình 2.15 Kiến trúc MVC .23 Hình 2.16 Mơ hình kiến trúc tổng thể 25 Hình 2.17 Mơ tả cấu trúc web app .25 Hình 2.18 Mơ tả cấu trúc web app2 25 Hình 2.19 API .25 Hình 3.1 Giao diện lỗi chức đăng ký 28 Hình 3.2 Giao diện chức đăng ký 29 Hình 3.3 Giao diện lỗi chức đăng nhập 30 Hình 3.4 Giao diện chức đăng nhập 31 Hình 3.5 Giao diện chức nhắn tin 32 Hình 3.6 Giao diện chức tạo đăng 34 Hình 3.7 Giao diện gửi thông báo xác nhận lời mời kết bạn 69 Hình 3.23.8 Giao diện gửi thông báo theo dõi .70 Hình 4.1 Biểu đồ lớp thiết kế 73 Hình 4.2 Biểu đồ chức đăng nhập .79 Hình 4.3.Biểu đồ chức đăng xuất 80 Hình 4.4 Biểu đồ chức trị chuyện 80 Hình 4.5 Biểu đồ chức tạo đăng 81 Hình 4.6 Biểu đồ chỉnh sửa thơng tin cá nhân 82 Hình 4.7.Biểu đồ tương tác viết 82 Hình 4.8 Biểu đồ gửi yêu cầu kết bạn .83 Hình 4.9.Biểu đồ xác nhận lời mời kết bạn 83 Hình 4.10 Biểu đồ theo dõi/hủy theo dõi 84 Hình 4.11 Biểu đồ chức xem thông báo 85 Hình 4.12 Biểu đồ quản lý viết 85 Hình 4.13 Biểu đồ chức quản lý người dùng 86 Hình 4.14 Biểu đồ chức quản lý báo cáo 86 Hình 4.15 Biểu đồ chức tự động xóa viết vi phạm 87 Hình 4.16 Biểu đồ chức tạo tin ngày 88 Hình 4.17 Biểu đồ chức tìm kiếm .89 Hình 4.18 Biểu đồ chức quản lý viết cá nhân .89 Hình 4.19 Biểu đồ chức quên mật 91 Hình 4.20 Biểu đồ chức thống kê .92 Hình 4.21 Biểu đồ chức gửi thông báo tương tác .93 Hình 4.22 Biểu đồ chức gửi thông báo tin nhắn .94 Hình 4.23 Biểu đồ chức gửi thông báo chờ kết bạn 95 Hình 4.24 Biểu đồ chức gửi thông báo xác nhận lời mời kết bạn .96 Hình 4.25 Biểu đồ chức gửi thông báo theo dõi .97 Hình 4.26.Biểu đồ chức gửi thơng báo kiểm duyệt đăng .98 Hình 5.1.Mockup giao diện trang chủ 99 Hình 5.2 Mockup giao diện đăng nhập 100 Hình 5.3 Mockup giao diện đăng ký 101 Hình 5.4 Mockup giao diện chỉnh sửa thơng tin 102 Hình 5.5 Mockup giao diện chức tương tác 103 Hình 5.6 Mockup giao diện chi tiết chức chia sẻ 104 Hình 5.7 Mockup giao diện chức nhắn tin 105 Hình 5.8 Mockup giao diện chức tạo đăng 106 Hình 5.9 Mockup giao diện chức tạo story 107 Hình 5.10 Giao diện mockup tạo story chi tiết 108 Hình 5.11 Mockup giao diện chức xem thông báo .109 Hình 5.12 Mockup giao diện chức quản lý bạn bè 110 Hình 5.13 Mockup giao diện chức tạo nhóm chat 111 Hình 5.14 Mockup giao diện trang quản trị viên 111 GIẢI THÍCH CÁC THUẬT NGỮ Thuật ngữ Diễn giải ADMIN Quản trị viên USER Người dùng DOM Document Object Model, dịch mơ hình đối tượng tài liệu JSX JSX = JavaScript + XML , cú pháp mở rộng JavaScript RDBMS Relational Database Management System, có nghĩa hệ quản trị sở liệu JSON Javascript Object Notation URL Uniform Resource Locator, địa web API Application Programming Interface, phương thức kết nối với thư viện ứng dụng khác TCP Transmission Control Protocol, giao thức tiêu chuẩn internet HTTP Hypertext Transfer Protocol giao thức (quy tắc truyền tin) để trao đổi thơng tin máy chủ Web trình duyệt Web XML Extensible Markup Language ngôn ngữ đánh dấu mở rộng URI Uniform Resource Identifier – Nhận diện tài nguyên thống NPM Node Package Manager SMTP Simple Mail Transfer Protocol giao thức chuẩn TCP/IP dùng để truyền tải thư điện tử (e-mail) mạng internet Bảng 1.1 Bảng giải thích thuật ngữ