Xây dựng website bán hàng thể thao cho cửa hàng T - Sport Thái Nguyên

Xây dựng website bán hàng thể thao cho cửa hàng T - Sport Thái Nguyên Đồ án đã củng cố được nội dung kiến thức tìm hiểu cũng như(phân tích và thiết kế hệ thống quản)lý, tạo csdl, biết được thêm về ngôn ngữ PHP với Framework Laravel, cách thức hoạt động của một ứng dụng web và một số framework như Laravel mvc.

ĐẠI HỌC THÁI NGUYÊN

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG

ĐẠI HỌC THÁI NGUYÊN

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG

ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌCNGÀNH CÔNG NGHỆ THÔNG TIN

Đề tài:

XÂY DỰNG WEBSITE BÁN HÀNG CHO CỬA HÀNGT- SPORT THÁI NGUYÊN

Sinh viên thực tập: Đỗ Xuân Nam

Giảng viên hướng dẫn: Nguyễn Văn Việt

THÁI NGUYÊN, NĂM 2024Mục lục

1.3.2 Lợi ích của Bootstrap 13

CHƯƠNG 2: KHẢO SÁT HIỆN TRANG 14

2.1 Thực trạng và giải pháp 14

2.2 Yêu cầu của hệ thống 14

2.2.1 Yêu cầu 14

2.2.2 Yêu cầu chi tiết 15

2.2.3 Yêu cầu về kỹ thuật 16

2.3 Biểu đồ use case 18

Hình ảnh

Hình 1 Biểu đồ UseCase tổng quát 20

Hình 2 Biểu đồ phân rã user 21

Hình 3 Biểu đồ phân rã admin 22

Hình 18.Của xóa user 29

Hình 17.Của thêm user 30

Hình 19.Của thêm sản phẩm 30

Hình 20 Của sửa sản phẩm 31

Hình 21 BĐHĐ.Của xóa sản phẩm 31

Hình 22 Biểu đồ lớp 32

Hình 23 Trang chủ của web bán đồ thể thao 39

Hình 24 Trang đăng phập cảu web 39

Hình 25 Trang các sản phẩm của web 40

Hình 26 Trang chi tiết đồ thể thao của hệ thống web 40

Hình 27.Trang phương thức thanh toán và thanh toán 41

Hình 28.Trang thêm loại đồ thể thao 42

Hình 29.Trang liệt kê đò thể thao 42

Hình 30.Trang thêm thương hiệu thể thao 43

Hình 31.Trang thêm thuong hiệu 43

Hình 32.Trang thêm đồ thể thao 44

Hình 34 Trang quản lý đồ thể thao 44

Hình 33.Trang liệt kê đơn hàng 45

Hình 35.Trang liệt kê user 45

Hình 36 Trang đơn hàng đã đặt 46

Hình 37.Trang profile user 47

LỜI CAM ĐOAN

Em xin cam đoan đồ án "XÂY DỰNG WEBSITE BÁN HÀNG quản lý CỬA HÀNGT- SPORT THÁI NGUYÊN" là hoàn toàn do em làm Em đã đề cập rõ các tài liệutham khảo ở phần tài liệu tham khảo Những số liệu và kết quả được viết trong đồ ánđều là do em tự làm Em cam đoan chịu trách nhiệm và sẽ tuân thủ mọi quy định và kỷluật của bộ môn cũng như nhà trường

LỜI CẢM ƠN

Trong quá trình học tập tại khoa công nghệ thông tin – “Trường đại học công nghệthông tin và truyền thông Thái Nguyên”, em muốn gửi lòng biết ơn đến tất cả các thầycô đã giúp đỡ và hướng dẫn em làm đồ án tốt nghiệp Đặc biệt, em muốn gửi lời cảmơn đặc biệt đến thầy giáo Nguyễn Văn Việt với sự hướng dẫn tận tình và những kiếnthức quý báu đã chia sẻ trong quá trình này.

Em xin chân thành cảm ơn!

Thái nguyên, ngày 03 tháng 05 năm 2024

Tên Sinh Viên

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT

1.1 Kiến thức lý thuyết1.1.1 Mô hình MVC

MVC (Model – View – Controller) là một kiến trúc phần mềm phổ biến được sử dụng trong phát triển ứng dụng Mô hình này chia source code thành ba phần chính, mỗi phần đảm nhận một nhiệm vụ cụ thể và hoạt động riêng với các phần khác.

