TỔNG QUAN VỀ ĐỀ TÀI
Xây dựng Website bán điện thoại di động
2 Lý do chọn đề tài
Ngày nay, việc sử dụng website trong phát triển kinh doanh đã trở nên phổ biến và hiệu quả, đặc biệt trong ngành thương mại Các cửa hàng và công ty đang tận dụng website để giới thiệu và quảng bá sản phẩm, đáp ứng nhu cầu tìm kiếm và mua sắm trực tuyến của giới trẻ, đặc biệt là những người đam mê công nghệ Do đó, tôi quyết định thực hiện đề tài này nhằm mang đến nhiều sự lựa chọn hơn cho khách hàng và mở rộng quy mô phát triển của cửa hàng.
Xây dựng một website bán hàng trực tuyến giúp giới thiệu và quảng bá sản phẩm hiệu quả, cho phép khách hàng đặt hàng theo yêu cầu Với đa dạng sản phẩm và mức giá hợp lý, website sẽ thu hút được nhiều khách hàng và tăng cường doanh thu.
Xây dựng một website chuyên cung cấp thông tin chi tiết về sản phẩm, bao gồm thông tin liên hệ và cập nhật thường xuyên các sản phẩm mới nhất, giúp khách hàng dễ dàng tiếp cận và nắm bắt thông tin cần thiết.
- Khách hàng có thể đặt hàng ngay những sản phẩm mà khách hàng yêu thích
- Tạo ra sản phẩm thân thiện, đơn giản với giao diện tự nhiên, bắt mắt, dễ sử dụng cho tất cả mọi người
- Xây dựng một website giúp người quản trị quản lý thông tin hệ thống một cách dễ dàng hơn, tiện lợi hơn
- Củng cố và bổ sung kiến thức các môn đã học Qua đó, rèn luyện kỹ năng làm việc độc lập
- Từ đề tài này có thể mở rộng ra và ứng dụng cho các đề tài khác có liên quan
- Từ các yêu cầu đặt ra của đề tài tiến hành phân tích và đưa ra hướng giải quyết theo các bước sau:
- Tìm hiểu về các website tương tự để xây dựng các chức năng sao cho phù hợp với đa phần thị hiếu của người sử dụng hiện nay
Tiến hành nghiên cứu các khái niệm liên quan và phân tích thông tin từ khảo sát để xác định các chức năng dự kiến sẽ được tích hợp vào website.
- Tìm hiểu về các nội dung cần có của một trang web bán hàng điện tử, từ đó đưa ra các giải pháp để tiến hành xây dựng
- Lựa chọn và cài đặt các công cụ, phần mềm phù hợp cho việc thiết kế website
- Bắt tay vào việc xây dựng website
- Tiến hành kiểm tra và chạy thử
- Thay đổi, bổ sung, khắc phục các lỗi để website hoàn chỉnh hơn
6.Ý nghĩa thực tiễn đề tài
- Ý nghĩa với doanh nghiệp, cá nhân của website:
Website được thiết kế để quảng bá thông tin về sản phẩm và dịch vụ của hệ thống đến một lượng lớn khách hàng, từ đó tăng cường lượng truy cập và doanh thu Ngoài ra, việc sử dụng website còn giúp doanh nghiệp và cá nhân tiết kiệm chi phí hiệu quả.
- Ý nghĩa đối với khách hàng:
- Giúp cho người sử dụng có thể nhanh chóng lựa chọn những món hàng mà mình muốn đặt mà không cần đến cửa hàng
- Ý nghĩa đối với cá nhân sinh viên:
Dự án này cho phép em tạo ra một website với giao diện thân thiện, dễ sử dụng, giúp người dùng dễ dàng truy cập thông tin và quản lý nội dung hiệu quả.
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
NHỮNG GIẢI PHÁP, CÔNG NGHỆ TRANG WEB
Ngôn ngữ HTML
HTML (HyperText Markup Language) là ngôn ngữ đánh dấu siêu văn bản dùng để tạo ra các tài liệu có thể truy cập trên internet Tài liệu HTML được xây dựng từ các thẻ và phần tử, được lưu trữ trên máy chủ web với đuôi ".htm" hoặc ".html" Trình duyệt sẽ đọc và hiển thị các tệp HTML dưới dạng trang web, ẩn đi các thẻ và chỉ hiển thị nội dung văn bản cùng các đối tượng như hình ảnh và media Các trang HTML được truyền qua mạng thông qua giao thức HTTP HTML không chỉ cho phép nhúng hình ảnh và âm thanh mà còn hỗ trợ các ngôn ngữ kịch bản như Javascript để tạo hiệu ứng động cho trang Để nâng cao hiệu quả trình bày, HTML thường được kết hợp với CSS.
HTML là một chuẩn ngôn ngữ internet do tổ chức World Wide Web Consortium (W3C) phát triển, tương thích với mọi hệ điều hành và trình duyệt Với khả năng dễ học và viết, người dùng có thể soạn thảo HTML bằng các trình soạn thảo văn bản như Word hay Notepad và lưu với định dạng ".html" hoặc ".htm" Phiên bản mới nhất, HTML5, mang lại nhiều tính năng vượt trội, đặc biệt là hỗ trợ mạnh mẽ cho các phần tử multimedia mà không cần plugin Tập tin HTML bao gồm các đoạn văn bản được tạo thành từ các thẻ HTML, và HTML5 cải thiện đáng kể về tốc độ, tính thích ứng, cũng như khả năng hỗ trợ API và DOM.
Ngôn ngữ CSS
CSS (Cascading Style Sheets) là ngôn ngữ dùng để định dạng và trình bày các tài liệu HTML, XHTML, XML, SVG, và UML Nó quy định cách hiển thị của các thẻ HTML thông qua việc thiết lập các thuộc tính như font chữ, kích thước và màu sắc.
CSS có cấu trúc đơn giản và sử dụng từ tiếng Anh để đặt tên thuộc tính Người dùng có thể viết CSS trực tiếp trong mã HTML hoặc tham chiếu từ file CSS riêng biệt, thường có đuôi ".css" Việc này giúp mã HTML trở nên ngắn gọn hơn và cho phép sử dụng một file CSS cho nhiều website, tiết kiệm thời gian và công sức Đặc biệt, tính kế thừa của CSS giúp giảm số lượng dòng code mà vẫn đáp ứng được yêu cầu thiết kế.
Các trình duyệt hiểu CSS theo cách riêng, dẫn đến sự không thống nhất trong việc trình bày nội dung CSS cung cấp hàng trăm thuộc tính trình bày, cho phép người dùng sáng tạo và kết hợp các thuộc tính để đạt hiệu quả tốt nhất.
Ngôn ngữ lập trình PHP
PHP (Hypertext Preprocessor) là ngôn ngữ lập trình kịch bản mã nguồn mở, chủ yếu dùng để phát triển ứng dụng web Với cú pháp giống C và Java, PHP dễ học và cho phép phát triển nhanh chóng Tập tin PHP có phần mở rộng *.php, có thể chứa HTML, CSS, Javascript, Jquery và mã nguồn PHP Khi người dùng yêu cầu truy cập trang web, server sẽ chuyển đổi mã nguồn PHP thành HTML để trình duyệt hiển thị, vì trình duyệt chỉ đọc được mã HTML PHP đã trở thành ngôn ngữ lập trình web phổ biến nhất nhờ vào tốc độ và tính linh hoạt của nó.
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
Cài đặt Xampp
XAMPP là viết tắt của X + Apache + Mysql + PHP + Perl, một trong những phần mềm tạo Websever đang được nhiều người sử dụng trong những năm gần đây
Những ứng dụng được cài đặt từ XAMPP
6 Tomcat (with mod_proxy_ajp as connector)
8 XAMPP Control Panel (from hackattack142)
Bước 1: Sau khi download thành công, bạn chạy file vừa tải về để cài đặt Xampp
Bước 2: Bạn nhấn Next ở màn hình tiếp theo lựa chọn các service kèm theo XAMPP
Bước 3:Theo mặc định XAMPP sẽ được cài đặt theo đường dẫn C:\xampp, bạn có thể thay đổi vị trí lưu vào ổ đĩa khác tùy ý
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
Bước 4:Quá trình cài đặt Xampp đang thực thi
Bước 5:Bạn nhấn vào nút Finish kết thúc
Lập trình cơ sở dữ liệu MySQL
• mysql_connect(, ,);
Host là địa chỉ của máy chủ MySQL, có thể là tên hoặc địa chỉ IP; nếu là máy nội bộ, hãy sử dụng localhost Hàm này sẽ trả về một kết nối hoặc giá trị false nếu không thể kết nối.
$Conn mysql_connect("localhost""root","root");
MySQL Server có thể chứa nhiều CSDL, hàm sau để chọn CSDL muốn dùng
• mysql_select_db(Ten Database L.Tenket Noi]);
TenDatabase: là tên cơ sở dữ liệu muốn dùng
Tên Kết Nối: là biển connection tra về do hàm mysql connect Tên kết nối có thể bỏ qua cũng được
5.3 Thực thi các câu lệnh truy vấn
Hàm trả về giá trị true khi câu lệnh truy vấn được thực thi thành công, ngoại trừ câu lệnh select Đối với câu lệnh select, hàm sẽ trả về một recordset (bảng dữ liệu) nếu thực thi thành công.
Hàm trả về false nếu câu lệnh truy vẫn không được thực hiện
• mysql_fetch_array($TenRecordSet, mode);
Hàm trả về 1 mảng kết quả chứa thông tin của record hiện hành hoặc giả trị false nếu record rỗng, đồng thời di chuyển con trõ sang record kế
Mode là một trong những giá trị:
MYSQL_NUM : mang kết quả gồm các phần tử đánh theo số
MYSQL_ASSOC mảng kết quả gồm các phần từ đánh theo key
MYSQL_BOTH: Các phần tư của mảng kết quả gấp đôi Các phần tử đầu theo số, các phần tử sau theo key
• Srow-mysql_fetch_row(STen Recordset);
Hàm trà về 1 mảng kết quả chứa thông tin của record hiện hành hoặc giá trị false nếu record rỗng, đồng thời di chuyển con trỏ sang record kế
Mảng kết quả gồm các phần tử đánh theo chỉ số
• $row=mysql_fetch_assoc{$TenRecordSet);
Hàm trả về 1 mảng kết quả chứa thông tin của record hiện hành hoặc giá trị false nếu record rỗng, đồng thời di chuyển con trỏ sang record kế
Mảng kết quá gồm các phần từ đánh theo key
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
5.5 Đếm số record trong recordset
Ví dụ: echo mysql_num_rows($kq)
5.6 Lấy ID vừa mới cập nhật
Trong 1 bảng, nếu khóa chính được khai báo theo kiểu auto_increament thì sau khi thêm mới record, có thể lấy giá trị vừa mới cập nhật bằng hàm này (Lấy để đưa vào các bảng khác làm khóa ngoại) mysql_insert_id);
Bảng LoaiTin hiện có 3 record có id là 1,2,3 mysql_query("insert into Loai Tin (Ten) values('Nhip cầu tâm sự); echo mysql insert_id(): //4
5.7 Thông báo lỗi của MYSQL
$kq=mysql_query("Delete from sanpham") or die(mysql_error()):
5.8 Nhảy đến 1 record trong recordset
• mysql_data_seek($TenRecordset ThuTaRecord);
Ví dụ: mysql_data_seek($rdLT,0);
Ví dụ: mysql_close($conn);
Lập trình PHP Laravel Framework
Laravel là một framework PHP mã nguồn mở và miễn phí, được phát triển bởi Taylor Otwell, nhằm hỗ trợ phát triển ứng dụng web theo cấu trúc model-view-controller (MVC) Framework này nổi bật với cú pháp dễ hiểu, hệ thống đóng gói Modular, quản lý gói phụ thuộc hiệu quả, cùng với nhiều phương thức truy cập cơ sở dữ liệu quan hệ và các tiện ích hỗ trợ bảo trì ứng dụng.
Vào tháng 3 năm 2015, Laravel đã được bình chọn là PHP framework phổ biến nhất, vượt qua các đối thủ như Symfony2, Nette, CodeIgniter và Yii2 Trước đó, vào tháng 8 năm 2014, Laravel cũng đã trở thành dự án PHP được theo dõi nhiều nhất trên Github.
• Laravel được phát hành theo giấy phép MIT, với source code được lưu trữ tại Gitthub
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
• Sau khi cài đặt xong Composer, Xampp, gitbash
• Bước 1: Truy cập vào htdocs của xampp
• Bước 2: Nhấn phím “shift” và click chuột phải chọn “ open power shell window here”
• Bước 3: Gõ lệnh : composer global require “laravel/installer”
• Bước 4: Sau khi hoàn thành gõ lệnh: “laravel new blog”
• Chú ý blog là : tên bạn muốn cài đặt ( có thể đổi tên khác)
• Bước 5 Mở file.env cấu hình thông tin db, url cho ứng dụng
• Bước 7: Mở file config/app.php sửa lại time zone và locade nếu cần
6.3 Mô hình MVC là gì?
• Model: Chính là dự liệu ( cụ thể hơn trong ZF sẽ là các class làm nhiệm vụ thao tác trực tiếp xuống DBMS)
Mô hình Views có vai trò kết nối với Mô hình Model và hiển thị dữ liệu ra trình duyệt theo nhu cầu của người dùng, chủ yếu thông qua các văn bản HTML.
• View : Làm nhiệm vụ render trang web từ các action do Controller truyền sang + dữ liệu từ model ( có thể hiểu nó như template render)
The controller is the core component that operates your website, allowing for multiple modules, similar to Joomla components Each module can contain several controllers, and each controller encompasses various actions.
• Ví dụ trong Forum sẽ có Post Controller bao gồm các action như listAction, readAction, writeAction,…
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ HỆ THỐNG
Tác nhân sử dụng
Từ mô tả bài toán, ta có thể liệt kê ra các tác nhân sử dụng sau :
Quản lý (Admin) là người có quyền quản trị trang web, đảm nhiệm việc đăng nhập vào tài khoản với quyền hạn toàn diện Admin có khả năng cấu hình, thêm, sửa, xóa cơ sở dữ liệu, theo dõi chi tiết đơn hàng và quản lý thông tin về danh mục, sản phẩm, nhà cung cấp cũng như các đơn đặt hàng.
Khách hàng là những cá nhân hoặc công ty cần mua sản phẩm trực tuyến, có thể chọn các hãng điện thoại yêu thích Họ tham quan cửa hàng, lựa chọn sản phẩm từ nhiều thương hiệu khác nhau và thêm vào giỏ hàng để tạo đơn đặt hàng cho nhà quản trị Khách hàng đã đăng ký tài khoản và mật khẩu, giúp thuận tiện cho các giao dịch sau này Họ cũng có cơ hội nhận các chương trình khuyến mãi và giảm giá từ cửa hàng (nếu có).
Khách hàng vãn lai (Free User) là những người chỉ tham khảo sản phẩm trong danh mục mà chưa thực hiện giao dịch mua Để có thể mua sản phẩm, khách vãn lai cần đăng ký tài khoản thành viên.
Một số biểu đồ
1.Biểu đồ tuần tự chức năng đăng nhập
Hình 10: Biểu đồ tuần tự chức năng đăng nhập
2 Biểu đồ tuần tự chức năng thêm ,sửa ,xóa sản phẩm
Hình 11: Biểu đồ tuần tự chức năng thêm sản phẩm
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
Hình 12 : Biểu đồ tuần tự chức năng sửa sản phẩm
Hình 13 : Biểu đồ tuần tự chức năng xóa sản phẩm
3.Biểu đồ hoạt động chức năng tìm kiếm sản phẩm
Hình 14 : Biểu đồ hoạt động chức năng tìm kiếm sản phẩm
Sơ đồ chức năng (Usecase Diagram)
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
1 Sơ đồ Usecase tổng quát
Hình 15 : Sơ đồ Usecase tổng quát
Hình 16: Sơ đồ chức năng Khách hàng
Khách hàng có thể đăng ký vào hệ thống bằng cách cung cấp các thông tin cần thiết như Họ và tên, Email, Mật khẩu và Số điện thoại Sau khi hoàn tất điền thông tin và nhấn nút đăng ký, hệ thống sẽ thông báo kết quả đăng ký thành công và đưa khách hàng trở về trang chủ.
Chức năng đăng nhập yêu cầu người dùng nhập email và mật khẩu vào khung đăng nhập Hệ thống sẽ kiểm tra thông tin, và nếu chính xác, người dùng sẽ được truy cập vào hệ thống Sau khi hoàn tất việc sử dụng, người dùng có thể thực hiện đăng xuất một cách dễ dàng.
Người dùng có thể xem tên và giá của các sản phẩm Khi nhấn vào sản phẩm mong muốn, hệ thống sẽ tự động hiển thị thông tin chi tiết về sản phẩm đó.
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
Chức năng tìm kiếm cho phép người dùng dễ dàng tìm tên và thông tin sản phẩm mong muốn Khi người dùng nhập từ khóa, hệ thống sẽ tự động hiển thị danh sách các sản phẩm phù hợp Người dùng chỉ cần nhấn vào sản phẩm để xem chi tiết thông tin.
Khi người dùng đăng ký và đăng nhập, hệ thống tự động lưu trữ thông tin của họ Người dùng có thể dễ dàng đặt hàng và điền vào mẫu thông tin liên hệ chính xác Sau đó, công ty sẽ liên hệ trực tiếp với người dùng và lưu lại sản phẩm đã chọn.
Hình 17: Sơ đồ chức năng giỏ hàng
➢ Quản lý thêm sản phẩm vào giỏ hàng
Hình 18: Sơ đồ chức năng thêm sản phẩm vào giỏ hàng
Hình 19: Sơ đồ chức năng đặt hàng
3 Chức năng của Quản lý
Hình 20: Sơ đồ chức năng Quản lý
Chức năng quản lý yêu cầu người dùng nhập email và mật khẩu để xác thực truy cập vào hệ thống Sau khi hoàn tất công việc, quản lý có thể đăng xuất Hệ thống cho phép quản lý thực hiện các thao tác xem, thêm, sửa, và xóa danh mục cũng như sản phẩm một cách dễ dàng.
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
Hình 21: Sơ đồ chức năng Quản lý danh mục
Chức năng quản lý yêu cầu người dùng nhập email và mật khẩu để truy cập hệ thống Sau khi xác nhận thông tin, người quản lý có thể sử dụng các tính năng như xem, thêm, sửa và xóa danh mục Khi hoàn tất công việc, người quản lý có thể đăng xuất khỏi hệ thống một cách dễ dàng.
Hình 22: Sơ đồ chức năng Quản lý Khách hàng
Quản lý cần nhập email và mật khẩu để truy cập vào hệ thống, sau khi được xác nhận Sau khi hoàn tất công việc, quản lý có thể đăng xuất khỏi hệ thống Ngoài ra, quản lý khách hàng có khả năng xem chi tiết thông tin khách hàng để thực hiện liên hệ trực tiếp.
Hình 23: Sơ đồ chức năng quản lí sản phẩm
Quản lý cần nhập email và mật khẩu để truy cập hệ thống, sau khi được xác nhận Sau khi hoàn tất công việc, quản lý có thể đăng xuất khỏi hệ thống Ngoài ra, quản lý có quyền xem, thêm, sửa và xóa sản phẩm trong mục quản lý.
Hình 24: Sơ đồ chức năng quản lí tài khoản
Chức năng quản lý yêu cầu người dùng nhập email và mật khẩu để xác thực truy cập vào hệ thống Sau khi hoàn tất công việc, người quản lý có thể đăng xuất Ngoài ra, họ cũng có thể xem, đổi mật khẩu, cùng với việc thêm, sửa và xóa tài khoản trong phần quản lý.
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
KẾT QUẢ ĐẠT ĐƯỢC
Giao diện đăng kí , đăng nhập
Người dùng muốn vào hệ thống của mình thì phải đăng nhập đúng theo tài khoản của mình đã được quản trị hệ thống cấp.
Hình 26: Giao diện đăng nhập
Để đăng nhập vào hệ thống, người dùng chưa có tài khoản cần nhấp vào liên kết "Bạn chưa có tài khoản" và điền đầy đủ thông tin theo đúng định dạng để hoàn tất quá trình đăng ký thành công.
Hình 27: Giao diện đăng kí
Giao diện tìm kiếm sản phẩm
Trên giao diện trang chủ, người dùng có thể dễ dàng tìm kiếm sản phẩm mong muốn bằng cách nhập tên hãng điện thoại, tên điện thoại hoặc một số ký tự liên quan đến sản phẩm cần tìm.
Hình 28: Giao diện tìm kiếm sản phẩm
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
Giao diện thông tin sản phẩm
Giao diện thông tin sản phẩm cho phép người dùng xem chi tiết thông tin và các thông số đánh giá của sản phẩm một cách rõ ràng và dễ hiểu.
Giao diện giỏ hàng
Hình 30: Giao diện giỏ hàng
Giao diện đặt hàng
Hình 31: Giao diện đặt hàng
Giao diện quản trị
Hình 32: Giao diện quản trị
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
Giao diện sản phẩm
Hình 33: Giao diện tất cả sản phẩm
Giao diện sửa sản phẩm
Hình 34: Giao diện sửa sản phẩm
Giao diện thêm sản phẩm
Hình 35: Giao diện thêm sản phẩm
Khoa khoa học máy tính – Lớp19i1 Phạm Biên
