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 20110258 20110710 20110664 20110684 Thành phố Hồ Chí Minh, Tháng năm 202 0 MỤC LỤC PHẦN 1: MỞ ĐẦU 1.1 Lý chọn đề ti 1.2.Mục tiêu đề ti .8 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 0 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 0 DANH SÁCH THÀNH VIÊN NHÓM ST T Họ Và Tên Tỷ lệ % tham gia Huỳnh Công Quyền Mã số sinh viên 20110258 Nguyn Thanh Sang 20110710 100% Lê Anh KiêtN 20110664 100% Võ Văn Nghĩa 20110684 100% 100% 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 0 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 0 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 0 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 0 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 0 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, 0 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 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 0 ● 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 0 ● 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 0 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 0 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 0 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âp.N 14 0 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 0 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 0 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 0 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 0 Hwnh 10 Giao diênykhi user đăng nhâpythà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 0 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 0 Đ_ 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 0 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 0 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 0 ... 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 0 1.3.Phươ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. .. 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