Sự phổ biến của PHP đảm bảo rằng có nhiều tàinguyên hỗ trợ, từ các framework đến các thư viện có sẵn, giúp việc phát triển ứng dụng trở nên dễ dàng và hiệu quả hơn, việc phát triển một
Trang 1TRƯỜNG ĐẠI HỌC TÀI NGUYÊN VÀ MÔI TRƯỜNG HÀ NỘIKHOA CÔNG NGHỆ THÔNG TIN
BÁO CÁO THỰC TẬP TỐT NGHIỆP
Tên đề tài: “THIẾT KẾ WEBSITE CỬA HÀNG TIỆN LỢI GROCERYSHOPPY”
Đơn vị tập tốt nghiệp : Công ty TNHH SJ ELECTRONICS VINA Cán bộ hướng dẫn : Hoàng Thị Mai
Sinh viên thực hiện : Nguyễn Duy ChiếnLớp : DH10C6
Hệ Đại học : Chính quyKhóa học : 2020-2024
Hà Nội – Năm 2024
LỜI CẢM ƠN
Trang 2dẫn và giúp đỡ em rất nhiều trong thời gian em làm báo cáo thực tập tốt nghiệp này.Em xin cảm ơn Ban lãnh đạo đơn vị Công ty TNHH SJ ELECTRONICS VINA cho phépvà tạo điều kiện thuận lợi cho em được thực tập ở đơn vị Em cũng xin gửi lời cảm ơn đến các thầy cô Trong khoa Công nghệ thông tin đồng thời cũng là giáo viên chủ nhiệm của lớp em, cùng các thầy cô giáo trong Khoa đã nhiệt tình giúp đỡ tạo điều kiện giấy tờ giúp em thuận lợi trong việc thực tập tại doanh nghiệp.
Cuối cùng, em xin gửi lời cảm ơn chân thành tới gia đình và bạn bè đã luôn giúp đỡ,động viên và tạo điều kiện tốt nhất cho em trong suốt quá trình học tập cũng như trongcuộc sống.
Vì thời gian có hạn nên bài báo cáo của em còn nhiều hạn chế và không thể tránhkhỏi những thiếu sót, mong thầy cô và các bạn có những ý kiến đóng góp để em có thểhoàn thiện và phát triển đề tài hơn
Em xin chân thành cảm ơn!
Sinh viên thực hiện Chiến Nguyễn Duy Chiến
MỤC LỤC
Trang 3LỜI CẢM ƠN 2
2 Mục đích nghiên cứu: 7
3 Đối tượng nghiên cứu và phạm vi nghiên cứu: 7
4 Kết quả dự kiến: 8
5 Phương pháp nghiên cứu: 8
6 Kết quả báo cáo: 8
CHƯƠNG 1: TỔNG QUAN VỀ ĐỀ TÀI 9
I Giới thiệu chung 9
II Yêu cầu sản phẩm 12
CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ HỆ THỐNG 14
2.1 Tổng quan về nghiệp vụ 14
2.2 Phân tích các yêu cầu và chức năng 14
2.3 Phân tích yêu cầu phi chức năng 18
2.4 Thiết kế cơ sở dũ liệu: 19
Trang 4Hình 1 Biểu đồ use case tổng
Hình 2 : Cơ sở dữ liệu web cửa hàng tiện lợi GROCERY SHOPPYHình 3 : Bảng tbl_admin
Hình 4: Bảng tbl_cart_detailHình 5: Bảng tbl_dangkyHình 6: Bảng tbl_danhmucHình 7: Bảng tbl_giohangHình 8: Bảng tbl_sanphamHình 9: Bảng tbl_shippiing
Hình 10: Giao diện đăng nhập quản trịHình 11: Giao diện quản trị viênHình 12: Giao diện quản lý sản phẩmHình 13: Giao diện quản lý danh mụcHình 14: Giao diện quản lý đơn hàngHình 15: Giao diện khách hàng
Hình 16: Giao diện trang chủHình 17: Giao diện trang chủHình 18: Giao diện trang chủHình 19: Thêm giỏ hàng
Trang 5Bảng 5: Đặc tả use case quản lý danh mụcBảng 6: Đặc tả use case quản lý sản phẩmBảng 7: Đặc tả use case quản lý đơn hàng
MỞ ĐẦU
1 Lý do chọn đề tài
Trang 6Thế giới đang ngày càng bùng nổ về mạng máy tính, con người có thể nhanh chóng giao tiếp và kết nối với nhau dễ dàng hơn thông qua nhiều loại dịch vụ trên Internet Đây chính là điều kiện thuận lợi cho thương mại điện tử ngày càng phát triển hơn Hiện nay, Thương mại điện tử đã trở thành một phương thức giao dịch quen thuộc của các công ty thương mại lớn trên thế giới và đang ngày càng phát triển tại Việt Nam
Việc lựa chọn đề tài THIẾT KẾ WEBSITE CỬA HÀNG TIỆN LỢI
GROCERY SHOPPY bằng PHP được chọn lựa dựa trên một số lý do cụ thể và
hợp lý Đầu tiên, PHP là một ngôn ngữ lập trình mạnh mẽ và linh hoạt, được sử dụng rộng rãi trong phát triển web Sự phổ biến của PHP đảm bảo rằng có nhiều tàinguyên hỗ trợ, từ các framework đến các thư viện có sẵn, giúp việc phát triển ứng
dụng trở nên dễ dàng và hiệu quả hơn, việc phát triển một trang web CỬA HÀNG TIỆN LỢI GROCERY SHOPPY cho phép tích hợp một loạt các tính năng quan
trọng và tiện ích, như hệ thống quản lý người dùng, thanh toán trực tuyến an toàn, quản lý hàng tồn kho và đơn hàng PHP cung cấp các công cụ mạnh mẽ để xử lý dữ liệu và tương tác với cơ sở dữ liệu, điều này rất quan trọng khi xây dựng một cửa hàng trực tuyến PHP là một ngôn ngữ miễn phí và mã nguồn mở, điều này có nghĩa là không cần phải chi trả phí cho việc sử dụng ngôn ngữ này và có thể tùy chỉnh mã nguồn theo nhu cầu cụ thể của dự án Điều này giúp giảm chi phí phát triển và duy trì ứng dụng, đặc biệt là cho các dự án vừa và nhỏ Cuối cùng, việc sử dụng PHP cho dự án mang lại sự linh hoạt trong việc mở rộng và phát triển sau này.
2 Mục đích nghiên cứu:
Trang 7- Phát triển hệ thống quản lý: Nghiên cứu về cách xây dựng một hệ thống quản lý thông tin hiệu quả để quản lý sản phẩm, đơn hàng, và thông tin khách hàng Điều này bao gồm việc thiết kế cơ sở dữ liệu phù hợp và phát triển các chức năng quản lý phù hợp.
- Nghiên cứu về tính bảo mật: Xây dựng một hệ thống an toàn và bảo mật để bảo vệ thông tin cá nhân của khách hàng và thông tin quan trọng khác Nghiên cứu về các phương pháp bảo mật web và thực hiện các biện pháp bảo mật phù hợp để ngăn chặn các cuộc tấn công và rủi ro bảo mật.
- Nghiên cứu về tối ưu hóa hiệu suất: Nghiên cứu về cách tối ưu hóa hiệu suất của trang web, bao gồm tải trang nhanh chóng, tối ưu hóa cơ sở dữ liệu, và tối ưu hóa mã nguồn PHP để đảm bảo trải nghiệm người dùng tốt nhất.
- Tối ưu hóa trải nghiệm người dùng: Nghiên cứu về cách cải thiện trải nghiệm người dùng trên trang web bán hàng, bao gồm giao diện người dùng, tìm kiếm sản phẩm, quá trình thanh toán và tính năng tương tác khác Mục tiêu là tạo ra một trang web dễ sử dụng và thu hút khách hàng.
3 Đối tượng nghiên cứu và phạm vi nghiên cứu:
- Tìm hiểu về ngôn ngữ lập trình PHP để xây dựng phần back-end cho website- Sử dụng hệ quản trị cơ sở dữ liệu MySQL để xây dựng và quản trị cơ sở dữ liệu của website
- Nghiên cứu và sử dụng ngôn ngữ HTML, CSS, Javascript và thư viện Bootstrap để xây dựng giao diện website
- Tìm hiểu các nghiệp vụ của người dùng có trong website bán hàng online.
4 Kết quả dự kiến:
Trang 8- Hiểu được về ngôn ngữ lập trình PHP
- Hiểu được các nghiệp vụ của người dùng có trong website bán hàng online.
5 Phương pháp nghiên cứu:
- Tham khảo những tài liệu trên các trang mạng
- Tiếp thu những kiến thức đã được học và chỉ bảo của người hướng dẫn- Tự học những kiến thức và xem video có liên quan đến đề tài.
6 Kết quả báo cáo:
Báo cáo gồm có 4 chương như sau:Chương 1: Tổng quan về đề tài
Chương 2: Phân tích thiết kế hệ thống
Chương 3: Các công nghệ được sử dụng trong đề tàiChương 4: Xây dựng trang web
CHƯƠNG 1: TỔNG QUAN VỀ ĐỀ TÀI
Trang 9I Giới thiệu chung
1 Giới thiệu về công ty:
Công ty TNHH Sejin Electronic Vina là doanh nghiệp 100% vốn đầu tư Hàn Quốc, được thành tháng 2/2017, chuyên sản xuất dây tai nghe cung cấp cho Công ty TNHH Youngbo Vina (khu công nghiệp Quế Võ, Bắc Ninh) Hiện công ty có hơn 600 lao động.
Mặc dù mới đi vào hoạt động chưa lâu và tình hình sản xuất, kinh doanh còn nhiều khó khăn, nhưng Sejin Electronic Vina luôn nỗ lực hết mình để đảm bảo đời sống tốt nhất cho nhân sự bằng nhiều giải pháp thiết thực Trong đó, công ty đặc biệt chú trọng tới việc cải thiện môi trường làm việc, để nhân sự đảm bảo sức khỏe, an toàn khi làm việc Công ty lắp đặt điều hòa nhiệt độ làm mát tại xưởng sản xuất và nhà ăn; trang bị đầy đủ bảo hộ lao động cho người lao động; thường xuyên kiểm tra máy móc, trang thiết bị nhằm khắc phục những nguy cơ mất an toàn lao động; duy trì thường xuyên công tác vệ sinh trong và ngoài nhà xưởng, đảm bảo môi trường sản xuất luôn xanh – sạch – đẹp Đặc biệt, để giúp nhân sự nắm chắc những kiến thức cơ bản, tránh những rủi ro, sự cố không đáng có trong quá trình sản xuất, công ty phối hợp với các cơ quan chức năng tổ chức tập huấn, tuyên truyền về an toàn lao động, diễn tập phòng chống cháy nổ.
2 Phạm vi đề tài:
- Báo cáo sẽ tập trung trình bày sản phẩm của đề tài thông qua việc vận dụng các công nghệ web front-end như :HTML5,CSS3,Javascript,bootstrap… và công nghệ backend như :PHP ,hệ quản trị cơ sở dữ liệu MySQL.
- Sau khi tìm hiểu , em sẽ vận dụng kết hợp kết quả tìm hiểu được vào việc xâydựng trang web cửa hàng tiện lợi nhằm minh họa cho phần lý thuyết đã trình bày.
Trang 103 Giới thiệu về công nghệ web front-end:
- HTML (Hypertext Markup Language-Ngôn ngữ đánh dấu siêu văn bản) làngôn ngữ đánh dấu chuẩn dùng soạn thảo các tài liệu World Wide Web, chỉ rõmột trang Web được hiển thị như thế nào trong trình duyệt Ngôn ngữ HTML dùngcác tag hoặc các đoạn mã lệnh để chỉ cho các trình duyệt (Web browsers) cách hiển thị các thành phần của trang như text và graphics HTML là ngôn ngữ xác định cấu trúc của thông tin HTML sử dụng một loạt các thẻ và thuộc tính và được dùng để hiện thị văn bản và các thông tin khác, cung cấp siêu liên kết tới các tài liệu khác Thiết kế được nội dung và hình thức của trang web Xuất bản được các tài liệu trực tuyến hay truy xuất các thông tin trực tuyến bằng cách dùng các liên kết được chèn vào trang web Tạo ra các biểu mẫu trực tuyến nhằm thu thập các thông tin người dùng, quản lý giao dịch….Thêm vào đối tượng các hình ảnh video,âm thanh…
- Định dạng của HTML:
Là một tập tin có phần mở rộng là htm hoặc html
Là một tập tin văn bản thuần túy, có chứa các mã đặc biệt gọi là Tag(thẻ),thường được đặt xung quanh một khối văn bản nào đó.
Có thể viết trên nhiều trình soạn thảo: Microsoft Fontpage, notepad…và đượcsử dụng nhiều nhất đó là adobe dreamweaver.
- CSS (Cascading Style Sheets) là một ngôn ngữ quy định cách trình bày chocác tài liệu viết bằng HTML, XHTML, XML, SVG, hay UML,…
CSS cung cấp nhiều thuộc tính trình bày dành cho các đối tượng với sự sáng
Trang 11tạo trong việc kết hợp các thuộc tính giúp mang lại hiệu quả cao CSS đã được hỗ trợ bởi tất cả các trình duyệt và hiển thị “như nhau” trên mọi hệ điều hành CSS đưa ra phương thức áp dụng từ một file CSS ở ngoài Có hiệu quả đồng bộ khi tạo một website có hàng trăm trang hay khi muốn thay đổi một thuộctính trình bày nào đó CSS được cập nhật liên tục mang lại các trình bày phức tạpvà tinh vi hơn.
- Javascript với HTML chỉ biểu diễn thông tin chứ chưa phải là các trang Web động có khả năng đáp ứng các sự kiện từ phía người dùng Hãng Netscape đã đưa ra ngôn ngữ script có tên là LiveScript để thực hiện chức năng này Sau đó đổi tên thành JavaScript để tận dụng tính đại chúng của ngôn ngữ lập trình Java JavaScript là ngôn ngữ dưới dạng script có thể gắn với các file HTML Được trình duyệt diễn dịch, trình duyệt đọc JavaScript dưới dạng mã nguồn JavaScript là ngôn ngữ dựa trên đối tượng, nghĩa là bao gồm nhiều kiểu đối tượng, ví dụ đối tượng Math với tất cả các chức năng toán học Nhưng JavaScriptkhông là ngôn ngữ hướng đối tượng như C++/Java.
- PHP là ngôn ngữ lập trình phổ biến và được nhiều người ưu chuộng Trong thiết kế web chuyển nghiệp, có khoảng 1/3 số website đang hoạt động sử dụng nền tảng này, điển hình là WordPress, Facebook và Yahoo Theo định nghĩa chuyên môn, ngôn ngữ thiết kế web PHP (viết tắt của Personal Home Page) là một ngôn ngữ lập trình script (một nhánh của ngôn ngữ lập trình) hay một loại mã lệnh chủ yếu được dùng để phát triển các ứng dụng viết cho máy chủ, mã nguồn mở, dùng cho mục đích tổng quát PHP hiện rất phổ biến và được dùng để giảng dạy trong nhiều cơ sở, trung tâm nghiên cứu…
- Bootstrap là một framework front-end phổ biến được xây dựng trên HTML, CSS và JavaScript Nó cung cấp các công cụ và tài nguyên để tạo giao diện người
Trang 12dùng linh hoạt và thân thiện với di động Bootstrap cung cấp các template, các class CSS đã được định nghĩa sẵn và các thành phần giao diện để giúp việc xây dựng trang web nhanh chóng và dễ dàng hơn.
- Framework và thư viện front-end: Có nhiều framework và thư viện front-end như React, Angular, Vue.js, Bootstrap, và Foundation được sử dụng để tăng cườngkhả năng phát triển và quản lý mã nguồn front-end Các framework và thư viện nàycung cấp các thành phần giao diện sẵn có, quản lý trạng thái ứng dụng, và cung cấpcác tính năng tối ưu hóa hiệu suất Công cụ quản lý mã nguồn và xây dựng:
xây dựng mã nguồn front-end một cách hiệu quả.
4 Giới thiệu sản phẩm:
- Tên sản phẩm: Web cửa hàng tiện lợi GROCERY SHOPPY
- Web cửa hàng tiện lợi GROCERY SHOPPY là một nền tảng dễ sử dụng và thuận tiện với người dùng, cung cấp trải nghiệm mua sắm tốt cho người sử dụng.
II Yêu cầu sản phẩm
- Giao diện người dùng hấp dẫn:
Thiết kế giao diện người dùng thân thiện, dễ sử dụng và hấp dẫn với người dùng.
Đảm bảo tương thích trên các thiết bị và màn hình khác nhau, bao gồm cả máy tính, điện thoại di động và máy tính bảng.
- Chức năng tìm kiếm sản phẩm:
Cung cấp chức năng tìm kiếm sản phẩm linh hoạt và hiệu quả, bao gồm tìm kiếm theo tên sản phẩm, thương hiệu, loại găng tay, kích cỡ, màu sắc và giá cả.
Trang 13- Chức năng giỏ hàng và thanh toán:
Cho phép người dùng thêm sản phẩm vào giỏ hàng và quản lý giỏ hàng của mình.
Đảm bảo trang web hoạt động mượt mà và nhanh chóng trên các thiết bị và mạng kết nối khác nhau Tối ưu hóa tải trang và thời gian đáp ứng của trangweb.
Trang 142.2 Phân tích các yêu cầu và chức năng
2.2.1 Biểu đồ use case tổng quan của hệ thống:
Hình 1 Biểu đồ use case tổng
2.2.2 Đặc tả use case
Trang 15Đặc tả use case đăng nhập:
Tên use caseĐăng nhập
Mô tả Usecase cho phép khách hàng đăng nhập vào hệ thống để có thể thêm giỏ hàng, đặt hàng; quản trị viên có thể quản lý hệ thống cửa hàng của mình
Điều kiện kích hoạt
Người dùng chọn chức năng đăng nhập từ hệ thốngTiền điều kiệnNgười dùng đã đăng ký tài khoản
Hậu điều kiệnĐăng nhập thành công
Bảng 1: Đặc tả use case đăng nhập
Đặc tả use case đăng ký: Tên use caseĐăng ký
Mô tả Usecase cho phép khách hàng đăng ký tài khoản tại website
Điều kiện kích hoạt
Người dùng chọn chức năng đăng ký từ hệ thốngTiền điều kiệnNgười dùng chưa có tài khoản trên hệ thốngHậu điều kiệnĐăng ký thành công
Bảng 2: Đặc tả use case đăng ký
Đặc tả use case thêm giỏ hàng: Tên use caseThêm giỏ hàng
Mô tả Usecase cho phép khách hàng thêm sản phẩm vào giỏ hàng
Điều kiện kích hoạt
Người dùng chọn chức năng thêm vào giỏ hàng
Tiền điều kiệnNgười dùng chọn bất kì một sản phẩm xong bấm thêm vào giỏ hàng
Trang 16Bảng 3: Đặc tả use thêm giỏ hàng
Đặc tả use case đặt hàng:
Tên use caseĐặt hàng
Mô tả Usecase cho phép khách hàng đặt hàng
Điều kiện kích hoạt
Người dùng chọn chức năng đặt hàng
Tiền điều kiệnNgười dùng sau khi thêm giỏ hàng và bấm nút đặt hàngHậu điều kiệnĐặt hàng thành công
Bảng 4: Đặc tả use case đặt hàng
Đặc tả use case quản lý danh mục:
Tên use caseQuản lý danh mục
Mô tả Usecase cho phép quản trị viên thêm, sửa, xóa danh mục sảnphẩm
Điều kiện kích hoạt
Người dùng nhấn vào mục tạo mới, chỉnh sửa, xóa
Tiền điều kiệnNgười dùng sau khi đăng nhập thành công vào hệ thống và ởmục quản lý danh mục sản phẩm
Hậu điều kiệnHệ thống cập nhật danh sách danh mục sản phẩm
Bảng 5: Đặc tả use case quản lý danh mục
Đặc tả use case quản lý sản phẩm:
Tên use caseQuản lý sản phẩm
Mô tả Usecase cho phép quản trị viên thêm, sửa, xóa sản phẩm
Điều kiện kích hoạt
Người dùng nhấn vào mục tạo mới, chỉnh sửa, xóa
Tiền điều kiệnNgười dùng sau khi đăng nhập thành công vào hệ thống và ở
Trang 17mục quản lý sản phẩm
Hậu điều kiệnHệ thống cập nhật danh sách sản phẩm
Bảng 6: Đặc tả use case quản lý sản phẩm
Đặc tả use case quản lý đơn hàng:
Tên use caseQuản lý đơn hàng
Mô tả Usecase cho phép quản trị viên cập nhật trạng thái đơn hàng
Điều kiện kích hoạt
Người dùng nhấn vào mục cập nhật trạng thái
Tiền điều kiệnNgười dùng sau khi đăng nhập thành công vào hệ thống và ởmục quản lý đơn hàng
Hậu điều kiệnHệ thống cập nhật danh sách đơn hàng
Bảng 7: Đặc tả use case quản lý đơn hàng
2.3 Phân tích yêu cầu phi chức năng2.3.1 Yêu cầu bảo mật:
Yêu cầu bảo mật cho trang Web cửa hàng tiện lợi GROCERY SHOPPY rất quan trọng để đảm bảo an toàn cho thông tin cá nhân của người dùng và dữ liệu thanh toán Dưới đây là một số yêu cầu bảo mật cơ bản cần được áp dụng:
- Mã hóa dữ liệu: Sử dụng kỹ thuật mã hóa dữ liệu để bảo vệ thông tin cá nhân của người dùng và dữ liệu thanh toán khi chúng được truyền qua mạng.
- Xác thực người dùng: Cung cấp chức năng đăng nhập an toàn bằng cách sử dụng mã xác thực hai yếu tố hoặc công nghệ xác thực đa yếu tố để ngăn chặn truy cập trái phép.
- Quản lý phiên làm việc (Session Management): Đảm bảo việc quản lý phiên làm việc được thực hiện một cách an toàn để ngăn chặn các cuộc tấn công như sessionhijacking và session fixation.