a, Gồm các phần:

 Controller: Được sử dụng để điều khiển những yêu cầu của(người dùng)và gọi các(phương thức xử lý)tương ứng Nó có trách nhiệm xử lý các request từ URL hoặc form và tương tác với Model.

 Model: Chứa các logic nghiệp vụ, phương thức xử lý, truy xuất cơ sở dữ liệu vàđịnh nghĩa các đối tượng(dữ liệu)như các “Class”, (hàm xử lý,) vv.

 View: Giúp nhận thông tin và hiển thị thông tin và tương tác với(người dùng.)Nó chứa các thành phần giao diện(người dùng)như các ô văn bản, hình ảnh, vv.b, Ưu điểm:

 Ưu điểm: Mô hình MVC thể hiện sự chuyên nghiệp trong phát triển và thiết kế phần mềm Bằng cách chia ra các phần độc lập, nó giúp phát triển web một cách nhanh chóng, dễ dùng và dễ bảo trì.

c, Nhược điểm

 Nhược điểm: Trong các dự án nhỏ, mô hình “MVC” có thể tốn thời gian Nó cũng đòi hỏi việc truyền dữ liệu giữa các thành phần, gây ra sự phức tạp trong quá trình phát triển.

1.1.2 Framework

"Các framework" bao gồm(một tập hợp các thư viện mã nguồn)mở được tích hợp để tạo điều kiện thuận lợi cho sự tiến bộ của phần mềm, web và các ứng dụng khác nhau Các thư viện cung cấp chức năng thường được yêu cầu bởi các nhà phát triển phần mềm Các khung có thể được ví như "tài nguyên" được sắp xếp trước, giúp tiết kiệm thời gian thay vì bắt đầu từ một trang trắng Các nhà phát triển có khả năng sử dụng khung này để kết hợp các yếu tố và tạo ra sản phẩm cuối cùng.

"WEB framework" là một bộ công cụ phần mềm được thiết kế để hỗ trợ việc phát triểncác ứng dụng web, bao gồm cả dịch vụ web, tài nguyên web và các API web Nó cung cấp các chức năng cần thiết để xây dựng một ứng dụng web hoàn chỉnh.

1.1.3 Laravel framework.

Là mã nguồn mở, được tạo ra bởi Taylor Otwell, với mục tiêu giúp phát triển ứng dụng web theo mô hình MVC một cách nhanh chóng và dễ dàng Dưới đây là một số lý do mà bạn nên cân nhắc sử dụng Laravel:

Tại sao nên dùng Laravel :

1 Hỗ trợ MVC và cách tiếp cận hướng đối tượng

Ưu điểm đầu tiên và tốt nhất của việc sử dụng Laravel framework là nó tuân theo - Môhình kiến trúc dựa trên Model, View và Controller và nó có một cú pháp đẹp mắt, biểucảm khiến nó hướng đối tượng.

2 Xác thực và ủy quyền tích hợp

Laravel cung cấp cấu hình sẵn có cho hệ thống Xác thực và Ủy quyền Nghĩa là, chỉ bằng một vài lệnh thủ công, ứng dụng của bạn sẽ được trang bị Xác thực và Cấp phép an toàn.

3 Hệ thống đóng gói

Hệ thống đóng gói xử lý nhiều phần mềm hoặc thư viện hỗ trợ giúp ứng dụng web tự động hóa quy trình Laravel sử dụng trình soạn thảo làm trình quản lý phụ thuộc, quản lý tất cả thông tin cần thiết để quản lý các gói Gói là một cách tuyệt vời để tăng tốc độphát triển là cung cấp chức năng mà chúng tôi cần ngay lập tức Hình ảnh, thanh gỡ lỗiLaravel và trình trợ giúp Laravel IDE là một số gói Laravel tốt nhất.

4 Hệ thống tập tin đa dạng

Laravel cũng có hỗ trợ tích hợp cho hệ thống lưu trữ đám mây như Amazon S3 và Rack space Cloud Storage và tất nhiên là cả lưu trữ cục bộ Việc chuyển đổi giữa các tùy chọn lưu trữ này cực kỳ đơn giản vì API vẫn giống nhau cho mỗi hệ thống Người ta có thể sử dụng cả ba hệ thống trong một ứng dụng để phân phát tệp từ nhiều vị trí như trong môi trường phân tán.

1.1.4 Cài composer và Laravel

a) Cài composer

- Truy cập : https://getcomposer.org/Composer-Setup.exeMở và bắt đầu set up

