I. Giới Thiệu Về Đồ Án Xây Dựng Website Nghe Nhạc Trực Tuyến
Đồ án xây dựng website nghe nhạc trực tuyến là một dự án học tập toàn diện tại Đại Học Công Nghệ Thông Tin (UIT) - Đại Học Quốc Gia Thành Phố Hồ Chí Minh. Dự án này được thực hiện bởi hai sinh viên: Nguyễn Công Phi (19522006) và Lương Thiện Phước (19522055), dưới sự hướng dẫn của ThS. Đỗ Thị Thanh Tuyền. Mục tiêu chính là xây dựng một nền tảng nghe nhạc online với giao diện thân thiện và tính năng đa dạng, kết hợp các công nghệ hiện đại nhất. Dự án không chỉ cung cấp dịch vụ nghe nhạc mà còn tích hợp các công cụ hỗ trợ tập trung như todo list, timer và notes. Thời gian thực hiện từ ngày 5/9/2022 đến 31/12/2022, là một đồ án thực tế giúp sinh viên áp dụng kiến thức học tập vào thực tiễn.
1.1. Lý Do Chọn Đề Tài
Âm nhạc không chỉ mang đến sự thư giãn mà còn cải thiện chất lượng giấc ngủ, ngăn ngừa trầm cảm và tăng cường tập trung. Với sự phát triển công nghệ, người dùng ngày càng chuyển từ nghe nhạc truyền thống sang nền tảng web. Nhóm em nhận thấy nhu cầu của thị trường và muốn tạo ra một website nghe nhạc tích hợp nhiều tính năng hữu ích, lấy cảm hứng từ các nền tảng nổi tiếng như Zingmp3, Spotify và lofi.
1.2. Mục Tiêu Đề Tài
Dự án hướng đến việc xây dựng website nghe nhạc với giao diện tối ưu trải nghiệm người dùng. Tính năng chính bao gồm: đăng ký/đăng nhập, nghe nhạc với bình luận và yêu thích, tạo playlist, lịch sử nghe, hồ sơ người dùng, và các công cụ như todo list, timer, notes để tăng hiệu suất làm việc. Ngoài ra, hệ thống sẽ gửi thông báo khi người theo dõi đăng tải bài nhạc mới.
II. Công Nghệ Sử Dụng Trong Đồ Án
Để thực hiện đồ án website nghe nhạc, nhóm em lựa chọn một stack công nghệ hiện đại và phổ biến trong ngành. Phía frontend sử dụng ReactJS với ReduxToolkit để quản lý state, kết hợp với Ant Design và TailwindCSS cho giao diện đẹp. Phía backend sử dụng NodeJS với các framework như NestJS hoặc ExpressJS để xây dựng API mạnh mẽ. Bảo mật được đảm bảo thông qua JWT token, trong khi MongoDB và Redis được sử dụng để lưu trữ dữ liệu và caching. Stack công nghệ này được chọn vì khả năng mở rộng cao, hiệu suất tốt và là các công nghệ phổ biến trong thị trường.
2.1. Công Nghệ Frontend
ReactJS là nền tảng chính cho giao diện người dùng, cho phép xây dựng component tái sử dụng. ReduxToolkit giúp quản lý trạng thái ứng dụng một cách hiệu quả. Ant Design cung cấp các component UI chuyên nghiệp, trong khi TailwindCSS giúp styling nhanh chóng. Kết hợp này tạo nên một giao diện thân thiện và responsive trên tất cả thiết bị.
2.2. Công Nghệ Backend Database
NodeJS với NestJS/ExpressJS xử lý các request từ client và quản lý logic kinh doanh. MongoDB lưu trữ dữ liệu người dùng, bài hát và playlist, trong khi Redis cache dữ liệu để tăng tốc độ. JWT đảm bảo bảo mật xác thực người dùng, ngăn chặn truy cập trái phép.
III. Phạm Vi và Chức Năng Chính của Website Nghe Nhạc
Phạm vi đề tài tập trung vào môi trường web, không phát triển cho di động. Các chức năng chính bao gồm: hệ thống xác thực người dùng (đăng ký, đăng nhập, quên mật khẩu), tính năng nghe nhạc với bình luận, yêu thích, thêm nhạc mới, lịch sử nghe và tạo playlist cá nhân. Website cung cấp giao diện nghe nhạc tối ưu kết hợp với các công cụ hỗ trợ như todo list, timer, notes giúp người dùng tăng tập trung khi làm việc. Hồ sơ người dùng cho phép xem danh sách bài hát yêu thích, các bản nhạc đã upload hoặc cover. Hệ thống thông báo tự động khi người theo dõi đăng tải bài nhạc mới, tạo cộng đồng tương tác giữa người dùng.
3.1. Tính Năng Xác Thực và Hồ Sơ Người Dùng
Hệ thống đăng ký, đăng nhập bảo vệ bằng mã hóa mật khẩu và JWT token. Tính năng quên mật khẩu gửi link reset qua email. Hồ sơ người dùng hiển thị danh sách bài hát yêu thích, các bản nhạc được upload/cover và thống kê nghe nhạc. Thông báo theo thời gian thực khi người theo dõi có hoạt động mới, tạo mối liên kết giữa cộng đồng người dùng.
3.2. Tính Năng Nghe Nhạc và Công Cụ Hỗ Trợ
Trình phát nhạc chức năng đầy đủ: play, pause, skip, điều chỉnh âm lượng. Người dùng có thể bình luận, yêu thích, thêm vào playlist và xem lịch sử nghe. Tích hợp todo list, timer, notes trong cùng giao diện, cho phép người dùng làm việc hiệu quả hơn với sự hỗ trợ của âm nhạc. Playlist cá nhân giúp tổ chức bài hát theo chủ đề và tâm trạng.
IV. Đối Tượng Người Dùng và Phương Pháp Thực Hiện
Website nghe nhạc được thiết kế cho ba nhóm người dùng chính: những người yêu thích âm nhạc và dùng nó để thư giãn, những người ít nghe nhạc nhưng muốn khám phá, và những người dùng âm nhạc để tăng hiệu suất công việc. Phương pháp thực hiện bắt đầu bằng phân tích các nền tảng âm nhạc lớn như Spotify, Zingmp3 để xác định điểm mạnh yếu. Nhóm em sau đó thiết kế giao diện tối ưu trải nghiệm người dùng, tập trung vào tính thông dụng và tính thẩm mỹ. Quá trình phát triển chia thành các giai đoạn từ codebase, API backend đến frontend, với việc review code và cải thiện liên tục giữa hai thành viên nhóm.
4.1. Đối Tượng Sử Dụng Chính
Người thích nghe nhạc tìm kiếm nền tảng nghe nhạc chất lượng cao với thư viện bài hát đa dạng. Người ít nghe nhạc cần giao diện đơn giản, dễ sử dụng. Người làm việc/học tập cần âm nhạc kết hợp với công cụ tăng tập trung như todo list và timer. Mỗi nhóm đưa ra yêu cầu khác nhau, giúp nhóm em thiết kế tính năng toàn diện.
4.2. Phương Pháp Thiết Kế và Phát Triển
Nhóm em nghiên cứu thị trường để tìm hiểu các ứng dụng nghe nhạc hiện tại. Dựa trên phân tích, đề xuất các tính năng mới và cải tiến. Quá trình phát triển chia nhành rõ: một thành viên chủ trách frontend, người kia chủ trách backend. Cả hai thường xuyên review code, cộng tác để đảm bảo chất lượng. Việc tập trung vào design và UX giúp tạo ra sản phẩm thân thiện người dùng.
