ĐỀ tài xây DỰNG WEBSITE KPOP STORE

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN & TRUYỀN THÔNG VIỆT HÀN ĐỒ ÁN TỐT NGHIỆP BÁO CÁO ĐỒ ÁN TỐT NGHIỆP ĐỀ TÀI XÂY DỰNG WEBSITE KPOP STORE Sinh viên thực hiện: HUỲNH TẤN PHƯỚC Lớp: 19I1 Giảng viên hướng dẫn: ThS Dương Thị Mai Nga Đà Nẵng, tháng 11 năm 2021 TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN & TRUYỀN THÔNG VIỆT HÀN ĐỒ ÁN TỐT NGHIỆP BÁO CÁO ĐỒ ÁN TỐT NGHIỆP ĐỀ TÀI XÂY DỰNG WEBSITE KPOP STORE Sinh viên thực : HUỲNH TẤN PHƯỚC Lớp: 19I1 Giảng viên hướng dẫn: ThS Dương Thị Mai Nga Đà Nẵng, tháng 11 năm 2021 LỜI NĨI ĐẦU Ngày Âm Nhạc có bước phát triển mạnh mẽ theo chiều rộng chiều sâu Thị Trường Âm Nhạc khơng cịn thứ q mà ngày trở thành lối sống giải trí thơng dụng người không cộng đồng mà gia đình Đứng trước vai trị thơng tin hoạt động cạnh tranh gay gắt, tổ chức doanh nghiệp tìm biện pháp để xây dựng hồn thiện hệ thống thơng tin nhằm tin học hóa hoạt động tác vụ đơn vị Hiện công ty sản xuất đĩa(album) hàng đầu giới không ngừng đầu tư cải thiện giải pháp sản phẩm nhằm cho phép tiến hành thương mại hóa internet Thơng qua sản phẩm này, dễ nhận tầm quan trọng tính tất yếu thị trường âm nhạc Với thao tác đơn giản máy có nối mạng internet bạn có tầm tay mà cần mà khơng phải nhiều thời gian Bạn cần vào trang dịch vụ chuyên bán mặt hàng đĩa than , album , làm theo hướng dẫn click vào bạn cần Các nhà dịch vụ mang đến tận nhà cho bạn Ở Việt Nam có nhiều doanh nghiệp tiến hành thương mại hóa Internet khó khăn sở hạ tầng viễn thông chưa phát triển mạnh, dịch vụ toán điện tử qua ngân hàng chưa phổ biến nên dừng lại mức độ giới thiệu sản phẩm tiếp cận đơn hàng thông qua web Để tiếp cận đóng góp đẩy mạnh phổ biến thị trường âm nhạc việt nam, em tìm hiểu cài đặt ‘ Website bán hàng kpop store Laravel’ Với hướng dẫn tận tình cơ: Dương Thị Mai Nga em hoàn thành báo cáo đồ án tốt nghiệp Tuy cố gắng tìm hiểu, phân tích thiết kế cài đặt hệ thống chắn không tránh khỏi đc thiếu sót Em mong thơng cảm góp ý q thầy Em xin chân thành cảm ơn Qua cho phép em bày tỏ lòng biết ơn đến dạy dỗ bảo thầy, cô khoa Đặc biệt cô Dương Thị Mai Nga, người trực tiếp hướng dẫn, bảo giúp đỡ em thời gian đồ án Tốt nghiệp Em xin chân thành cảm ơn hướng dẫn tận tình TĨM TẮT ĐỒ ÁN Với mức độ phức tạp quy mô ứng dụng, cộng thêm vấn đề thời gian đề tài “Xây Dựng Website Kpop Store LARAVEL” dừng mức tìm hiểu lập trình Web LARAVEL & MYSQL, áp dụng xây dựng ứng dụng thực nghiệm trang Web bán hàng mạng cho cửa hàng thời trang Website với mục đích cung cấp cho khách hàng thơng tin xác sản phẩm thời trang có thị trường cách thức đặt mua hàng qua mạng Các thông tin cập nhật thường xun nhanh chóng Vì vậy, rút ngắn khoảng cách người mua người bán, đưa thông tin sản phẩm nhanh chóng đến cho khách hàng Do số hạn chế, nên website dừng lại chức đặt hàng hình thức toán trực tiếp Trong tương lai, hệ thống phát triển theo hướng thương mại điện tử (với hình thức tốn trực tuyến qua thẻ tín dụng, tài khoản ngân hàng, thẻ mua hàng trực tuyến…) Do giới hạn việc trình bày văn nên báo cáo này, em xin trình bày số khâu quan trọng, từ khảo sát, đến phân tích, thiết kế, cài đặt cho hệ thống Rất mong nhận cảm thông Quý Thầy Cô bạn MỤC LỤC LỜI NÓI ĐẦU TÓM TẮT ĐỒ ÁN DANH SÁCH BIỂU ĐỒ DANH SÁCH HÌNH ẢNH PHẦN MỞ ĐẦU CHƯƠNG I TÌM HIỂU LARAVEL VÀ MYSQL I LARAVEL Khái niệm LARAVEL Tại nên dùng LARAVEL Giới thiệu LARAVEL 10 Cơ sở liệu MYSQL 19 II Giới thiệu sở liệu 19 Mục đích sử dụng sở liệu 19 CHƯƠNG II PHÂN TÍCH THIẾT KẾ HỆ THỐNG 20 Phân tích yêu cầu đề tài 20 I Người dùng 20 Người quản lý 24 Phân tích thiết kế hệ thống 28 II Khảo sát trạng 28 Xác định tác nhân chức website 29 Đặc tả ca sử dụng 36 Biểu đồ ca sử dụng 45 Biểu đồ lớp chi tiết 64 Các bảng liệu 65 Một số bảng liệu cho module giao diện 68 CHƯƠNG III THIẾT KẾ TRANG WEB BÁN ALBUM KPOPS & KẾT QUẢ ĐẠT ĐƯỢC 70 I Giao diện trang khách hàng 70 II Giao diện phần quản lý 73 III Các chức bật 74 CHƯƠNG IV KẾT LUẬN 79 TÀI LIỆU THAM KHẢO 80 DANH SÁCH BIỂU ĐỒ Biểu đồ Biểu đồ usecase mức tổng quát 31 Biểu đồ Biểu đồ usecase cho tác nhân khách hàng 31 Biểu đồ Biểu đồ usecase tác nhân quản lý hệ thống 32 Biểu đồ Biểu đồ usecase ca sử dụng quản lý giỏ hàng 32 Biểu đồ Biểu đồ usecase ca sử dụng quản lý sản phẩm 33 Biểu đồ Biểu đồ usecase cho ca sử dụng đăng nhập 34 Biểu đồ Biểu đồ usecase cho ca sử dụng thêm vào giỏ hàng 34 Biểu đồ Biểu đồ usecase cho ca sử dụng toán 34 Biểu đồ Biểu đồ usecase cho ca sử dụng cập nhật giỏ hàng 35 Biểu đồ 10 Biểu đồ Usecase cho ca sử dụng xóa hàng giỏ 35 Biểu đồ 11 Biểu đồ usecase ca sử dụng thêm sản phẩm 35 Biểu đồ 12 Biểu đồ usecase cho ca sử dụng xóa sản phẩm 36 Biểu đồ 13 Biểu đồ lớp tham gia ca sử dụng đăng nhập 45 Biểu đồ 14 Biểu đồ trình tự đăng nhập 45 Biểu đồ 15 Biểu đồ trang thái đăng nhập 46 Biểu đồ 16 Biểu đồ hoạt động ca đăng nhập 46 Biểu đồ 17 Biểu đồ lớp tham gia ca sử dụng thêm vào giỏ hàng 47 Biểu đồ 18 Biểu đồ trình tự thêm vào giỏ hàng 47 Biểu đồ 19 Biểu đồ trạng thái thêm vào giỏ hàng 48 Biểu đồ 20 Biểu đồ hoạt động thêm vàogiỏ hàng 48 Biểu đồ 21 Biểu đồ lớp tham gia ca sử dụng cập nhật giỏ hàng 49 Biểu đồ 22 Biểu trình tự cập nhật giỏ hàng 49 Biểu đồ 23 Biểu đồ trạng thái cập nhật giỏ hàng 50 Biểu đồ 24 Biểu đồ hoạt động cập nhập giỏ hàng 50 Biểu đồ 25 Biểu đồ lớp tham gia ca sử dụng xóa hàng giỏ 51 Biểu đồ 26 Biểu đồ trình tự xóa hàng giỏ 51 Biểu đồ 27 Biểu đồ lớp tham gia ca sử dụng thêm sản phẩm 52 Biểu đồ 28 Biểu đồ đồ trình tự ca sử dụng thêmsản phẩm 52 Biểu đồ 29 Biểu đồ trang thái cho ca sử dụng thêm sản phẩm 53 Biểu đồ 30 Biểu đồ hoat động cho ca sử dụng thêm sản phẩm 53 Biểu đồ 31 Biểu đồ lớp tham gia ca sử dụng sửa sản phẩm 54 Biểu đồ 32 Biểu đồ trình tự cho ca sử dụng sửa sản phẩm 54 Biểu đồ 33 Biểu đồ trang thái cho ca sử dụng sửa sản phẩm 55 Biểu đồ 34 Biểu đồ hoạt động cho ca sử dụng sửa sản phẩm 55 Biểu đồ 35 Biểu đồ lớp tham gia ca sử dụng xóa sản phẩm 56 Biểu đồ 36 Biểu đồ trình tự cho ca sử dụng xóa sản phẩm 56 Biểu đồ 37 Biểu đồ trạng thái cho ca sử dụng xóa sản phẩm 57 Biểu đồ 38 Biểu đồ hoạt động cho ca sử dụng xóa sản phẩm 57 Biểu đồ 39 Biểu đồ lớp chi tiết 64 DANH SÁCH HÌNH ẢNH Hình Giao diện trang chủ 70 Hình Giao diện trang giới thiệu sản phẩm 71 Hình Giao diện giỏ hàng 71 Hình Giao diện đăng ký thành viên 72 Hình Giao diện footer 72 Hình Giao diện đăng nhập quản lý 73 Hình Giao diện trang chủ quản trị 73 Hình Chức đặt hàng 74 Hình Chức quản lý giỏ hàng 75 Hình 10 Chức thống kê số lượt xem sản phẩm 75 Hình 11 Chức thống kê sản phẩm quan tâm khách hàng đặt mua 76 Hình 12 Chức Liệt kê sản phẩm loại 76 Hình 13 Chức gửi email hóa đơn cho khách hàng 77 Hình 14 Chức toán trực tuyến 78 NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN Sinh Viên Huỳnh Tấn Phước PHẦN MỞ ĐẦU Với mức độ phức tạp quy mô ứng dụng, cộng thêm vấn đề thời gian đồ án dừng mức tìm hiểu lập trình web LARAVEL & MYSQL, áp dụng xây dựng ứng dụng thực nghiệm trang Web bán hàng mạng cho cửa hàng albums Website với mục đích cung cấp cho khách hàng thơng tin xác sản phẩm thời trang có thị trường cách thức đặt mua hàng qua mạng Các thông tin cập nhật thường xun nhanh chóng Vì vậy, rút ngắn khoảng cách người mua người bán, đưa thông tin sản phẩm nhanh chóng đến cho khách hàng Đồ án thực gồm chương: Chương I Tìm hiểu LARAVEL MYSQL Bước đề làm website phải hiểu chất ngơn ngữ dùng để lập trình Ở chương đồ án tập trung giới thiệu LARAVEL hệ sở liệu MYSQL Cung cấp kiến thức lập trình LARAVEL Chương II Phân tích thiết kế hệ thống Để có hệ thống bán hàng tiến tiến, hợp lý nhà thiết kế ln phải lên kế hoạch, phân tích hệ thống từ nhiều phía để mang lại hợp lý thống cho hệ thống Chương phân tích yêu cầu đề bài, thiết kế hệ thống sở lý thuyết từ giúp ta có nhìn tổng qt hệ thống Giúp cho việc thiết kế thực tế dễ dàng Chương III Thiết kế sở liệu Từ phân tích, thiết kế chương 3, hệ thống sở liệu lập để lưu trữ thông tin cần thiết cho việc thiết kế hệ thống Và cho ta thấy rõ mối quan hệ sỡ liệu lập Chương IV Thiết kế trang web bán hàng Albums Áp kiến thức bước phân tích lý thuyết, chương công đoạn thiết kế dự án thực tế Hướng dẫn cho khách hàng cách sử dụng hệ thống thực tế, cách mua hàng, toán điều khoản mua hàng CHƯƠNG I TÌM HIỂU LARAVEL VÀ MYSQL Để có kiến thức tảng cho việc lập trình website thực tế, chương giúp giải việc I LARAVEL Khái niệm LARAVEL Được phát triển dựa mơ hình MVC, Laravel PHP Framework mã nguồn mở miễn phí với cú pháp rõ ràng, mạch lạc Như chia sẻ viết trước, Framework “Software Framework” (tạm dịch: khung phần mềm) “bộ khung” cung cấp đa số kiểu mẫu thiết kế phù hợp với ứng dụng bạn thực hiện, thư viện, API, trình biên dịch Framework cấu thành từ đoạn code MVC (Model-View-Controller) mơ hình phân bố source code thành phần Mỗi thành phần có nhiệm vụ riêng biệt độc lập với thành phần khác Cụ thể là: Model : Đây nơi chứa nghiệp vụ tương tác với liệu hệ quản trị sở liệu (mysql, mssql…) Thành phần Model bao gồm class/function xử lý nhiều nghiệp vụ kết nối database, truy vấn liệu, thêm – xóa – sửa liệu, … View : Đây nơi chứa giao diện nút bấm, khung nhập, menu, hình ảnh, … Thành phần View đảm nhiệm nhiệm vụ hiển thị liệu giúp người dùng tương tác với hệ thống Controller : Đây nơi tiếp nhận yêu cầu xử lý gửi từ người dùng Thành phần Controller gồm class/ function xử lý nhiều nghiệp vụ logic giúp lấy liệu thông tin cần thiết hiển thị liệu cho người dùng qua lớp View Alison.com, Barchart.com, … nhiều trang web lớn giới phát triển tảng Laravel Tại Việt Nam, Laravel sử dụng phổ biến với cộng đồng rộng lớn chiếm tỷ lệ 70% người dùng Tại nên dùng LARAVEL Để thiết kế Web động có nhiều ngơn ngữ lập trình khác để lựa chọn, cấu hình tính khác chúng vẵn đưa kết giống Chúng ta lựa chọn cho : ASP, LARAVEL, Java, Perl số loại khác Vậy lại nên chọn LARAVEL Rất đơn giản, có lí sau mà lập trình Web khơng nên bỏ qua lựa chọn tuyệt vời LARAVEL sử dụng làm Web động nhanh, dễ dàng, tốt so với giải pháp khác LARAVEL có khả thực tích hợp chặt chẽ với hầu hết sở liệu có sẵn, tính linh động, bền vững khả phát triển không giới hạn 10 c Biểu đồ trạng thái Biểu đồ 30 Biểu đồ trang thái cho ca sử dụng thêm sản phẩm d Biểu đồ hoạt động Biểu đồ 31 Biểu đồ hoat động cho ca sử dụng thêm sản phẩm 50 Biểu đồ lớp chi tiết Biểu đồ 52 Biểu đồ lớp chi tiết Để có hệ thống đạt u cầu khơng thể bỏ qua việc thiết kế sở liệu Thiết kế cho hợp lý, cho yêu cầu hệ thống chương sau vào việc vạch hệ thống sở liệu phục vục cho thiết kế Các bảng liệu Thực ánh xạ từ biểu đồ lớp sang CSDL quan hệ bảng liệu sau: 6.1 Bảng liệu khách hàng Name ID email Type Int Varchar(255) Null No No Chú thích Mã khách hàng Tên khách hàng Google_id password name avatar Remember_token Level Varchar(255) Varchar(255) Varchar(255) Varchar(255) Varchar(255) Tinyin (4) No No No Yes No No Địa khách hàng Địa khách hàng Địa khách hàng Số điện thoại khách hàng Ghi nhớ đăng nhập 51 6.2 Bảng hóa đơn mua hàng Name ID IDKhachHang NgayMua ThanhTien Type Int Int DateTime) Varchar(255) Null No No No No Chú thích Mã hóa đơn mua hàng Tên khách hàng Ngày mua hàng Tổng tiền mua hàng TinhTrangHD Int No Tình trạng hóa đơn Null No No No No No Chú thích Mã chi tiết hóa đơn Mã sản phẩm Mã hóa đơn Đơn giá sản phẩm Số lượng đặt mua ID albums 6.3 Bảng chi tiết hóa đơn Name ID IDSanPham IDHoaDon Gia Soluongdatmua 6.4 Type Int Int Int Float Int Bảng sản phẩm Prod_id int Null Prod_name Prod_slug Prod_price Prod_img Prod_status Prod_description Prod_featured Prod_cate Prod_qty Prod_sold Varchar Varchar(255) Int(11) Varchar(255) Tinyint(4) Text Tinyint(4) Int Varchar(250) Int No No No No No No No No No No Type Int Varchar(255) Varchar(255) Varchar(255) Varchar(255) Varchar(255) Null No No No No No No 6.5 Tên sản phẩm Chi tiết tên sản phẩm Giá sản phẩm Hình ảnh sản phẩm Trạng thái Chi tiết sản phẩm Sản phẩm đặt biệt Tên nghệ sĩ Số lượng sản phẩm Số lượng bán Bảng User Name ID UserName PassWord Ten Diachi Email Chú thích Mã User Tên User Mật Tên Địa Email 52 Sodienthoai Noidung 6.6 Varchar(255) Varchar(255) No Yes Số điện thoại Chú thích Int(10) Varchar(255) Varchar(255) Null No No Id Tên nghệ sĩ Tên đầy đủ Bảng Menu Cate_id Cate_name Cate_slug 53 CHƯƠNG III THIẾT KẾ TRANG WEB BÁN HÀNG ALBUMS Bắt tay vào làm dự án cụ thể, giới thiệu chức hệ thống, bật Hướng dẫn cho người sử dụng biết hệ thống 6.6.1 Giao diện trang khách hàng 6.6.1.1 Giao diện trang chủ 54 55 Hình Giao diện trang chủ 56 6.6.1.2 Giao diện trang giới thiệu sản phẩm của hàng Hình Giao diện trang giới thiệu sản phẩm 6.6.1.3 Giao diện phần giỏ hàng Hình Giao diện giỏ hàng 57 6.6.1.4 Giao diện đăng nhập, đăng ký Hình Giao diện đăng nhập, đăng ký 6.6.1.5 Giao diện phần footer Hình Giao diện footer 58 6.6.2 Giao diện phần quản lý 6.6.2.1 Giao diện trang đăng nhập vào phần quản lý Hình Giao diện đăng nhập quản lý 6.6.2.2 Giao diện trang chủ phần quản trị Hình Giao diện trang chủ quản trị 59 6.6.3 Các chức bật Chức đặt hàng quản lý giỏ hàng Với chức đặt hàng đặt hàng trực tiếp trang giới thiệu sản phẩm trang chi tiết sản phẩm Hình Chức đặt hàng sản phẩm lưu giỏ hàng Hình Chức quản lý giỏ hàng 60 Chức voting rate đánh giá Hình 10 Chức voting rate đánh giá 61 Chức gửi email hóa đơn cho khách hàng cho khách hàng Sau hóa đơn khách hàng tiếp nhận ban quản trị hiển thị chi tiết hóa đơn gửi email cho khách hàng để xác nhận lại việc đặt hàng a Chi tiết hóa đơn in b Email gửi cho khách hàng 62 Hình 13 Chức gửi email hóa đơn cho khách hàng 63 CHƯƠNG IV KẾT LUẬN Đề tài “Xây Dựng Website Kpop Store LARAVEL” xuất phát từ thực tế ngày nhằm tạo tảng sở ban đầu để hỗ trợ thêm cho bạn muốn thiết kế Website cho công ty hay Website cá nhân Mặc dù có nhiều cố gắng, tìm hiểu kiến thức học, kết hợp tra cứu tài liệu chuyên ngành đề tài “Xây Dựng Website Kpop Store LARAVEL” hạn chế thời gian, khả kinh nghiệm nên không tránh khỏi thiếu sót định nên đề tài hồn thành mức độ sau: - Tìm hiểu lập trình Web LARAVEL & MySQL - Áp dụng xây dựng ứng dụng thực nghiệm trang Web bán hàng albums mạng cho cửa hàng Ashop Hướng nghiên cứu phát triển: - Tìm hiểu sâu LARAVEL & MySQL để đáp ứng nhiều nhu cầu người sử dụng, phát triển tối ưu hóa hệ thống, - Kết hợp LARAVEL với hệ quản trị sở liệu lớn hơn: SQL Server, Oracle… - Tìm hiểu thêm số, phần mềm ứng dụng để nâng cao giao diện đồ họa đẹp mắt, thân thiện hơn… - Xây dựng trang Web quy mô lớn với nhiều ứng dụng, chức Để hoàn thành đề tài này, lần em xin chân thành cảm ơn Cô giáo ThS Dương Thị Mai Nga người quan tâm, giúp đỡ em suốt thời gian qua Em xin chân thành cảm ơn ! Em xin trân trọng cảm ơn… TÀI LIỆU THAM KHẢO I Các trang Web - Boostrap 3,4,5 - Codepen - Youtube - Fontawesome 64 ... phức tạp quy mô ứng dụng, cộng thêm vấn đề thời gian đề tài ? ?Xây Dựng Website Kpop Store LARAVEL” dừng mức tìm hiểu lập trình Web LARAVEL & MYSQL, áp dụng xây dựng ứng dụng thực nghiệm trang Web... NGHỆ THÔNG TIN & TRUYỀN THÔNG VIỆT HÀN ĐỒ ÁN TỐT NGHIỆP BÁO CÁO ĐỒ ÁN TỐT NGHIỆP ĐỀ TÀI XÂY DỰNG WEBSITE KPOP STORE Sinh viên thực : HUỲNH TẤN PHƯỚC Lớp: 19I1 Giảng viên hướng dẫn: ThS Dương... dụng, cộng thêm vấn đề thời gian đồ án dừng mức tìm hiểu lập trình web LARAVEL & MYSQL, áp dụng xây dựng ứng dụng thực nghiệm trang Web bán hàng mạng cho cửa hàng albums Website với mục đích