MÔN học NHẬP môn lập TRÌNH PYTHON CHO PHÂN TÍCH đ) tài xây D+NG WEB TRÌNH PHÁT NHẠC

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM KHOA CÔNG NGHỆ THÔNG TIN BÁO CÁO CUỐI KỲ MƠN HỌC: NHẬP MƠN LẬP TRÌNH PYTHON CHO PHÂN TÍCH Đ) TÀI : XÂY D+NG WEB TRÌNH PHÁT NHẠC HỌC KỲ – NĂM HỌC 2021 – 2022 MÃ MÔN HỌC: 212IPPA233277 Giảng viên hướng dẫn: Th.S Nguy n Văn Th nh NHÓM SINH VIÊN TH+C HIỆN: Huỳnh Công Quyền Nguy n Thanh Sang Lê Anh Kiệt Võ Văn Nghĩa Thành phố Hồ Chí Minh, Tháng năm 202 MỤC LỤC PHẦN 1: MỞ ĐẦU 1.1 Lý chọn đề t i 1.2.Mục tiêu đề t i 1.3.Phương pháp nghiên cứu đề t i PHẦN : NỘI DUNG 2.1 Giới thiệu framework C i đặt Django Windows 10 C i đặt Django Linux, Mac 10 2.2 Giao diện v chức 12 2.2.1 Giao diênNchOnh Web 12 2.2.2 Trending Songs 13 2.2.3 All Songs 14 2.2.4 Album 16 2.2.5.Search 16 2.2.6.Login 17 2.2.7.Personal List 19 PHẦN 3: KẾT LUẬN 22 Những điều đạt 22 Hướng cải tiến đề t i 22 PHẦN 4: TÀI LIỆU THAM KHẢO 23 PHỤ LỤC HÌNH ẢNH H^nh Mơ h^nh MVT Django H^nh Giao diênNchOnh Web 12 H^nh Trending Songs Web 13 H^nh Hi_n th` tat b i hát Web 14 H^nh Giao diênNkhi nghe b i hát 14 H^nh Hi_n t` Album Web 15 H^nh Hi_n th` kết Search b i hát 16 H^nh Giao diênNđăng nhâpNcho User 17 H^nh Giao diênNđăng kO cho User 17 H^nh 10 Giao diênNkhi user đăng nhâpNth nh công 18 H^nh 11 Giao diênNkhi thêm b i hát danh sách cá nhân 19 H^nh 12 Giao diênNhi_n th` danh sách b i hát cá nhân 20 H^nh 13 Giao diênNhi_n th` l`ch sd b i hát đe nghe 20 DANH SÁCH THÀNH VIÊN NHÓM ST T Họ Và Tên Huỳnh Công Quyền Nguy n Thanh Sang Lê Anh KiêtN Võ Văn Nghĩa BẢNG PHÂN CÔNG Họ Và Tên Võ Văn Nghĩa Nhiệm vụ T^m hi_u FrameWork Django, xây dựng giao diện b i hát, phát nhạc Xây dựng chức đưa tat b i hát v album b i hát T^m hi_u FrameWork Django, xây dựng chức đăng Lê Anh KiêtN kO, đăng nhập Xây dựng giao diện v chức yêu cầu cập nhật nhạc(upload) T^m hi_u FrameWork Django, xậy dựng chức t^m Nguy n Thanh Sang kiếm b i hát(Search), xây dựng giao diện v cập nhật xu hướng nhạc (trending songs) T^m hi_u FrameWork Django, chức thêm b i nhạc Huỳnh Công Quyền v o danh sách cá nhân Xây dựng chức xem l`ch sd nghe nhạc,tạo sở liệu,quản lO admin - Đánh giá kết quả: Các th nh viên ho n th nh nhiệm vụ thời hạn,ho n th nh nhiệm vụ tốt.Mặc dù có chút khó khăn tr^nh t^m hi_u kiến thức hỗ trợ từ bạn nhóm,cùng lớp đe ho n th nh đề t i thời hạn NHẬN XÉT CỦA GIẢNG VIÊN ● H^nh thức: …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… ……………………… ● Nội dung: …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… ……………………………………………… ● Đi_m: …… GIẢNG VIÊN ThS NGUYỄN VĂN THÀNH Lời nói đầu Lời đầu tiên, chúng em xin trân trọng cảm ơn v b y tỏ lòng biết ơn sâu sắc nhat tới thầy Nguyễn Văn Thành – Giảng viên khoa Công Nghệ thông Tin Trường Đại Học Sư Phạm Kỹ Thuật TPHCM, giáo viên hướng dẫn l m đề t i n y đe nhiệt t^nh hướng dẫn v bảo chúng em Chúng em xin trân th nh cảm ơn thầy cô giáo giảng dạy khoa Công Nghệ thông Tin Trường Đại Học Sư Phạm Kỹ Thuật TPHCM đe nhiệt t^nh ủng hộ, cung cap t i liệu v đưa ý kiến đóng góp quý báu đ_ nhóm em ho n th nh tốt đề t i m^nh! Xin chân thành cảm ơn! TP.Hồ Chí Minh, tháng năm 2022 Nhóm sinh viên Huỳnh Cơng Quyền Nguy n Thanh Sang Lê Anh KiêtN Võ Văn Nghĩa PHẦN 1: MỞ ĐẦU 1.1 Lý chọn đề tài Thời đại 4.0 nay, Công nghệ thông tin l ng nh h ng đầu, có nhiều bước phát tri_n nhanh chóng ứng dụng lĩnh vực Nó l phần khơng th_ thiếu sống văn minh, góp phần đẩy mạnh cơng cơng nghiệp hóa đại hóa đat nước Thơng qua máy vi tOnh với phần mềm hỗ trợ đe giúp quản lý , tổ chức, xếp v xd lý cơng việc cách nhanh chóng v hiệu Theo thống kê nay, ta thay 24.3 triệu người sd dung Internet to n giới Trong đó, Việt Nam l nước có tỷ lệ sd dụng đứng thứ 20 giới sd dụng mạng đ_ truy cập thông tin Âm nhạc online l loại thông tin t^m kiếm nhiều nhat chiếm 76% Nắm bắt thông tin , nhóm chúng em đe xây dựng tr^nh nghe nhạc trực tuyến web với mục đOch đem lại cho người yêu âm nhạc có trải nghiệm mới, đưa đến sản phẩm âm nhạc hay v phù hợp với đối tượng khách h ng Với yếu tố thuận lợi lẫn ngo i, với tiềm phát tri_n âm nhạc Việt Nam , chúng em tin l đề t i có tiềm phát tri_n Đ_ học hỏi v hi_u rõ Python ngôn ngữ khác, chúng em hy vọng l đề t i phù hợp vừa nâng cao kiến thức vừa đem đến sản phẩm mang giúp người nghe nhạc thư giản sau l m mệt mỏi 1.2.Mục tiêu đề tài Xây dựng Website Tr^nh Phát Nhạc Nghiên cứu, học học Framework : Django,… Vận dụng kiến thức ngôn ngữ Python 1.3.Phương pháp nghiên cứu đề tài T^m hi_u v ứng dụng ngôn ngữ Python Sd dụng sở liệu đ_ lưu trữ v trOch xuat T^m hi_u công nghệ hỗ trợ:Django Framework, Html, Http, CSS PHẦN : NỘI DUNG 2.1 Giới thiệu framework Web tr^nh phát nhạc viết dựa Django - framework hỗ trợ Python lâpNtr^nh web - Django l framework bậc cao Python có th_ thúc đẩy việc phát tri_n phần mềm thần tốc v clean, thiết kế thực dụng Được xây dựng nhiều lập tr^nh viên kinh nghiệm, Django tập trung lớn van đề phát tri_n Web, bạn có th_ phát tri_n trang web bạn m không cần xây dựng từ - Những lợi Django: ● Hoàn thiện: Django phát tri_n theo tư tưởng "Batteries included" (có th_ hi_u ý nghĩa l tOch hợp to n bộ, cần gọi m dùng) Nó cung cap thứ cho developer không cần phải nghĩ phải dùng ngo i Chúng ta cần tập trung v o sản phẩm, tat hoạt động liền mạch với ● Đa năng: Django có th_ dùng đ_ xây dựng hầu hết loại website, từ hệ thống quản lý nội dung, trang mạng xe hội hay web tin tức Nó có th_ l m việc với framework client-side, v chuy_n nội dung hầu hết loại format (HTML, RESS, JSON, XML, ) ● Bảo mật: Django giúp developer coi trọng lỗi bảo mật thông thường cách cung cap framework có kĩ thuật "phải l m vậy" đ_ bảo vệ website VO dụ: Django cung cap bảo mật quản lý tên t i khoản v mật khẩu, tránh lỗi đ_ thơng tin session lên cookie, me hóa mật thay v^ lưu thẳng ● Dễ Scale: Django sd dụng kiến trúc shared-nothing dựa v o component (mỗi phần kiến trúc độc lập với nhau, v có th_ thay sda đổi cần thiết) Có chia tách rõ r ng phần nghĩa l có th_ scale cho việc gia tăng traffic cách thêm phần cứng cap độ: caching, servers, database servers, application servers Nhiều web kinh doanh đe th nh công Django scale đáp ứng yêu cầu họ ● Dễ maintain: code Django viết theo nguyên tắc thiết kế v pattern có th_ khuyến khOch ý tưởng bảo tr^ v tái sd dụng code Trên thực tế, theo khái niệm Don't Repeat Yourself l m cho khơng có lặp lại không cần thiết, giảm lượng code ● Tính linh động: Django viết Python, có th_ chạy đa tảng Nó có nghĩa bạn không r ng buộc platform server cụ th_ Django hỗ trợ tốt nhiều nh cung cap hosting, họ cung cap hạ tầng v t i liệu cụ th_ cho hosting web Django Hwnh Mô hwnh MVT Django - Cài đătyDjango Ta c i đặt Django tr^nh lệnh pip Python C i đặt Django Windows ● Nhan tổ hợp phOm Window + R, ● Gõ cmd nhan enter đ_ mở cda sổ terminal, sau gõ: pip install django C i đặt Django Linux, Mac ● Tổ hợp phOm Ctrl + Alt + T để mở Terminal ● Gõ: sudo apt-get install python3-django Mô h^nh kiến trúc MVT Django xác đ`nh cau trúc v h nh vi liệu bạn muốn lưu trữ thông qua trang web m^nh Mỗi mô h^nh Django bạn tạo tạo bảng sở liệu tương ứng, thuộc tOnh mơ h^nh trở th nh trường bảng Cau trúc tệp dự án Django mẫu có mysite/ mysite/ _pycache_ _init_.py asgi.py settings.py urls.py wsgi.py migration _init_.py admin.py apps.py models.py test.py views.py db.sqlite3 manage.py Những file n y có chức riêng v cụ th_ sau: ● init .py l file rỗng đ`nh việc đường dẫn folder n y xem l Python package 10 ● settings.py l file chứa settings project Trong file n y chứa setting DEBUG, ALLOWED_HOSTS, INSTALLED_APP, DATABASES, ● urls.py l file khai báo URL project (ki_u routing, với đ`a n o th^ thực thi h m n o) ● wsgi.py l file dùng deploy project lên server ● manage.py l file đ_ tạo app, migrate, - Đề t i xây dựng mô h^nh MVT (Model,Template,View) - Model : L m việc với sở liệu - Template: Hi_n th` giao diênN - View: Xd lý logic 2.2 Giao diện chức 2.2.1 Giao diêny Web Trên m n h^nh giao diện gồm chức sau - Home: Chuy_n đến giao diênNchOnh Web - All Songs: Hi_n th` tat b i hát từ CSDL - Album: Hi_n th` album b i hát theo th_ loại từ CSDL - Search: T^m kiếm b i hát - Login/Signup: Đăng nhâpNv đăng kO 11 Hwnh Giao diên ychính Web 2.2.2 Trending Songs Thông qua việc phân tOch liệu v ki_m tra liệu truy cập.Những b i hát Trending hi_n th` giao diênNchOnh l b i hát có số lượng 12 nghe bật Hwnh Trending Songs Web 2.2.3 All Songs Web có th_ truy câpNv o tat b i hát từ CSDL click v o All Songs header - Đ_ xem danh sách b i hát, người dùng click v o All Songs header đ_ xem - Xây dựng All Sóng việc áp dụng lưu trữ trOch xuat CSDL SQLite 13 Hwnh Hiển th€ t•t hát Web - Khi người dùng nhan v o Nút Listen th^ v o giao diênNv có th_ nghe b i hát m^nh chọn Hwnh Giao diên ykhi nghe hát Trên m n h^nh lúc n y hi_n th` b i hát chọn.Thông tin b i hát gồm tên ca sĩ/nhóm nhạc , link MV v dowload Nếu muốn thêm b i hát v o danh sách cá nhân th^ cần phải đăng nhâpN 14 2.2.4 Album - L nơi tập hợp b i hát theo chủ đề/th_ loại :Nhạc việt, H n, Us-Uk - Đ_ truy cập v o Album ta click v o Album header Hwnh Hiển t€ Album Web 2.2.5 Search - Search l công cụ hỗ trợ cho người dùng t^m kiếm tên b i hát, ca sĩ theo ý muốn, giúp người dùng đỡ tốn thao tác t^m kiếm b i hát muốn nghe - Đ_ t^m kiếm b i hát /ca sĩ ta cần điền v o textBox Search header h^nh bên 15 Hwnh Hiển th€ kết Search hát H^nh ảnh l vO dụ cho t^m kiếm b i hát có tên l Nevada 16 2.2.6 Login, SignUp Ngo i Web thiết kế chức Login cho người dùng: Hwnh Giao diên yđăng nhâpy cho User - Nếu người dùng chưa có t i khoản th^ c n nhan v o chữ SignUp phần đăng nhập đ_ tạo t i khoản 17 Hwnh Giao diên yđăng kí cho User Ở phần giao diện gồm có chức sau: - UserName - FirstName - LastName - Email address - PassWord Khi đe đăng nhâpNth nh cơng th^ Web có giao diênNnhư sau: 18 Hwnh 10 Giao diênykhi user đăng nhâpy thành cơng Khi đe đăng nhâpNth^ Web có chức tương tự user chưa đăng nhâpNl xem tat b i hát hay l Album b i hát theo th_ loại, t^m kiếm b i hát theo tên b i hát Ngo i ra, sau đăng nhập th^ có thêm chức Personal List, History 2.2.7 Personal List - L nơi lưu trữ danh sách nhạc nhân m người dùng thêm v o - Đ_ thêm b i hát v o danh sách cá nhân, ta v o nhan v o Listen b i hát cần thêm.Tại giao diện phát nhạc ta chọn Add to PersonalList - Sau thêm nhạc th nh công người dùng nhận thông báo h^nh bên 19 Hwnh 11 Giao diên ykhi thêm hát danh sách cá nhân Lưu ý: Đ_ thêm nhạc v o danh sách cá nhân , người dùng cần phải đăng nhập 20 Đ_ xem lại b i hát m^nh đe chọn người dùng cần nhat v o PersonalList header Sau nhan th^ thay danh sách nhạc m^nh h^nh bên Hwnh 12 Giao diên yhiển th€ danh sách hát cá nhân Ngo i cịn có th_ xem lại l`ch sd b i m^nh đe nghe cách nhan v o History Header (chỉ đăng nhập người dùng xem được) 21 Hwnh 13 Giao diên yhiển th€ l€ch s‡ hát nghe PHẦN 3: KẾT LUẬN Những điều đạt - Hi_u cách vận h nh server website - Cách l m việc với database website Kết hợp nhiều website lớn đ_ tạo giao diện html, css bootstrap, bootdey, codepen tiết kiệm thời gian code L m việc nhóm hiệu Hướng cải tiến đề tài - Vận dụng hiệu website đ_ phát tri_n giao diện - Tiếp tục phát tri_n tOnh website theo nhu cầu người dùng Hosting website đ_ tiếp cận người dùng Cải tiến Searching 22 PHẦN 4: TÀI LIỆU THAM KHẢO https://viblo.asia/p/tim-hieu-ve-django-framework-ho-tro-python- trong-lap-trinh-web-QpmlexbkZrd https://howkteam.vn/course/gioi-thieu-ve-python-django/gioi-thieu-ve- python-django-1515 https://getbootstrap.com/ https://www.section.io/engineering-education/how-to-build-a-music- player-using-django/? fbclid=IwAR0qbamXPH3WDgSzZCxrkK4G3MEnMQKHJa0QTluu oplOcPiaXDvYDeDRTZc 23 ... nghe nhạc thư giản sau l m mệt mỏi 1.2.Mục tiêu đề tài Xây dựng Website Tr^nh Phát Nhạc Nghiên cứu, học học Framework : Django,… Vận dụng kiến thức ngôn ngữ Python 1.3.Phương pháp nghiên cứu đề tài. .. thông tin Âm nhạc online l loại thông tin t^m kiếm nhiều nhat chiếm 76% Nắm bắt thơng tin , nhóm chúng em đe xây dựng tr^nh nghe nhạc trực tuyến web với mục đOch đem lại cho người yêu âm nhạc có trải... phẩm âm nhạc hay v phù hợp với đối tượng khách h ng Với yếu tố thuận lợi lẫn ngo i, với tiềm phát tri_n âm nhạc Việt Nam , chúng em tin l đề t i có tiềm phát tri_n Đ_ học hỏi v hi_u rõ Python