I. Tổng quan về website thương mại điện tử
Website thương mại điện tử là một hình thức trang web bán hàng, kinh doanh trực tuyến (online) được lên ý tưởng, thiết kế và xây dựng theo các trang web thương mại điện tử, bán hàng trực tuyến hiện có như Yame, Coolmate và Catsa, ... Với đối tượng hướng tới sẽ là những người cần một trang web dễ sử dụng, đẹp mắt, đầy đủ các tính năng cần thiết để phục vụ cho việc mua bán các sản phẩm theo hình thức trực tuyến.
.jpg)
Hình 1: Website bán hàng online
Trang web hướng tới 2 loại đối tượng sử dụng chính:
- Quản trị viên bên phía admin dùng để thực hiện các công việc như quản lý sản phẩm, thể loại, đơn hàng, đăng ký, đăng nhập, …
- Người mua hàng bên phía client thực hiện các công việc cụ thể như xem danh sách sản phẩm hiện có, xem chi tiết sản phẩm, tìm kiếm sản phẩm, quản lý giỏ hàng, đặt hàng, thanh toán, xem lịch sử và tình trạng đơn hàng, …
Trong các chương tiếp theo sẽ trình bày rõ ràng và chi tiết hơn về các tính năng cũng như cách thức hoạt động của trang web.
II. Giới thiệu về ngôn ngữ, tài nguyên xây dựng website
2.1 Ngôn ngữ PHP
Ngôn ngữ PHP (Hypertext Preprocessor):
- Là ngôn ngữ lập trình kịch bản mã nguồn mở trên server, được thiết kế để dễ dàng xây dựng các trang web động.
- Mã PHP có thể thực thi trên web server để tạo ra mã HTML và xuất ra trình duyệt web theo yêu cầu của người sử dụng.
- Ngôn ngữ PHP ra đời năm 1994 bởi Rasmus Lerdorf, sau đó được phát triển bởi nhiều người và trải qua nhiều phiên bản.
- Phiên bản hiện tại là PHP 8 đã được công bố 11/2020.
2.2 Cài đặt môi trường
Cần gì để chạy PHP
Để có thể chạy PHP bạn chỉ cần download và cài đặt ba thứ sau:
- Download PHP ở địa chỉ: http://www.php.net/downloads.php.
- Download MySQL Database ở địa chỉ http://www.mysql.com/downloads/index.html.
- Download Apache Server ở địa chỉ http://httpd.apache.org/download.cgi. Cả ba thứ này đều được tích hợp vào một phần mềm XAMPP. Bạn chỉ cần cài đặt XAMPP là có đủ.
- Download XAMPP ở địa chỉ https://www.apachefriends.org/download.html
Xampp là gì?
- XAMPP là một phần mềm cho phép giả lập môi trường server hosting ngay trên máy tính của bạn, cho phép bạn chạy demo website mà không cần phải mua hosting hay VPS. Chính vì vậy, XAMPP hay được phục vụ cho hoạt động học tập giảng dạy thực hành và phát triển web.
.jpg)
Hình 2: Xampp
- XAMPP được viết tắt của X + Apache + MySQL + PHP + Perl vì nó được tích hợp sẵn Apache, MySQL, PHP, FTP server, Mail Server. Còn X thể hiện cho sự đa nền tảng của XAMPP vì nó có thể dùng được cho 4 hệ điều hành khác nhau: Windows, MacOS, Linux và Solaris.
Cách cài đặt XAMPP trên máy tính Windows
Bước 1: Download phần mềm: TẠI https://www.apachefriends.org/download.html
.jpg)
Hình 3: Tải phần mềm Xampp
Bước 2: Trong file vừa tải xuống, click chuột chọn tệp tin có đuôi .exe.
.jpg)
Hình 4: Phần mềm Xampp sau khi được tải
Bước 3: Cửa sổ Setup xuất hiện, nhấn Next
.jpg)
Hình 5: Quá trình cài dặt Xampp
Bước 4: Chọn thư mục để cài đặt (hoặc để mặc định là C:\xampp) > Nhấn Next
.jpg)
Hình 6: Quá trình cài dặt Xampp
Bước 5: Bỏ chọn phần Learn more about Bitnami for XAMPP > Nhấn Next 2 lần nữa để bắt đầu quá trình cài đặt XAMPP.
.jpg)
Hình 7: Quá trình cài dặt Xampp
Bước 6: Nhấn Finish để kết thúc cài đặt và mở bảng điều khiển của XAMPP
Khởi động Xampp
Bước 1: Mở Xampp từ menu Start hoặc biểu tượng Xampp trên Desktop.
Bước 2: Nhấn vào nút Start của 2 ứng dụng Apache và MySQL để bắt đầu khởi động web server. Khi 2 ứng dụng chuyển sang màu xanh thì localhost đã được khởi động.
.jpg)
Hình 8: Khởi động Xampp
Các dịch vụ cần thiết liên quan tới một Website PHP:
- Apache: một trong những máy chủ web phổ biến nhất hiện nay.
- MySQL: hệ quản trị cơ sở dữ liệu quan hệ (RDBMS) phổ biến, thường được sử dụng với PHP để lưu trữ và truy xuất dữ liệu.
Trong trường hợp gặp lỗi do trùng cổng với các dịch vụ khác, hãy thử thay đổi cổng sử dụng.
2.3 TẠO DỰ ÁN MỚI TRONG XAMPP
Chọn htdocs để mở thư mục gốc nơi Xampp lưu trữ các dự án web của bạn. Thông thường, thư mục này sẽ là C:\lxampp\htdocs.
Tạo dự án mang tên ‘webbanhang’ với cấu trúc thư mục như sau:
.jpg)
Hình 9: Cấu trúc thư mục dự án PHP
III. Kết quả thực hiện xây dựng trang web thương mại điện tử bằng phần mềm mã nguồn mở
3.1 Đăng nhập, đăng ký.
Để có thể đăng nhập thực hiện mua các sản phẩm trên website, khách hàng cần đăng ký để có tài khoản trong hệ thống.
.jpg)
Hình 10 Ảnh minh họa giao diện đăng ký
Sau khi đăng ký thành công, khách hàng giờ đây đã có thể sử dụng tài khoản vừa đăng ký để thực hiện đăng nhập và sử dụng các tính năng của một khách hàng trong website.
.jpg)
Hình 11 Ảnh minh họa giao diện đăng nhập
Kết quả đăng nhập thành công:
.jpg)
Kiểm tra database:
.jpg)
3.2 Xem danh sách sản phẩm, thêm, xóa , sửa sản phẩm.
Người dùng có thể theo dõi danh sách tất cả sản phẩm và tiến hành thêm, xóa, sửa các sản phẩm.
Trang hiển thị danh sách sản phẩm
.jpg)
Hình 12 Trang danh sách sản phẩm
Trang thêm sản phẩm:
.jpg)
Trang sửa sản phẩm
.jpg)
Kiểm tra Database:
.jpg)
3.3 Giỏ hàng và thanh toán.
Người dùng có thể thêm sản phẩm vào giỏ hàng, truy cập vào giỏ hàng để xem lại các sản phẩm và số lượng mà mình đã thêm vào. Tại đây, khách hàng có thể tuỳ chỉnh trực tiếp số lượng các sản phẩm cần mua hoặc xoá sản phẩm khỏi giỏ hàng.
Trang danh sách sản phẩm:
.jpg)
Hình 15 Ảnh minh hoạ giao diện thêm sản phẩm vào giỏ hàng
Trang giỏ hàng:
.jpg)
Hình 16 Ảnh minh hoạ giao diện giỏ hàng
Sau khi đã xác định các món hàng trong giỏ hàng, người dùng sẽ nhấn nút mua hàng để thực hiện đặt hàng, chức năng này yêu cầu người dùng đã thực hiện đăng nhập trước.
Trang thanh toán:
.jpg)
Hình 17 Ảnh minh hoạ giao diện đặt hàng hình thức thu hộ
Tại giao diện này, khách hàng có thể xem lại tổng tiền hàng. Để có thể thực hiện thanh toán khách hàng cần điền đầy đủ thông tin vào biểu mẫu gồm các thông tin như họ tên người nhận, số điện thoại người nhận, địa chỉ nhận…
Sau khi quá trình thanh toán diễn ra thành công, hệ thống sẽ thực hiện chuyển trang xác nhận đơn hàng.
Xác nhận đơn hàng
.jpg)
Hình 18 Ảnh minh hoạ giao diện xác nhận đơn hàng
Kiểm tra database:
Bảng order_detail:
.jpg)
Bảng order
Thông tin đơn hàng đã đặt thành công
.jpg)
Thầy Dương Quang Huy – Giảng viên Khoa CNTT - ĐT