MÔ TẢ ĐỀ TÀI
Nội dung đề tài
Xây dựng tiện ích ghi màn hình trên trình duyệt cho phép người dùng ghi lại hoạt động của mình một cách dễ dàng Tiện ích này cho phép bật hoặc tắt microphone theo nhu cầu Nếu video không đạt yêu cầu, người dùng có thể loại bỏ và không lưu lại Sau khi hoàn tất, người dùng có thể tải video xuống hoặc lưu trữ trực tuyến.
Người dùng có thể truy cập vào web lưu trữ của hệ thống để xem lại video của mình và khám phá video từ những người dùng khác.
Kịch bản sử dụng chính
Người dùng sử dụng tiện ích, ghi lại toàn bộ màn hình của mình và lưu lại
Người dùng đăng nhập vào web lưu trữ, xem lại video của mình và video của người khác
Các tác nhân của hệ thống
Những người đã thêm tiện ích vào trình duyệt của mình Đối với web lưu trữ, những người dùng đăng nhập vào hệ thống
ĐẶC TẢ YÊU CẦU BÀI TOÁN
Phân tích yêu cầu chức năng
1 Xác định các tác nhân hệ thống Hệ thống có 1 tác nhân chính: User
User sẽ được sử dụng các chức năng của hệ thống như record video, xem video có trong database, tìm kiếm video, comment, ….
2 Sơ đồ ca sử dụng tổng quan hệ thống
3 Đặc tả các ca sử dụng
3.1 Đặc tả “UC001-Đăng nhập”
Mã use case UC001 Tên use case Đăng nhập
Mục đích sử dụng User đăng nhập hệ thống
Sự kiện kích hoạt User chọn chức năng đăng nhập hệ thống Điều kiện tiên quyết Không
Luồng sự kiện chính 1 Khách chọn chức năng đăng nhập
(Thành công) 2 Hệ thống hiển thị giao diện đăng nhập bằng tài khoản google
3 Khách yêu cầu đăng nhập bằng tài khoản google
4 Hệ thống kiểm tra tài khoản hợp lệ hay không
5 Hệ thống thông báo đăng nhập thành công và chuyển giao diện tiếp theo
Luồng sự kiện ngoại Không lệ
Hậu điều kiện Hệ thống thông báo đăng nhập thành công và chuyển giao diện tiếp theo
3.2 Đặc tả “UC002-Xem danh sách video”
Mã use case UC002 Tên use case Xem danh sách video
Mục đích sử dụng Tác nhân xem danh sách các video đã được record lại
Sự kiện kích hoạt Tác nhân chọn chức năng xem danh sách tất cả các video Điều kiện tiên quyết Tác nhân ở trang chủ hệ thống
Luồng sự kiện chính 1 Tác nhân chọn chức năng xem danh sách các video (Thành công) 2 Hệ thống hiển thị danh sách
Luồng sự kiện ngoại Không lệ
Hậu điều kiện Tác nhân xem danh sách các video đã được record
3.3 Đặc tả “UC003-Tìm kiếm video”
Mã use case UC003 Tên use case Tìm kiếm video
Mục đích sử dụng Tác nhân tìm kiếm video
Sự kiện kích hoạt Tác nhân chọn chức năng tìm kiếm video Điều kiện tiên quyết Không
Luồng sự kiện chính 1 Tác nhân chọn chức năng tìm kiếm video
(Thành công) 2 Hệ thống hiển thị ô tìm kiếm
3 Tác nhân nhập từ khóa tìm kiếm
4 Tác nhân yêu cầu tìm kiếm
5 Hệ thống liệt kê danh sách các video có chứa từ khóa tìm kiếm
Luồng sự kiện ngoại 5a Hệ thống thông báo lỗi: từ khóa tìm kiếm không hợp lệ lệ
5b Không tồn tại video phù hợp
Hậu điều kiện Người dùng nhìn thấy danh sách video tìm thấy (có thể là danh sách rỗng)
Mã use case UC004 Tên use case Comment
Mục đích sử dụng User bình luận video
Sự kiện kích hoạt User chọn bình luận video Điều kiện tiên quyết User đang xem video
Luồng sự kiện chính 1 User chọn bình luận video
(Thành công) 2 User soạn thảo nội dung bình luận
3 User yêu cầu đăng bình luận
4 Hệ thống hiển thị bình luận dưới video Luồng sự kiện ngoại Không lệ
Hậu điều kiện Bình luận hiện dưới video, mọi người đều có thể xem
3.5 Đặc tả “UC005-Chỉnh sửa video”
Mã use case UC005 Tên use case Chỉnh sửa video
Mục đích sử dụng User chỉnh sửa bài viết
Sự kiện kích hoạt User chọn chức năng chỉnh sửa video Điều kiện tiên quyết User nhìn thấy video cần sửa
Luồng sự kiện chính 1 User chọn chỉnh sửa video
(Thành công) 2 User chỉnh sửa video
3 User yêu cầu đăng video
4 Hệ thống hiển thị video sau khi chỉnh sửa
Luồng sự kiện ngoại lệ
Video được chỉnh sửa, mọi người đều có thể xem
3.6 Đặc tả “UC006-Xóa video”
Mã use case UC006 Tên use case Xóa video
Mục đích sử dụng User xóa video
Sự kiện kích hoạt User chọn xóa video Điều kiện tiên quyết User đang xem video của mình
Luồng sự kiện chính 1 User chọn xóa video
(Thành công) 2 User yêu cầu xóa video
3 Hệ thống xóa video đó Luồng sự kiện ngoại 2a Hệ thống báo lỗi: Xóa video bị lỗi lệ
Hậu điều kiện Video bị xóa, thành viên chuyển về trang chủ
3.7 Đặc tả “UC007-Xem thông tin User”
Mã use case UC007 Tên use case Xem thông tin người user
Mục đích sử dụng User xem chi tiết thông tin người dùng
Sự kiện kích hoạt User chọn chức năng xem thông tin người dùng Điều kiện tiên quyết User nhìn thấy tên người dùng
Luồng sự kiện chính 1 User yêu cầu xem người dùng
(Thành công) 2 Hệ thống hiển thị chi tiết thông tin người dùng
Luồng sự kiện ngoại Không lệ
Hậu điều kiện User xem chi tiết thông tin người dùng
3.8 Đặc tả “UC008-Xóa video vừa record”
Mã use case UC008 Tên use case Xóa video vừa record
Mục đích sử dụng Xóa video vừa record
Sự kiện kích hoạt User chọn chức năng xóa video vừa record Điều kiện tiên quyết User đang dùng chức năng record video
Luồng sự kiện chính 1 User yêu cầu xóa video vừa record
(Thành công) 2 Hệ thống xóa video vừa record
Luồng sự kiện ngoại Không lệ
Hậu điều kiện Xóa video vừa record
3.9 Đặc tả “UC009-Tạo video”
Mã use case UC008 Tên use case Tạo video
Mục đích sử dụng Record video
Sự kiện kích hoạt User chọn chức năng record video Điều kiện tiên quyết User đã đăng nhập vào hệ thống
Luồng sự kiện chính 1.User yêu cầu record video
(Thành công) 2.Hệ thống record video
Luồng sự kiện ngoại Không lệ
Hậu điều kiện Hệ thống tạo ra video vừa record
PHÂN TÍCH THIẾT KẾ BÀI TOÁN
Mô hình hóa tương tác
1 Các biểu đồ trình tự
1.1 Biểu đồ trình tự “UC001-Đăng nhập”
1.2 Biểu đồ trình tự “UC002-Xem danh sách video”
1.3 Biểu đồ trình tự “UC003-Tìm kiếm video”
1.4 Biểu đồ trình tự “UC004-Comment”
1.5 Biểu đồ trình tự “UC005-Chỉnh sửa video”
1.6 Biểu đồ trình tự “UC006-Xóa video”
1.7 Biểu đồ trình tự “UC007-Xem thông tin user”
1.8 Biểu đồ trình tự “UC008-Xóa video vừa record”
1.9 Biểu đồ trình tự “UC009-Tạo video”
Thiết kế chi tiết lớp
1.2 Sơ đồ gói của lớp Model
1.3 Sơ đồ gói của lớp Controller
1.4 Sơ đồ gói của lớp View
2.1.1 Lớp User ã Mụ tả: Lớp lưu trữ thụng tin về user. ã Cỏc thuộc tớnh:
Tên thuộc tính Kiểu dữ liệu Phạm vi truy cập Mô tả
Name String private Tên của người dùng email String private email đăng nhập của
21 người dùng avatar String private avatar của người dùng createAt Date Private Thời gian user đăng nhập vào hệ thống
2.1.3 Lớp Video ã Mụ tả: Lớp lưu trữ thụng tin về video ã Cỏc thuộc tớnh:
Tên thuộc tính Kiểu dữ liệu Phạm vi truy cập Mô tả url String private đường dẫn đến video
Danh sách người xem (Viewer Array) chứa thông tin về userId, là id riêng của người tạo video Thời gian đăng nhập vào hệ thống được lưu trữ dưới dạng createAt (Date) Tiêu đề của video được lưu trữ trong trường title (String).
2.1.4 Lớp Comment ã Mụ tả: Lớp lưu trữ thụng tin về user. ã Cỏc thuộc tớnh:
Trong bài viết này, chúng tôi sẽ giới thiệu về các thuộc tính của một bình luận Đầu tiên, thuộc tính "id" có kiểu dữ liệu là chuỗi (String) và có phạm vi truy cập riêng tư, dùng để xác định id của bình luận Tiếp theo, thuộc tính "content" cũng là chuỗi (String) và mang phạm vi truy cập riêng tư, chứa nội dung của bình luận Thuộc tính "author" có kiểu dữ liệu là User và được sử dụng để lưu tên người tạo bình luận Cuối cùng, thuộc tính "commentAt" có kiểu dữ liệu là ngày tháng (Date) và có phạm vi truy cập riêng tư, ghi lại thời gian tạo bình luận.
2.2.1 Lớp UserController ã Mụ tả: quản lý cỏc thao tỏc liờn quan đến người dựng ã Cỏc phương thức
Tên phương thức Đầu vào Đầu ra Phạm vi Mô tả truy cập loginController() None User public Thao tác đăng
String nhập của người dùng getUserController email User public Thao tác lấy
The getInfoById function retrieves user information using a specific user ID, while the saveUser function allows for saving user details such as name, avatar, and email.
2.2.2 Lớp VideoController ã Mụ tả: quản lý cỏc thao tỏc liờn quan đến video ã Cỏc phương thức
The article outlines various video management methods, including the searchVideoController for retrieving videos by title and page, and the getAllVideoController for fetching all videos It details the getVideoController for accessing a video by its ID, and the deleteVideoController for removing a video based on its ID The updateVideoController allows for updating video information, while the addVideo method enables the creation of a new video with specified URL and user ID Additionally, the addCommentVideo method facilitates adding comments to videos, and the uploadVideo method saves a video to the list The addViewer method tracks viewers by video ID, and the deleteComment method removes specific comments from videos.
2.3.1 Lớp User ã Mụ tả: quản lý cỏc thao tỏc liờn quan đến người dựng
Tên phương thức Đầu vào Đầu ra Phạm vi Mô tả truy cập login() None User public Thao tác đăng
String nhập của người dùng getInfoById id User public Thao tác tạo lấy thông tin người dùng thông qua Id
2.2.2 Lớp VideoController ã Mụ tả: quản lý cỏc thao tỏc liờn quan đến video ã Cỏc phương thức
The article outlines various video management methods, including input, output, and access scope Key functions include 'searchVideo' for retrieving video titles and pages, 'getAllVideo' for fetching all public videos, and 'getVideo' for accessing a specific video by ID Additionally, it covers 'deleteVideo' for removing videos by ID, 'updateVideo' for modifying video information, and 'addVideo' for creating new videos with a URL and user ID The article also highlights 'addCommentVideo' for adding comments to videos and 'uploadVideo' for saving videos to a list.
CÔNG NGHỆ SỬ DỤNG
KẾT QUẢ CHƯƠNG TRÌNH
Chương trình minh họa
ã Website được xõy dựng đỳng với kế hoạch Cỏc chức năng của
Website đáp ứng tương đối tốt yêu cầu của đề bài. ã Website được đặt tờn là “Extension record màn hỡnh - quản lý video đã record”.
TỔNG KẾT
Khó khăn và bài học
Kỹ năng làm việc nhóm đã được cải thiện đáng kể với việc sắp xếp thời gian hợp lý và các thành viên chuẩn bị kỹ lưỡng, giúp tiết kiệm thời gian cho nhau Trước đây, do thiếu kinh nghiệm về lập trình Web, việc phân chia công việc gặp nhiều khó khăn Tuy nhiên, sau quá trình học tập và ý thức tự giác, các thành viên đã dần hoàn thành bài tập lớn một cách hiệu quả.
Nhóm đã hoàn thành việc xây dựng một Website đơn giản, điều này không chỉ là nhiệm vụ mà còn là bài học về sự đoàn kết và hỗ trợ lẫn nhau Trong học kỳ với nhiều bài tập lớn, nhóm đã áp dụng nguyên tắc “Người rảnh hơn giúp đỡ người bận hơn”, nhờ đó công việc không bị trì hoãn và kết quả đạt được như mong đợi.
Kết luận
Khoảng 14 tuần học lý thuyết đã trang bị cho cả 4 thành viên những kiến thức cơ bản nhất về lập trình Web Nhìn chung, cả nhóm đều nắm được kiến thức cơ bản và có khả năng vận dụng vào bài tập lớn Website được hoàn thành với các chức năng thực hiện tốt yêu cầu đề ra, tuy là không được mượt mà nhưWebsite thương mại Nhưng đối với sự nỗ lực của nhóm thì đây là thành quả không hề nhỏ Từ con số không, mỗi thành viên đều biết cách viết Web trênVisual Studio Code, kết hợp với sử dụng NoSql trên nền tảng MongoDB