- Chọn vị trí ổ muốn cài

- Chọn đường dẫn đến ổ muốn lưu

- Chọn install để hoàn thành

Cài đặt Laravel

- Mở Command Prompt đến thư mục htdocs trong XAMPP gõ lệnh cài đặt Laravel như sau:

Kiểm tra kết quả

1.2 MySQL

MySQL là một hệ quản trị cơ sở dữ liệu (Hệ CSDL) tự do và nguồn mở được ưa chuộng rộng rãi trong việc phát triển ứng dụng Với tính ổn định, tốc độ và tính bảo mật cao, MySQL là lựa chọn hàng đầu cho các ứng dụng đòi hỏi truy cập dữ liệu trên internet.

MySQL không chỉ hỗ trợ trên nhiều hệ điều hành khác nhau mà còn có một loạt tính năng mạnh mẽ Nó là một trong những Hệ CSDL quan trọng và phổ biến nhất sử dụng Ngôn ngữ truy vấn có cấu trúc (SQL) MySQL được tích hợp rộng rãi vào việc phát triển ứng dụng web sử dụng các ngôn ngữ lập trình như PHP, Perl và nhiều ngôn ngữ khác.

Với việc cung cấp phiên bản hoàn toàn miễn phí và sự hỗ trợ đa dạng cho các hệ điều hành khác nhau, bạn có thể dễ dàng tải MySQL từ trang chủ của nó để bắt đầu sử dụngvà phát triển ứng dụng của mình.Được tích hợp sâu vào việc phát triển ứng dụng web sử dụng PHP, Perl và các ngôn ngữ lập trình khác, MySQL đã trở thành trái tim của nhiều dự án phát triển phổ biến Với sự miễn phí và sự hỗ trợ đa dạng cho các hệ điều hành khác nhau, việc bắt đầu sử dụng và phát triển ứng dụng với MySQL trở nên dễ dàng hơn bao giờ hết.

Tạo và xóa trong CSDL

Tạo database bàng phpmyadmin thì khổi đọn mysql và làm như sau:

- Bấm vào nút new

- Tiếp sau đó điền tên của database và kiểu rồi ấn tạo

Để xóa thì ở tab csdl chọn những database cần xóa sau đó ấn xóa.

4 Điền thông tin :

Xóa bảng

- Chọn bảng muốn xóa và chọn nút "Drop" như hình :

Một số toán tử thường dung trong MYSQL khi lập trình PHP.

Toán tử số học

Toán tử so sánh

Toán tử luân lý

1.3 Bootstrap framework.1.3.1 Khái niệm

Bootstrap là một framework HTML, CSS, và JavaScript được thiết kế để phát triển cáctrang web responsive và mobile-friendly một cách nhanh chóng và dễ dàng Nó bao gồm các mẫu HTML, CSS, và JavaScript mặc định, cung cấp một loạt các thành phần và giao diện người dùng được thiết kế sẵn như văn bản, biểu mẫu, nút, bảng, thanh điều hướng, cửa sổ pop-up, carousel hình ảnh và nhiều hơn nữa Bootstrap cũng đi kèm với các plugin JavaScript giúp việc thiết kế responsive trở nên dễ dàng và nhanh chóng hơn.

1.3.2 Lợi ích của Bootstrap

Có nhiều điểm thuận lợi khi sử dụng Bootstrap để phát triển trang web:

 Dễ Dàng Sử Dụng:” Bootstrap dễ sử dụng vì nó được xây dựng trên cơ sở của

HTML, CSS, và JavaScript Người dùng chỉ cần có kiến thức cơ bản về ba ngôn ngữ này là có thể sử dụng Bootstrap một cách hiệu quả”.

 Responsive Design: “Bootstrap tích hợp sẵn CSS responsive cho các thiết di

động, desktop Điều này giúp đảm bảo rằng trang web của bạn sẽ hiển thị một cách đẹp mắt và tương thích trên mọi thiết bị.”

 Dễ Nhúng Vào Dự Án: “Bạn chỉ cần nhúng các tệp thư viện Bootstrap vào

phần header và footer của trang web của mình và bạn có thể sử dụng Bootstrap ngay lập tức Điều này giúp trang web hoặc ứng dụng của bạn trở nên chuyên nghiệp hơn với các giao diện biểu mẫu đẹp mắt”.

CHƯƠNG 2: KHẢO SÁT HIỆN TRANG

