Đồ án thiết kế website bán đồ thể thao

TRƯỜNG ĐẠI HỌC TIỀN GIANG KHOA KỸ THUẬT CÔNG NGHỆ BÁO CÁO ĐỒ ÁN CHUYÊN NGÀNH ĐỀ TÀI THIẾT KẾ WEBSITE BÁN ĐỒ THỂ THAO SINH VIÊN THỰC HIỆN Lê Thành Quốc 019101012 GIẢNG VIÊN HƯỚNG DẪN Thạc sĩ Nguyễn Thị Thu Nguyệt

TRƯỜNG ĐẠI HỌC TIỀN GIANG KHOA KỸ THUẬT CÔNG NGHỆ - - BÁO CÁO ĐỒ ÁN CHUYÊN NGÀNH ĐỀ TÀI: THIẾT KẾ WEBSITE BÁN ĐỒ THỂ THAO SINH VIÊN THỰC HIỆN: GIẢNG VIÊN HƯỚNG DẪN: Lê Thành Quốc 019101012 Giảng viên Nguyễn Thị Thu Nguyệt Võ Thành Chiến 019101016 Tiền Giang, tháng năm 2022 LỜI CẢM ƠN  Chúng em xin gửi lời cảm ơn chân thành đến cô Nguyễn Thị Thu Nguyệt giáo viên hướng dẫn đồ án cho chúng em Cô theo sát trình thực đồ án, nhiệt tình hướng dẫn, bảo để chúng em hoàn thành đồ án Trong trình làm đồ án, chúng em cố gắng để tìm hiểu, trao dồi kiến thức để hồn thành tốt đồ án chắn khơng tranh khỏi thiếu sót Chúng em mong nhận thơng cảm góp ý q thầy Chúng em xin chân thành cảm ơn! Tiền Giang, tháng năm 2022 Nhóm sinh viên thực MỤC LỤC CHƯƠNG 1: TỔNG QUAN 1 Giới thiệu đề tài: 1.1 Thông tin đề tài: 1.2 Hỉnh thành ý tưởng: 1.3 Lý chọn đề tài: 1.4 Mục tiêu: 1.5 Phân công nhiệm vụ tiến trình làm việc: Cơ sở lý thuyết .4 2.1 Thương mại điện tử ? 2.2 Lợi ích thương mại điện tử : 2.3 Phân tích quy trình mua sắm trang thương mại điện tử : .4 Tìm hiểu Website 3.1 Website gì? .6 Ngơn ngữ lập trình công nghệ sử dụng: 4.1 HTML: .6 4.2 CSS 4.3 JAVASCRIPT .7 4.4 BOOTSTRAT 4.5 PHP 4.6 XAMPP: .7 4.7 MySql 4.8 Database: 4.9 Open source: .8 4.10 MySQL Server 4.11 MySQL Client CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ, CÀI ĐẶT, GIẢI PHÁP Mô tả toán - Tên toán: Thiết kế website bán đồ dùng thể thao Phân tích 2.1 Yêu cầu website 2.2 Yêu cầu chức 10 Thiết kế 10 3.1 Thiết kế CSDL 10 3.2 Các ca sử dụng 13 3.2 Đặc tả tả use case .16 Thiết kế giao diện 19 4.1 Giao diện trang chủ 19 4.2 Giao diện giới thiệu 20 4.3 Giao diện liên hệ 21 4.4 Giao diện đăng ký 22 4.5 Giao diện đăng nhập 23 4.6 Giao diện giỏ hàng .24 4.7 Giao diện toán 25 4.8 Giao diện quản lý người bán .26 Hướng dẫn cài đặt xampp 27 Giải pháp hoàn thiện sản phẩm 30 6.1 Vấn đề: 30 6.2 Câu hỏi đặt ra: 30 6.3 Trả lời: Đó phần Backend 30 6.4 Backend gì: 30 6.5 Ngôn ngữ Backend: 30 6.6 PHP ? 30 CHƯƠNG 3: KẾT QUẢ THỰC NGHIỆM 32 Chức đăng nhập, thêm sản phẩm vào giỏ hàng .32 Mô tả: 32 Chức toán, xuất mã đơn hàng 34 Mô tả: 34 Chức đăng ký 35 Chức người bán hàng 39 CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN CỦA TRANG WEB 45 Kết đạt được: .45 1.1 Những kết đạt được: 45 1.2 Ưu điểm: 45 1.3 Nhược điểm: .45 Hướng nghiên cứu phát triển .46 Kết luận 46 Tài liệu tham khảo 46 DANH MỤC HÌN Hình 2.1 Use case người bán hàng 13 Hình 2.2 Use case khách hàng 14 Hình 2.3 Use case người quản trị viên 15 Hình 2.4 Giao diện trang chủ 19 Hình 2.5 Giao diện giới thiệu 20 Hình 2.6 Giao diện liên hệ 21 Hình 2.7 Giao diện đăng ký .22 Hình 2.8 Giao diện đăng nhập 23 Hình 2.9 Giao diện giỏ hàng 24 Hình 2.10 Giao diện tốn 25 Hình 2.11 Giao diện quản lý người bán .26 Hình 3.1 Đã đăng nhập 32 Hình 3.2 Thêm vào giỏ thành công 33 Hình 3.3 Chưa đăng nhập 33 Hình 3.4 Yêu cầu đăng nhập 34 Hình 3.5 Tùy chọn toán 34 Hình 3.6 Thanh tốn qua thẻ 35 Hình 3.7 Xuất mã đặt hàng .35 Hình 3.8 Giao diện đăng ký .36 Hình 3.9 Thơng báo số điện thoại hợp lệ 36 Hình 3.10 Đăng ký thành công 37 Hình 3.11 Điền email, số điện thoại sai 37 Hình 3.12 Kiểm tra tài khoản tồn .38 Hình 3.13 Mục xem mặt hàng 39 Hình 3.14 Điền thơng tin trước đăng .40 Hình 3.15 Đăng thành công .40 Hình 3.16 Mục chỉnh sửa 41 Hình 3.17 Chọn mặt hàng cần chỉnh sửa .41 Hình 3.18 Cập nhật thành công 42 Hình 3.19 Giao diện xóa mặt hàng 43 Hình 3.20 Chọn mặt hàng cần xóa .43 Hình 3.21 Xóa thành cơng .44 Hình 3.22 Giao diện đơn đặt hàng 44 DANH MỤC BẢNG Bảng 1.1 Phân công nhiệm vụ Bảng 2.1 Yêu cầu website .10 Bảng 2.2 Thành phần bảng Contact .11 Bảng 2.3 Thành phần bảng customer 11 Bảng 2.4 Thành phần bảng manager .12 Bảng 2.5 Thành phần bảng order 13 Bảng 2.6 Thành phần bảng product 13 Bảng 2.7 Thành phần bảng yourshop 13 Bảng 2.8 Use case thêm sản phẩm vào giỏ hàng 28 Bảng 2.9 Use case đăng ký người bán hàng 29 Bảng 2.10 Use case đăng bán sản phẩm .30 DANH MỤC TỪ VIẾT TẮT Từ viết tắt Tên viết tắt SQL sever HTML CSS JS XML PHP XAMPP Structure Query Language Hypertext Markup Language Cascading Style Sheets JavaScrip Xtensible Markup Language Hypertext Preprocessor Cross-Platform (X), Apache (A), MariaDB (M), PHP (P) Perl (P) CSDL Cơ sở liệu TÓM TẮT CHƯƠNG 1: TỔNG QUAN - Giới thiệu đề tài  Lý chọn đề tài  Hình thành ý tưởng  Mục tiêu  Phân cơng nhiệm vụ tiến trình làm việc - Cơ sở lý thuyết  Thương mại điện tử  Lợi ích thương mại điện tử  Phân tích quy trình mua sắm  Tìm hiểu website  Ngơn ngữ cơng nghệ sử dụng CHƯƠNG 2:PHÂN TÍCH, THIẾT KẾ - Mơ tả tốn - Phân tích + u cầu website + yêu cầu chức - Thiết kế  Thiết kế CSDL  Sơ đồ lớp hệ thống  Các ca sử dụng  Đặc tả quy trình, trình tự, trạng thái  Đặc tả use case - Thiết kế giao diện - Hướng dẫn cài đặt xampp - Giải pháp hoàn thiện sản phẩm  Backend  Ngơn ngữ Backend  PHP  Ưu, nhược điểm PHP CHƯƠNG 3: KẾT QUẢ THỰC NGHIỆM Hình 3.13 Thêm vào giỏ thành cơng Demo TH2: Hình 3.14 Chưa đăng nhập 36 Khi bấm nút thêm yêu cầu đăng nhập Hình 3.15 Yêu cầu đăng nhập Chức tốn, xuất mã đơn hàng Mơ tả: Khi khách hàng chọn chức toán, hệ thống hiển thị giao diện tùy chọn toán gồm tùy chọn: toán thẻ, toán nhận hàng Nếu khách hàng chọn chức tốn thẻ, khách hàng phải điển thơng tin thẻ lên form hệ thống sau hệ thống kiểm tra tốn Hình 3.16 Tùy chọn tốn 37 Hình 3.17 Thanh tốn qua thẻ Hình 3.18 Xuất mã đặt hàng 38 Chức đăng ký Mô tả: Khách hàng điền tất thông tin vào form đăng ký, hệ thống ki ểm tra email, tên tài khoản, số điện thoại hợp lệ thông báo đăng ký thành công, ngược lại đăng ký không thành cơng Hình 3.19 Giao diện đăng ký Hình 3.20 Thơng báo số điện thoại hợp lệ 39 Hình 3.21 Đăng ký thành cơng Hình 3.22 Điền email, số điện thoại sai 40 Thơng báo lỗi điền lại Hình 3.23 Kiểm tra tài khoản tồn 41 Chức người bán hàng Mô tả: Khi ngưởi bán hàng đăng nhập vào trang quản lý, người bán hàng sử dụng chức như: xem mặt hàng, đăng mặt hàng, sửa cập nhật thông tin mặt hàng,xóa mặt hàng Xem mặt hàng Hình 3.24 Mục xem mặt hàng 42 Đăng mặt hàng Hình 3.25 Điền thơng tin trước đăng Hình 3.26 Đăng thành cơng 43 Chỉnh sửa thơng tin mặt hàng Hình 3.27 Mục chỉnh sửa Hình 3.28 Chọn mặt hàng cần chỉnh sửa 44 Cập nhật thơng tin chỉnh sửa Hình 3.29 Cập nhật thành cơng 45 Xóa mặt hàng Hình 3.30 Giao diện xóa mặt hàng Hình 3.31 Chọn mặt hàng cần xóa 46 Hình 3.32 Xóa thành cơng Xem đơn đặt hàng Hình 3.33 Giao diện đơn đặt hàng 47 CHƯƠNG 4: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN CỦA TRANG WEB Kết đạt được: Đề tài: “xây dựng Website bán hàng trực tuyến” xuất phát từ thực tế ngày nhằm tạo tảng sở ban đầu để hỗ trợ thêm cho thiết kế Website công ty hay Website 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 hạn chế thời gian, khả kinh nghiệm nên không trán khỏi nhựng thiếu sót định báo cáo hoàn thành mức độ sau: 1.1 Những kết đạt được: - Về cơng nghệ  Tìm hiểu cơng nghệ lập trình web  Tìm hiểu nắm bắt công cụ thiết kế web  Biết cách thiết kế web động cách tổng chức sở liệu  Các dịch vụ Interner, đặc biệt web… - Về cài đặt chương trình  Giới thiệu mặt hàng kinh doanh đến khách hàng  Cho phép ngưởi dùng xem mặt hàng, thêm vào giỏ hàng, toán mua hàng  Tiếp nhân đơn đặt hàng khách hàng  Người bán hàng có thể: đăng mặt hàng,cập nhật, xóa mặt hàng, xem đơn đặt hàng khách hàng  Thống kê: chủng loại mặt hàng, tin tức đối tác - Tính chương trình  Thông tin khách hàng, mặt hàng… cập nhật kịp thời, xác 1.2 Ưu điểm: 48 - Giao diện đẹp, dễ dàng sử dụng trình duyệt web - Tốc độ xử lý nhanh - Mô cấu trúc trang web 1.3 Nhược điểm: - Sản phẩm chưa thử nghiệm với thời gian dài với nhiều môi trường khác nên chưa đánh giá xác độ ổn định - Website giải vấn đề - Vẫn thiếu nhiều chức website bán đồ thương mại điện tử Hướng nghiên cứu phát triển Tìm hiểu sâu hệ quản trị sở liệu đáp ứng nhiều nhu cầu người dử dụng, phát triển tối ưu hố hệ thống Kết hợp ngơn ngữ PHP với hệ quản trị sở liệu lớn như: SQL Server, Oracle,… Tìm hiểu thêm số ngôn ngữ, phần mềm ứng dụng để nâng cao giao diện đồ hoạ đẹp mắt, sinh động hơn… Xây dựng trang Web quy mô lớn với nhiều ứng dụng Kết luận Mơ hình trang web bán đồ tảng thương mại điện tử đề tài khơng đặt nhiều câu hỏi việc thực nghiên cứu dự án,, sản phẩm mang tính khả thi Trong tương lai hi vọng trang web hoàn thiện, ổn định nhiều người tiêu dùng biết đến sử dụng rộng rãi Tài liệu tham khảo [1] Trần Thị Diễm Trang – Trần Huy Long, Lập trình web, 2014 [2] Website thamm khảo: https://www.web-eau.net/blog/10-best-footer-html-css-snippets https://www.niemvuilaptrinh.com/article/tao-footer-website 49 https://www.youtube.com/watch?v=tTfn37NrzBw&t=322s https://www.w3schools.com/css/css_navbar.asp 50 ... nguồn mở CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ, CÀI ĐẶT, GIẢI PHÁP Mơ tả tốn - Tên toán: Thiết kế website bán đồ dùng th ể thao Để quản lý hệ thống website bán đồ dùng thể thao, hệ thống cần thông tin:... TÍCH THIẾT KẾ, CÀI ĐẶT, GIẢI PHÁP Mơ tả tốn - Tên tốn: Thiết kế website bán đồ dùng thể thao Phân tích 2.1 Yêu cầu website 2.2 Yêu cầu chức 10 Thiết kế. .. tưởng: Website bán đồ dùng thể thao lấy ý tưởng bố cục từ trang web có sẵn.Giao diện, hình ảnh phải bắt mắt, với sản phẩm, màu sắc phải phù hợp hài hòa với tổng thể trang web Là đề tài thiết kế,