Phát triển website bán phụ kiện thú cưng bằng wordpress và csdl mysql đồ án tốt nghiệp

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC CÔNG NGHỆ ĐÔNG Á ĐỒ ÁN TỐT NGHIỆP TÊN ĐỀ TÀI: PHÁT TRIỂN WEBSITE BÁN PHỤ KIỆN THÚ CƯNG BẰNG WORDPRESS VÀ CSDL MYSQL Sinh viên thực Ngày sinh Lớp Khoa Mã sinh viên Giảng viên hướng dẫn : : : : : : Đinh Hồng Yến 09/06/2000 DCCNTT9.10.IT2 Cơng nghệ thông tin 187480201225 ThS Hà Trọng Thắng Bắc Ninh, năm 2022 BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC CƠNG NGHỆ ĐƠNG Á ĐINH HỒNG YẾN TÊN ĐỀ TÀI: PHÁT TRIỂN WEBSITE BÁN PHỤ KIỆN THÚ CƯNG BẰNG WORDPRESS VÀ CSDL MYSQL Giảng viên hướng dẫn: ThS Hà Trọng Thắng Bắc Ninh, năm 2022 LỜI CẢM ƠN Đầu tiên, em xin gửi lời cảm ơn đến toàn thể Ban Giám Hiệu Khoa Công Nghệ Thông Tin Trường Đại Học Công Nghệ Đông Á tạo điều kiện cho em suốt thời gian học tập vừa qua Sau bốn năm học tập trường, em tiếp thu nhiều kiến thức bổ ích trau dồi nhiều kỹ cần thiết cho nghiệp sau Em xin gửi lời cảm ơn chân thành đến thầy giáo – giáo viên hướng dẫn – ThS Hà Trọng Thắng nhiệt tình dạy em Nhờ lời góp ý thầy, em hoàn thiện tốt đồ án tốt nghiệp Một lần nữa, em xin chân thành cảm ơn thầy Bắc Ninh, tháng 11 năm 2022 Sinh viên thực Đinh Hoàng Yến i MỤC LỤC LỜI CẢM ƠN i MỤC LỤC ii DANH MỤC HÌNH ẢNH vi DANH MỤC CÁC BẢNG viii DANH MỤC TỪ VIẾT TẮT ix LỜI MỞ ĐẦU PHẦN MỞ ĐẦU .2 Lý chọn đề tài .2 Mục đích yêu cầu đề tài .2 Đối tượng phạm vi nghiên cứu 3.1 Đối tượng nghiên cứu .3 3.2 Phạm vi nghiên cứu Phương pháp nghiên cứu Những đóng góp báo cáo Kết cấu báo cáo CHƯƠNG 1: ĐẶT VẤN ĐỀ 1.1 Khảo sát tình hình kinh doanh phụ kiện thú cưng 1.2 Phân tích yêu cầu đề tài 1.2.1 Tóm tắt yêu cầu hệ thống mà dự án thực 1.3 Chức hệ thống .8 1.4 Giao diện website 11 1.4.1 Giao diện người dùng 11 1.4.2 Giao diện người quản trị 11 1.5 Các ngôn ngữ sử dụng 12 1.5.1 HTML 12 ii 1.5.2 CSS (Cascading Style Sheets) .13 1.5.3 JAVASCRIPT .13 1.5.4 Mã nguồn mở WordPress 14 1.6 Hệ quản trị CSDL MySQL 15 CHƯƠNG 2: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 17 2.1 Một số vấn đề chung hệ thống thông tin quản lý 17 2.1.1 Phân cấp quản lý 17 2.1.2 Luồng thông tin vào 17 2.1.3 Luồng thông tin đầu 17 2.1.4 Mơ hình hệ thống quản lý 17 2.1.5 Các bước xây dựng hệ thống quản lý 18 2.2 Phân tích thiết kế với UML 18 2.3 Biểu đồ Use Case mức tổng quát .20 2.3.1 Biểu đồ Use Case tổng quát .20 2.3.2 Biểu đồ Use Case người dùng .21 2.3.3 Biểu đồ Use Case Admin 21 2.4 Biểu đồ Use Case Phân rã chức (mức 2) 22 2.4.1 Phân rã Use Case Quản lý thông tin 22 2.4.2 Phân rã Use Case Tìm kiếm 22 2.4.3 Phân rã Use Case Thống kê 23 2.5 Biểu đồ Use Case phân rã chức (mức 3) 23 2.5.1 Phân rã Use Case Quản lý người dùng 23 2.5.2 Phân rã Use Case Quản lý sản phẩm 24 2.5.3 Phân rã Use Case Quản lý nhà cung cấp .24 2.5.4 Phân rã Use Case Đặt mua 25 iii 2.6 Đặc tả Use Case 25 2.6.1 Đặc tả Use Case đăng nhập (Người dùng) 25 2.6.2 Đặc tả Use Case đăng ký tài khoản .27 2.6.3 Đặc tả Use Case Xem thông tin sản phẩm 28 2.6.4 Đặc tả Use Case đặt mua .29 2.6.5 Đặc tả Use Case toán 31 2.6.6 Đặc tả Use Case Tìm kiếm sản phẩm 33 2.6.7 Đăng nhập (Admin) .34 2.6.8 Đặc tả Use Case Quản lý thông tin 36 2.6.9 Đặc tả Use Case Nhập hàng 38 2.6.10 Đặc tả Use Case Tìm kiếm thơng tin 39 2.6.11 Đặc tả Use Case Thống kê .41 2.7 Biểu đồ 42 2.7.1 Chức đăng ký 42 2.7.2 Chức đăng nhập 43 2.7.3 Chức đặt mua 43 2.7.4 Chức toán 44 2.7.5 Chức thêm sản phẩm 44 2.7.6 Chức sửa thông tin sản phẩm 45 2.7.7 Chức xóa sản phẩm .45 2.7.8 Chức nhập hàng 46 2.7.9 Chức tìm kiếm 46 2.7.10 Chức thống kê 47 CHƯƠNG 3: MƠ HÌNH QUAN HỆ 48 3.1 Sơ đồ thực thể quan hệ (Entity Relationship Diagram) .48 iv 3.2 Thiết kế sở liệu 49 3.2.1 Bảng giỏ hàng 49 3.2.2 Bảng hóa đơn .49 3.2.3 Bảng loại sản phẩm .50 3.2.4 Bảng nhóm sản phẩm 50 3.2.5 Bảng sản phẩm: 50 3.2.6 Bảng thành viên: 51 CHƯƠNG 4: TRIỂN KHAI XÂY DỰNG WEBSITE 53 4.1 Giới thiệu cơng cụ lập trình 53 4.2 Cài đặt WordPress localhost .53 4.3 Ưu điểm, nhược điểm mã nguồn mở WordPress .64 4.4 Hình ảnh chức website 65 4.4.1 Giao diện trang chủ website 65 4.4.2 Header Slide quảng cáo 66 4.4.3 Phần hiển thị sản phẩm 67 4.4.4 Phần thông tin chân trang web footer 68 4.4.5 Form đăng nhập quản trị 69 4.4.6 Giao diện quản trị hệ thống 70 4.4.7 Quản lý sản phẩm website 70 4.4.8 Giao diện hiển thị chi tiết sản phẩm 71 4.4.9 Giao diện chức giỏ hàng .72 4.4.10 Chức toán giỏ hàng 73 KẾT LUẬN 74 TÀI LIỆU THAM KHẢO .75 v DANH MỤC HÌNH ẢNH Hình 1.1: Cửa hàng kinh doanh phụ kiện thú cưng Hình 2.1: Biểu đồ Use Case mức tổng quát .20 Hình 2.2: Biểu đồ Use Case người dùng .21 Hình 2.3: Biểu đồ Use Case Admin 21 Hình 2.4: Biểu đồ Use Case phân rã chức Quản lý thông tin .22 Hình 2.5: Biểu đồ Use Case phân rã chức Tìm kiếm 22 Hình 2.6: Biểu đồ Use Case phân rã chức Thống kê 23 Hình 2.7: Biểu đồ Use Case phân rã chức Quản lý người dùng 23 Hình 2.8: Biểu đồ Use Case phân rã chức Quản lý sản phẩm 24 Hình 2.9: Biểu đồ Use Case phân rã chức Quản lý nhà cung cấp 24 Hình 2.10: Biểu đồ Use Case phân rã chức Đặt mua 25 Hình 2.11: Đặc tả Use Case đăng nhập (Người dùng) 25 Hình 2.12: Đặc tả Use Case đăng ký tài khoản .27 Hình 2.13: Đặc tả Use Case Xem thông tin sản phẩm 28 Hình 2.14: Đặc tả Use Case đặt mua .29 Hình 2.15: Đặc tả Use Case tốn 31 Hình 2.16: Đặc tả Use Case Tìm kiếm sản phẩm 33 Hình 2.17: Đăng nhập (Admin) .34 Hình 2.18: Đặc tả Use Case Quản lý thông tin .36 Hình 2.19: Đặc tả Use Case Nhập hàng 38 Hình 2.20: Đặc tả Use Case Tìm kiếm thơng tin 39 Hình 2.21: Đặc tả Use Case Thống kê 41 Hình 2.22: Biểu đồ chức đăng ký .42 Hình 2.23: Hình 2.12: Biểu đồ chức đăng nhập .43 Hình 2.24: Biểu đồ chức đặt mua .43 Hình 2.25: Biểu đồ chức toán 44 Hình 2.26: Biểu đồ chức thêm sản phẩm 44 Hình 2.27: Biểu đồ chức cập nhật thông tin sản phẩm 45 Hình 2.28: Biểu đồ chức xóa sản phẩm 45 Hình 2.29: Biểu đồ chức nhập hàng 46 vi Hình 2.30: Biểu đồ chức tìm kiếm 46 Hình 2.31: Biểu đồ chức thống kê 47 Hình 3.1: Sơ đồ ERD .48 Hình 4.1: Hộp thoại Setup để bắt đầu cài đặt XAMPP 54 Hình 4.2: Hộp thoại Installation folder để chọn nơi muốn đặt XAMPP .54 Hình 4.3: Hộp thoại Bitnami for XAMPP giúp người dùng sử dụng nhiều mã nguồn mở khác 55 Hình 4.4: Bảng điều khiển XAMPP .56 Hình 4.5: Khởi động thành cơng Webserver Apache MySQL Server .57 Hình 4.6: Thư mục sau giải nén mã nguồn .57 Hình 4.7: Các tập tin thư mục mã nguồn WordPress .58 Hình 4.8: Copy mã nguồn WordPress vào Localhost 59 Hình 4.9: Tạo database 59 Hình 4.10: Chọn ngơn ngữ cài đặt WordPress 60 Hình 4.11: Hộp thoại thơng báo WordPress 61 Hình 4.12: Nhập thông tin database 61 Hình 4.13: Bắt đầu cài đặt WordPress 62 Hình 4.14: Thiết lập thơng tin cho website .63 Hình 4.15: Cài đặt thành công website 63 Hình 4.16: Giao diện trang quản trị WordPress 64 Hình 4.17: Giao diện trang chủ website 65 Hình 4.18: Header Slide quảng cáo 66 Hình 4.19: Phần hiển thị sản phẩm 67 Hình 4.20: Phần thơng tin chân trang web footer 68 Hình 4.21: Form đăng nhập quản trị .69 Hình 4.22: Giao diện quản trị hệ thống 70 Hình 4.23: Quản lý sản phẩm website 70 Hình 4.24: Giao diện hiển thị chi tiết sản phẩm 71 Hình 4.25: Giao diện chức giỏ hàng .72 Hình 4.26: Chức toán giỏ hàng 73 vii DANH MỤC CÁC BẢNG Bảng 2.1 Danh sách Actor 18 Bảng 2.2: Danh sách Use Case .19 Bảng 3.1: Bảng giỏ hàng .49 Bảng 3.2: Bảng hóa đơn 49 Bảng 3.3: Bảng loại sản phẩm .50 Bảng 3.4: Bảng nhóm sản phẩm 50 Bảng 3.5: Bảng sản phẩm 51 Bảng 3.6: Bảng thành viên 51 viii Hình 4.11: Hộp thoại thông báo WordPress Và nhập thơng tin database Hình 4.12: Nhập thơng tin database Với máy chủ localhost, User Name database root, mật để trống (vẫn có cách thiết lập không cần thiết) Database Host localhost 61 Table Prefix nghĩa tiền tố database chứa liệu WordPress, mặc định wp_, đổi thành phải bắt buộc có _ đằng sau Khi nhập xong thông tin database, ấn nút Submit để làm bước Nếu bước hình nghĩa bạn nhập thơng tin database xác, ấn nút Run the install để bắt đầu cài đặt Hình 4.13: Bắt đầu cài đặt WordPress Ở bước cài đặt này, cần phải thiết lập thông tin quan trọng cho website Tên website, tên tài khoản admin mật khẩu, … Nhập xong ấn nút Install WordPress 62 Hình 4.14: Thiết lập thơng tin cho website Và chữ Success! bạn cài đặt thành công, click vào nút Log in để đăng nhập vào bảng quản trị WordPress Hình 4.15: Cài đặt thành công website Và giao diện trang quản trị WordPress 63 Hình 4.16: Giao diện trang quản trị WordPress 4.3 Ưu điểm, nhược điểm mã nguồn mở WordPress + Ưu điểm: - Hệ thống mã nguồn mở, người am hiểu code dễ dàng can thiệp vào code để tùy chỉnh theo hướng SEO - Nhiều phần mở rộng hỗ trợ SEO đa số miễn phí - Tốc độ load trang tạm ổn Có thể đáp ứng để dựng trang có số lượng viết lớn - Có thể tùy biến theo nhiều hướng: News, E-commerce, Blog, Movie - Giao diện quản trị thân thiện, chuyên nghiệp - Nhiều Templates đẹp - Cộng đồng hỗ trợ đông đảo, lượng người sử dụng nhiều nên support fix lỗi dễ dàng + Nhược điểm: - Mã nguồn bị xem cồng kềnh, nặng nề - Độ tương thích với loại hosting không cao, hoạt động ổn định host windows 64 - Truy vấn đến SQL server nhiều - SEO vận dụng linh hoạt - Khơng có chế ping mặc định 4.4 Hình ảnh chức website 4.4.1 Giao diện trang chủ website Hình 4.17: Giao diện trang chủ website Trang chủ “Index.php”: Là trang chính, chứa tất mục để lựa chọn Từ trang chủ khách hàng tìm thấy thông tin cần thiết: 65 - Thông tin loại sản phẩm với giao diện gần gũi, thân thiện dễ sử dụng từ khách hàng đặt mua cho sản phẩm yêu thích, phù hợp với túi tiền - Các viết hay giới phụ kiện cho thú cưng quản trị hệ thống chọn lọc - Bạn có thắc mắc, góp ý với cơng ty… 4.4.2 Header Slide quảng cáo Hình 4.18: Header Slide quảng cáo Trang Header Slide quảng cáo giúp hiển thị chương trình khuyến mại, thơng tin sản phẩm bán chạy, … 66 4.4.3 Phần hiển thị sản phẩm Hình 4.19: Phần hiển thị sản phẩm 67 4.4.4 Phần thơng tin chân trang web footer Hình 4.20: Phần thông tin chân trang web footer 68 4.4.5 Form đăng nhập quản trị Hình 4.21: Form đăng nhập quản trị Trang “login.php” trang mà khách hàng nhập User Pass để đăng nhập vào website, chưa có tài khoản khách hàng nhấn vào nút Đăng ký để tạo cho tài khoản 69 4.4.6 Giao diện quản trị hệ thống Hình 4.22: Giao diện quản trị hệ thống Đây trang quản trị dành cho người Admin cửa hàng, cung cấp đầy đủ tính cho người quản trị như: quản lý sản phẩm, quản lý thành viên, quản lý đơn đặt hàng… 4.4.7 Quản lý sản phẩm website Hình 4.23: Quản lý sản phẩm website Phần quản lý sản phẩm thống kê sản phẩm có website ngồi quản lý thông tin: 70 - Tên: Tên danh mục sản phẩm Ví dụ: Quà Tặng, Phụ Kiện - Mô Tả: Mô tả ngắn cho danh mục, tốt cho SEO Đối với giao diện Theme Flatsome nên bỏ trống - Kiểu Hiển Thị: Nên để mặc định - Hình Ảnh Thu Nhỏ: Làm đẹp cho danh mục sản phẩm Hình ảnh nên to, đẹp rõ ràng Khơng nên có logo, chữ, số điện thoại website hay người khác 4.4.8 Giao diện hiển thị chi tiết sản phẩm Hình 4.24: Giao diện hiển thị chi tiết sản phẩm Trang hiển thị thông tin sản phẩm trang hiển thị thông tin chi tiết sản phẩm: giá, tên sản phẩm, thông tin chi tiết…giúp cho khách hàng có nhìn tổng quan sản phẩm Là sở để khách hàng có định mua sản phẩm hay không 71 4.4.9 Giao diện chức giỏ hàng Hình 4.25: Giao diện chức giỏ hàng Chức giỏ hàng phổ biến giúp khách hàng dễ dàng lưu lại hàng mà họ u thích mua tương lai cách đăng nhập thông tin cá nhân họ Có thể xem giỏ hàng tài khoản cá nhân khách hàng mà biết thơng tin cá nhân phân tích cầu tương lai họ Thêm phát triển dịch vụ tốn online giỏ hàng cập nhật thực toán cho khách Giống siêu thị người lấy giỏ chứa đồ cần mua mua hàng online cần giỏ hàng để chứa thông tin sản phẩm mà họ muốn mua Điều giúp cho thao tác tốn dễ dàng nhanh chóng so việc tốn sản phẩm toán sản phẩm chọn giỏ hàng nhanh nhiều Tuy nhiên trang web quy mơ nhỏ số lượng sản phẩm 10 thiếu chức giỏ hàng khơng Thay sử dụng tính giỏ hàng khách đặt hàng sản phẩm họ muốn mua 72 4.4.10 Chức tốn giỏ hàng Hình 4.26: Chức toán giỏ hàng Phần toán xử lý toán sản phẩm giỏ hàng, toán xong để lại thông tin người nhận như: Tên, số điện thoại, địa người nhận gửi phần quản trị cho admin admin xử lý gửi đơn hàng 73 KẾT LUẬN Tóm lại, với tốc độ phát triển ngày tăng mạng máy tính việc thiết kế cài đặt ứng dụng cho người dùng cần thiết Vì ý tưởng giới thiệu bán hàng công nghệ số qua mạng phần giúp cho khách hàng thuận tiện việc lựa chọn mua hàng Hiện việc ứng dụng thương mại điện tử Việt Nam đáp ứng số vấn đề mua bán, chưa linh hoạt Việc ứng dụng đòi hỏi phải tốn nhiều thời gian tiền bạc Với kiến thức tảng học trường nỗ lực mình, em hồn thành đề tài “Phát triển website bán hàng phụ kiện thú cưng WordPress sở liệu MySQL” Mặc dù cố gắng đầu tư nhiều thời gian có hạn khơng thực Internet nên đề tài nhiều hạn chế Những phần hạn chế em chưa trình bày như: Sơ đồ thực thể liên kết chưa hoàn thiện, phân tích đề tài chưa rõ Em mong nhận thơng cảm góp ý q thầy bạn để chương trình ngày hoàn thiện Một lần em xin chân thành cảm ơn thầy Hà Trọng Thắng tận tình giúp đỡ em suốt thời gian thực đồ án tốt nghiệp Em xin chân thành cảm ơn Sinh viên thực 74 TÀI LIỆU THAM KHẢO [1] Phạm Hữu Khang, “SQL SERVER 2005”, Toàn tập, Nhà xuất Lao động Xã hội, Năm 2005 [2] Phạm Hữu Khang, “Lập trình ASP.NET”, Tập 3, Nhà xuất Lao động Xã hội, Năm 2005 [3] Phạm Hữu Khang, “Lập trình sở liệu”, Tập 4- Quyển 1, Nhà xuất Lao động Xã hội, Năm 2005 [4] Phạm Hữu Khang, “Lập trình sở liệu”, Tập – Quyển 2, Nhà xuất Lao động Xã hội, Năm 2005 75