2.1 Thực trạng và giải pháp

 Thực trạng: Hiện nay nhiều cảu hàng vẫn duy trì quản lý và bán hàng một cách thủ công đó là tìm các sản phầm các đồ thể thao để cho người dùng xem sản phẩm và tìm kiếm trực tiếp tại cửa hàng và lượng tiếp cận khách hàng ỏ xa rất là ít Điều này dẫn đến việc lượng tiếp cận khách hàng từ xa rất ít, gây ra nhiều sai sót và tốn nhiều thời gian cho quá trình bán hàng và quản lý cửa hàng.Sau khi khảo sát thực trạng nhận thấy nếu cửa hàng đang ở giai đoạn khởi đầu, mơi thành lập quy mô nhỏ với số lượng hà hóa ít có thể tìm kiếm cách thủ công vẫn đem lại hiệu quả và tiết kiệm chi phí Tuy nhiên, khi cửa hàng phát triển với quy mô lớn hơn, hàng hóa nhiều hơn rất khó để tìm kiếm sản phẩm tìm kiếm và quản lý thủ công không còn phù hợp và khả năng tiếp cận đực khách hàng ở xa rất khó.

 Dựa trên những thách thức cũng như nhận thức rằng(công nghệ thông tin)ngày càng chứng tỏ sức mạnh của mình trong mọi(lĩnh vực cuộc sống,)việc áp dụng công nghệ thông tin vào hoạt động kinh doanh thông qua việc xây dựng các website là cực kỳ quan trọng.

 Thay vì phải tốn thời gian để tư vấn cho từng khách hàng và quản lý hàng hóa trong cửa hàng, các website này có thể tự động nhập và lưu trữ dữ liệu trên hệ thống Điềunày giúp giảm bớt thời gian mà nhân viên phải dành cho việc tư vấn, đồng thời cungcấp cho khách hàng khả năng tìm kiếm đồ thể thao dễ dàng hơn Hơn nữa, các website còn mở rộng phạm vi tiếp cận của cửa hàng, cho phép họ tiếp cận được khách hàng ở xa một cách thuận tiện.

2.2 Yêu cầu của hệ thống 2.2.1 Yêu cầu

Mục tiêu của việc xây dựng một trang web là hỗ trợ các doanh nghiệp quản lý hiệu quảsản phẩm một cách thuận tiện hơn và tiết kiệm thời gian hơn Việc thiết lập một trang web bán hàng cho một cửa hàng thể thao ở Thái Nguyên được thực hiện với mục tiêu chính là nâng cao hiệu quả của quy trình bán đồ thể thao của các mặt hàng và cửa hàngT-sport Nền tảng trực tuyến này cung cấp các chức năng cơ bản bao gồm kiểm soát sản phẩm, quản trị dữ liệu đồ thể thaovà khách hàng, tổ chức đơn hàng, cũng như cungcấp các tiện ích phân tích và báo cáo để tạo điều kiện thuận lợi cho việc ra quyết định kinh doanh.

Website được thiết kế dễ nhìn giản đơn sao cho thân thiện nhất vớingười sử dụng Các phần được thiết kế khoa học dễ dàng thao tác Điều đógiúp người dùng không ngại việc thay đổi thói quen từ cách quản lý thủ côngsang sử dụng website

2.2.2 Yêu cầu chi tiết

 Tài khoản người dùng:

- Người dùng sẽ được cung cấp một tài khoản và các thông tin đi kèm tàikhoản đó Với tài khoản của mình, người dùng đăng nhập vào ứng dụngvà sử dụng các chức năng của ứng dụng.

- Trên giao diện của trang đăng nhập, người dùng nhập đầy đủ đúng thôngtin về tài khoản và mật khẩu địa chỉ.

- Người dùng phải nhập chính xác thông tin.

- Đăng nhập thành công thì chuyển đến giao diện trang chủ.- Nhập thiếu thông tin thì đưa ra nhắc nhở người dùng nhập lại.- Tài khoản gồm 2 quyền: Người quản trị hệ thống

 Trang chủ :

- Phần giao diện đẹp đẽ dùng.

- Bảng Menu dẫn đến chức năng khác dễ dàng thao tác. Xem sản phẩm :

- Cho phép người dùng có thể xem các đồ thể thao

- Cho phép xem chi tiết đánh giá các sản phẩm và các sản phẩm liên quan - Phần giao diện dễ dùng đẹp.

 Ql thông tin user

- Có thể thêm(sửa xóa thông tin)của mình.- Giao diện phải đẹp, dễ nhìn, dễ thao tác. Quản lý đơn đã đặt hàng cảu mình:

