Đồ án tìm hiểu flask và xây dựng web bán phim online kết hợp khuyến nghị sản phẩm

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM Nguyễn Hoàng Thái Dương 19521409 Nguyễn Âu Duy 19521423 ĐỒ ÁN MÃ 19 Tìm hiểu Flask Xây dựng Web bán phim online kết hợp Khuyến nghị sản phẩm GIẢNG VIÊN GIẢNG DẠY TS Nguyễn Hồng Thủy TP HỒ CHÍ MINH, 2022 LỜI CẢM ƠN Nhóm xin gửi lời cảm ơn chân thành đến Cô Nguyễn Hồng Thủy tận tình hướng dẫn chúng em suốt thời gian vừa qua bạn học góp ý giúp đỡ nhóm q trình thực đồ án Do kiến thức thời gian thực hạn chế, đồ án nhóm cịn nhiều thiếu sót Nhóm mong nhận góp ý Cơ bạn để đồ án nhóm hồn thiện MỤC LỤC Chương GIỚI THIỆU CHUNG 1.1 Lý chọn đề tài 1.2 Tổng quan chức Chương CƠ SỞ LÝ THUYẾT 2.1 ReactJs 2.1.1 Giới thiệu 2.1.2 Các khái niệm React (ReactJs) .3 2.1.3 Cách hoạt động 10 2.1.4 Nhược điểm .10 2.1.5 Ưu điểm Tại nên dùng ReactJs .11 2.1.6 Các framework-package liên quan đến ReactJs 12 2.2 Spring boot .21 2.2.1 Khái niệm 21 2.2.2 Nhược điểm Spring Boot 21 2.2.3 Ưu điểm Spring Boot 22 2.2.4 Các thư viện sử dụng Spring Boot 22 2.2.5 Xây dựng back-end cho đồ án Spring Boot 26 2.3 Flask .28 2.3.1 Tổng quan Python 28 2.3.2 Độ phổ biến năm 2022 29 2.3.3 Ứng dụng Python 29 2.3.4 Ưu điểm 32 2.3.5 Nhược điểm .32 2.3.6 Flask framework 32 2.3.7 Flask API 38 2.4 Machine Learning 41 2.4.1 Giới thiệu 41 2.4.2 User 42 2.4.3 User có rates 43 2.5 Frameworks tools khác 46 2.5.1 Intellij .46 2.5.2 Visual Studio Code 46 2.5.3 Postman 47 2.5.4 Microsoft SQL Server 47 2.5.5 Github 48 2.5.6 Ngôn ngữ Java 49 2.5.7 Ngôn ngữ thiết kế Web HTML-CSS-Javascript 49 2.5.8 Bootstrap 51 Chương XÂY DỰNG HỆ THỐNG 52 3.1 Xây dựng kiến trúc hệ thống 52 3.1.1 Sơ đồ hệ thống 52 3.1.2 Sơ đồ use case 53 3.1.3 Sơ đồ lớp 55 3.1.4 Sơ đồ 56 3.1.5 Cơ sở liệu 71 3.2 Thiết kế giao diện 75 3.2.1 Giao diện ứng dụng 75 3.2.2 Giao diện quản lý .83 Chương KẾT LUẬN .89 4.1 Kết đạt .89 4.2 Ưu điểm 89 4.3 Nhược điểm giải pháp 89 DANH MỤC HÌNH Hình 2-1 Mơ hình DOM ứng dụng ReactJs _4 Hình 2-2 Ví dụ JSX Hình 2-3 Component _6 Hình 2-4 Ví dụ props _7 Hình 2-5 Component Lifecycle _8 Hình 2-6 Dữ liệu số người dùng Framework 12 Hình 2-7 Ví dụ useState 13 Hình 2-8 Ví dụ useEffect _13 Hình 2-9 Thiết lập chuyển trang React Router 15 Hình 2-10 Ví dụ cách dùng useNavigate _16 Hình 2-11 Ví dụ cách dùng useLocation _16 Hình 2-12 Ví dụ cách lấy params _17 Hình 2-13 Cách dùng thẻ Link _18 Hình 2-14 Mơ hình Redux 19 Hình 2-15 Các thành phần Slice, AsyncThunk ReduxToolkit 20 Hình 2-16 Hibernate: hàm tương ứng có anotation query câu lệnh query tương ứng 23 Hình 2-17 Ví dụ việc sử dụng anotation _24 Hình 2-18 Cấu trúc Backend đồ án. 26 Hình 2-19 Python _28 Hình 2-20 Python Google Trend _29 Hình 2-21 Python TIOBE 29 Hình 2-22 Thư viện Python hỗ trợ Web 30 Hình 2-23 Tổng quan ứng dụng Python 30 Hình 2-24 Python Machine Learning _31 Hình 2-25 Jinja2 template 34 Hình 2-26 Cấu trúc Flask project _35 Hình 2-27 Flask Routing _36 Hình 2-28 Flask static _37 Hình 2-29 Flask secret key 37 Hình 2-30 Cấu trúc Flask API project _39 Hình 2-31 Khởi tạo Flask API Project _40 Hình 2-32 Ví dụ cho việc thực API model 40 Hình 2-33 Load model mẫu _41 Hình 2-34 Content – based ý tưởng _44 Hình 2-35 Collaborative – filtering ý tưởng 45 Hình 2-36 Intellij _46 Hình 2-37 Víual Studio Code 46 Hình 2-38 Postman 47 Hình 2-39 SQL Server _47 Hình 2-40 Github _48 Hình 2-41 Java _49 Hình 2-42 HTML-CSS-Javascript 50 Hình 2-43 Bootstrap _51 Hình 3-1 Sơ đồ kiến trúc hệ thống 52 Hình 3-2 Sơ đồ use cases người dùng _53 Hình 3-3 Sơ đồ use cases hệ thống _54 Hình 3-4 Sơ đồ lớp 55 Hình 3-5 Sơ đồ đăng nhập 56 Hình 3-6 Sơ đồ đăng ký 57 Hình 3-7 Sơ đồ chỉnh sửa thông tin _58 Hình 3-8 Sơ đồ xóa tài khoản _59 Hình 3-9 Sơ đồ tạo tài khoản nhân viên 60 Hình 3-10 Sơ đồ tạo phân loại _61 Hình 3-11 Sơ đồ sửa phân loại _62 Hình 3-12 Sơ đồ xóa phân loại 63 Hình 3-13 Sơ đồ tạo phim 64 Hình 3-14 Sơ đồ sửa thông tin phim 65 Hình 3-15 Sơ đồ xóa phim 66 Hình 3-16 Sơ đồ mua hàng _67 Hình 3-17 Sơ đồ tình trạng đơn hàng 68 Hình 3-18 Sơ đồ thêm hàng vào giỏ 69 Hình 3-19 Sơ đồ xóa hàng khỏi giỏ _70 Hình 3-20 Sơ đồ Database 71 Hình 3-21 Trang chủ slider _75 Hình 3-22 Giao diện đầu trang 75 Hình 3-23 Giao diện trang chủ với phim bán chạy 76 Hình 3-24 Trang chủ phim phổ biến _76 Hình 3-25 Giao diện danh sách phim 77 Hình 3-26 Giao diện chi tiết sản phẩm thông tin _78 Hình 3-27 Giao diện chi tiết sản phẩm gợi _79 Hình 3-28 Giao diện giỏ hàng _80 Hình 3-29 Giao diện thông tin khách 80 Hình 3-30 Giao diện đặt hàng _81 Hình 3-31 Giao diện đăng nhập 82 Hình 3-32 Giao diện đăng ký 82 Hình 3-33 Dashboard 83 Hình 3-34 Dashboard 83 Hình 3-35 Dashboard 84 Hình 3-36 Giao diện sản phẩm _84 Hình 3-37 Giao diện tạo sản phẩm phim _85 Hình 3-38 Giao diện chỉnh sửa sản phẩm 85 Hình 3-39 Giao diện phân loại _86 Hình 3-40 Giao diện đơn hàng _86 Hình 3-41 Giao diện chi tiết đơn hàng _87 Hình 3-42 Giao diệ khách hàng 87 Hình 3-43 Giao diện nhân viên 88 Hình 3-44 Giao diện tạo nhân viên _88 ... xử lý tác vụ logic, kết nối Database, để xây dựng ứng dụng Web bán quần áo online Ngồi nhóm cịn kết hợp ứng dụng Machine Learning cho website thông qua việc sử dụng Framework Flask Python hỗ trợ... tin phim 65 Hình 3-15 Sơ đồ xóa phim 66 Hình 3-16 Sơ đồ mua hàng _67 Hình 3-17 Sơ đồ tình trạng đơn hàng 68 Hình 3-18 Sơ đồ thêm hàng vào... diện trang chủ với phim bán chạy 76 Hình 3-24 Trang chủ phim phổ biến _76 Hình 3-25 Giao diện danh sách phim 77 Hình 3-26 Giao diện chi tiết sản phẩm thông tin