- Quản lý đơn đã đặt có trong hệ thống- Ngườu dùng có thể hủy đơn hàng - Phần giao diện dễ dùng đẹp.

 Quản lý đơn đặt hàng (chỉ dành cho người quản trị) :

- Hiện thị đầy đủ thông tin đơn đặt hàng cảu các user gồm mã đơn, tên sản phẩm, số lượng, giá, ngày tạo , người đặt hàng, trạng thái của đơn

- Phần giao diện đẹp.

 Quản lý tài khoản (chỉ dành cho người quản trị):- Hiện thị danh sách tài khoản có trong hệ thống.- Cho phép thêm người dùng mới.

- Chỉnh sủa được thông tin và quyền người dùng.- Cho phép xóa tài khoản người dùng.

- Phần giao diện đẹp.

 Quản lý danh mục đồ thể thao:

- Hiện thị đầy đủ thông tin đồ thể thao như: mã đồ thể thao, tên đồ thể thao, tên danh mục thể thao, thương hiệu thể thao, giá,.

- Cho phép thêm sửa xóa(chỉ dành cho người quản trị):- Phần giao diện đẹp.

2.2.3 Yêu cầu về kỹ thuật

 Hệ thống hoạt động trên môi trường website và cho phép nhiều ngườicó thể (truy cập và cùng) một lúc.

 Giao diện được trình bày phù hợp với trang bán đồ thể thao, dễ nhìn, hợp lý và đảm bảo với mục đích của hệ thống, tuân thủ các truy cập về thông tin.

 Hệ(thống phải đáp)ứng được(an toàn, bảo mật)

 Dữ liệu được lưu và quản lí để có thể dễ dàng quản lí, bảo trì và nâng cấp trong tương lai.

2.3 Biểu đồ use case

Hình 1 Biểu đồ UseCase tổng quát

Hình 2 Biểu đồ phân rã user

Hình 3 Biểu đồ phân rã admin

2.4 Biểu đồ trình tự

Hình 4 Trình tự của đăng nhập

Hình 5 Trình tự của đăng ký

Hình 6 Biểu đồ trình tự thêm sản phẩm

Hình 7 Biểu đồ trình tự sửa sản phẩm

Hình 8 Biểu đồ trình tự xóa sản phẩm

Hình 10 Trình tự thêm user

Hình 9 Trình tự sửa user

Hình 11 Trình tự xóa user

Hình 12 Trình tự sửa user

Hình 14 Trình tự thống kê

Hình 13 Trình tự tìm kiếm

2.5 Biểu đồ hoạt động

Hình 15.Của đăng nhập

Hình 16.Của đăng ký

Hình 18.Của xóa user

Hình 17.Của thêm user

Hình 19.Của thêm sản phẩm

Hình 20 Của sửa sản phẩm

Hình 21 Của xóa sản phẩm

2.6 Biểu đồ lớp

Hình 22 Biểu đồ lớp

2.7 Đặc tả Usecase

2.7.1 Đăng Nhập

Tên chức năng Đăng nhập

Mô tả

Chức năng này cho phép người dùng sử dụng tênngười dùng và mật khẩu của họ để truy cập vàohệ thống Việc này tạo điều kiện thuận lợi choviệc quản lý thông tin cá nhân và trải nghiệm củangười dùng trên hệ thống một cách tiện lợi và antoàn

Đầu vào Thông tin tài khoản và mật khẩu

Điều kiện trước

 Người dùng cần phải đã đăng ký tài khoảnthành công trên hệ thống

 Người dùng đang ở giao diện trang chủcủa hệ thống Điều này có nghĩa là họ đãtruy cập vào trang web và đang ở mànhình chính của nó

 Chọn đăng nhập trên menu để chuyển tớigiao diện đăng nhập

Điều kiện sau  Nếu đăng nhập thành công thì sẽ đượcchuyển đến trang chính của hệ thống ngaysau đó Điều này đảm bảo rằng họ có thểtruy cập vào các tính năng và dịch vụ củahệ thống một cách thuận tiện và nhanhchóng

 Nếu việc(đăng nhập)không thành công,(hệthống)sẽ không chuyển hướng người dùngsang màn hình khác và sẽ hiển thị mộtthông báo lỗi Người dùng sẽ được yêucầu kiểm tra lại thông tin đăng nhập nhưtên tài khoản và mật khẩu để đảm bảo rằng